diff --git a/.changeset/quiet-ghosts-float.md b/.changeset/quiet-ghosts-float.md new file mode 100644 index 0000000000..dc8df90206 --- /dev/null +++ b/.changeset/quiet-ghosts-float.md @@ -0,0 +1,12 @@ +--- +'@backstage/plugin-entity-validation': patch +'@backstage/core-components': patch +'@backstage/plugin-kubernetes': patch +'@backstage/plugin-scaffolder': patch +'@backstage/plugin-circleci': patch +'@backstage/plugin-playlist': patch +'@backstage/plugin-techdocs': patch +'@backstage/plugin-explore': patch +--- + +Switch to using `LinkButton` instead of the deprecated `Button` diff --git a/packages/core-components/api-report.md b/packages/core-components/api-report.md index 721c208406..6439be23a7 100644 --- a/packages/core-components/api-report.md +++ b/packages/core-components/api-report.md @@ -131,7 +131,7 @@ export type BreadcrumbsStyledBoxClassKey = 'root'; export function BrokenImageIcon(props: IconComponentProps): JSX.Element; // @public @deprecated (undocumented) -export const Button: (props: ButtonProps) => JSX.Element; +export const Button: (props: LinkButtonProps) => JSX.Element; // @public @deprecated (undocumented) export type ButtonProps = LinkButtonProps; @@ -631,7 +631,7 @@ export function LinearGauge(props: Props_11): JSX.Element | null; export const Link: (props: LinkProps) => JSX.Element; // @public -export const LinkButton: (props: ButtonProps) => JSX.Element; +export const LinkButton: (props: LinkButtonProps) => JSX.Element; // @public export type LinkButtonProps = ButtonProps_2 & diff --git a/packages/core-components/src/components/LinkButton/LinkButton.tsx b/packages/core-components/src/components/LinkButton/LinkButton.tsx index a6ba4d67a7..7da25bcb41 100644 --- a/packages/core-components/src/components/LinkButton/LinkButton.tsx +++ b/packages/core-components/src/components/LinkButton/LinkButton.tsx @@ -44,9 +44,11 @@ const LinkWrapper = React.forwardRef((props, ref) => ( * @public * @remarks */ -export const LinkButton = React.forwardRef((props, ref) => ( - -)) as (props: ButtonProps) => JSX.Element; +export const LinkButton = React.forwardRef( + (props, ref) => ( + + ), +) as (props: LinkButtonProps) => JSX.Element; /** * @public diff --git a/packages/core-components/src/layout/ErrorBoundary/ErrorBoundary.tsx b/packages/core-components/src/layout/ErrorBoundary/ErrorBoundary.tsx index 9157b57fe2..037e170640 100644 --- a/packages/core-components/src/layout/ErrorBoundary/ErrorBoundary.tsx +++ b/packages/core-components/src/layout/ErrorBoundary/ErrorBoundary.tsx @@ -16,7 +16,7 @@ import Typography from '@material-ui/core/Typography'; import React, { ComponentClass, Component, ErrorInfo } from 'react'; -import { Button } from '../../components/LinkButton'; +import { LinkButton } from '../../components/LinkButton'; import { ErrorPanel } from '../../components/ErrorPanel'; type SlackChannel = { @@ -49,9 +49,9 @@ const SlackLink = (props: { slackChannel?: string | SlackChannel }) => { } return ( - + ); }; diff --git a/packages/core-components/src/layout/ItemCard/ItemCard.stories.tsx b/packages/core-components/src/layout/ItemCard/ItemCard.stories.tsx index f7df3d43cc..1ba3dec3fd 100644 --- a/packages/core-components/src/layout/ItemCard/ItemCard.stories.tsx +++ b/packages/core-components/src/layout/ItemCard/ItemCard.stories.tsx @@ -22,7 +22,7 @@ import CardMedia from '@material-ui/core/CardMedia'; import Typography from '@material-ui/core/Typography'; import React from 'react'; import { MemoryRouter } from 'react-router-dom'; -import { Button } from '../../components'; +import { LinkButton } from '../../components'; import { ItemCardGrid } from './ItemCardGrid'; import { ItemCardHeader } from './ItemCardHeader'; @@ -63,9 +63,9 @@ export const Default = () => ( .join(' ')} - + ))} @@ -99,9 +99,9 @@ export const Styling = () => { .join(' ')} - + ))} diff --git a/packages/core-components/src/layout/ItemCard/ItemCard.tsx b/packages/core-components/src/layout/ItemCard/ItemCard.tsx index fedcf7de8f..0b1ee34c0c 100644 --- a/packages/core-components/src/layout/ItemCard/ItemCard.tsx +++ b/packages/core-components/src/layout/ItemCard/ItemCard.tsx @@ -21,7 +21,7 @@ import CardContent from '@material-ui/core/CardContent'; import CardMedia from '@material-ui/core/CardMedia'; import Chip from '@material-ui/core/Chip'; import React, { ReactNode } from 'react'; -import { Button } from '../../components'; +import { LinkButton } from '../../components'; import { ItemCardHeader } from './ItemCardHeader'; type ItemCardProps = { @@ -80,14 +80,14 @@ export function ItemCard(props: ItemCardProps) { {!href && ( - + )} {href && ( - + )} diff --git a/plugins/circleci/src/components/BuildWithStepsPage/BuildWithStepsPage.tsx b/plugins/circleci/src/components/BuildWithStepsPage/BuildWithStepsPage.tsx index 8d48be915e..8a5dc1c47f 100644 --- a/plugins/circleci/src/components/BuildWithStepsPage/BuildWithStepsPage.tsx +++ b/plugins/circleci/src/components/BuildWithStepsPage/BuildWithStepsPage.tsx @@ -24,7 +24,7 @@ import LaunchIcon from '@material-ui/icons/Launch'; import { useBuildWithSteps } from '../../state/useBuildWithSteps'; import { Breadcrumbs, - Button, + LinkButton, InfoCard, Progress, Link, @@ -33,9 +33,9 @@ import { const BuildName = ({ build }: { build?: BuildWithSteps }) => ( #{build?.build_num} - {build?.subject} - + ); diff --git a/plugins/entity-validation/src/components/EntityValidationPage/EntityValidationPage.tsx b/plugins/entity-validation/src/components/EntityValidationPage/EntityValidationPage.tsx index 52628e6ad2..0f0e60366b 100644 --- a/plugins/entity-validation/src/components/EntityValidationPage/EntityValidationPage.tsx +++ b/plugins/entity-validation/src/components/EntityValidationPage/EntityValidationPage.tsx @@ -13,6 +13,7 @@ * See the License for the specific language governing permissions and * limitations under the License. */ + import React, { useState } from 'react'; import { Content, Header, LinkButton, Page } from '@backstage/core-components'; import { EntityTextArea } from '../EntityTextArea'; diff --git a/plugins/explore/src/components/DomainCard/DomainCard.tsx b/plugins/explore/src/components/DomainCard/DomainCard.tsx index a20a5e1f0c..0d37e3e273 100644 --- a/plugins/explore/src/components/DomainCard/DomainCard.tsx +++ b/plugins/explore/src/components/DomainCard/DomainCard.tsx @@ -31,7 +31,7 @@ import { } from '@material-ui/core'; import React from 'react'; -import { Button, ItemCardHeader } from '@backstage/core-components'; +import { LinkButton, ItemCardHeader } from '@backstage/core-components'; import { useRouteRef } from '@backstage/core-plugin-api'; /** @public */ @@ -66,9 +66,9 @@ export const DomainCard = (props: { entity: DomainEntity }) => { {entity.metadata.description} - + ); diff --git a/plugins/explore/src/components/ToolCard/ToolCard.tsx b/plugins/explore/src/components/ToolCard/ToolCard.tsx index 904db0c00b..27729ea085 100644 --- a/plugins/explore/src/components/ToolCard/ToolCard.tsx +++ b/plugins/explore/src/components/ToolCard/ToolCard.tsx @@ -26,7 +26,7 @@ import { makeStyles, Typography, } from '@material-ui/core'; -import { Button } from '@backstage/core-components'; +import { LinkButton } from '@backstage/core-components'; import classNames from 'classnames'; import React from 'react'; @@ -97,9 +97,9 @@ export const ToolCard = ({ card, objectFit }: Props) => { )} - + ); diff --git a/plugins/kubernetes/src/components/KubernetesDrawer/KubernetesDrawer.tsx b/plugins/kubernetes/src/components/KubernetesDrawer/KubernetesDrawer.tsx index 8a177cf6dd..7e194c3ec2 100644 --- a/plugins/kubernetes/src/components/KubernetesDrawer/KubernetesDrawer.tsx +++ b/plugins/kubernetes/src/components/KubernetesDrawer/KubernetesDrawer.tsx @@ -33,7 +33,7 @@ import { V1ObjectMeta } from '@kubernetes/client-node'; import { withStyles } from '@material-ui/core/styles'; import jsYaml from 'js-yaml'; import { - Button as BackstageButton, + LinkButton as BackstageButton, CodeSnippet, StructuredMetadataTable, WarningPanel, diff --git a/plugins/playlist/src/components/PlaylistCard/PlaylistCard.tsx b/plugins/playlist/src/components/PlaylistCard/PlaylistCard.tsx index 2db7e85f7e..1bf698f6be 100644 --- a/plugins/playlist/src/components/PlaylistCard/PlaylistCard.tsx +++ b/plugins/playlist/src/components/PlaylistCard/PlaylistCard.tsx @@ -15,8 +15,8 @@ */ import { - Button, ItemCardHeader, + LinkButton, MarkdownContent, } from '@backstage/core-components'; import { useRouteRef } from '@backstage/core-plugin-api'; @@ -118,13 +118,13 @@ export const PlaylistCard = ({ playlist }: PlaylistCardProps) => { - + ); diff --git a/plugins/scaffolder/src/components/TemplateCard/TemplateCard.tsx b/plugins/scaffolder/src/components/TemplateCard/TemplateCard.tsx index 984e51f3b5..e557f4d165 100644 --- a/plugins/scaffolder/src/components/TemplateCard/TemplateCard.tsx +++ b/plugins/scaffolder/src/components/TemplateCard/TemplateCard.tsx @@ -13,6 +13,7 @@ * See the License for the specific language governing permissions and * limitations under the License. */ + import { DEFAULT_NAMESPACE, Entity, @@ -22,9 +23,9 @@ import { stringifyEntityRef, } from '@backstage/catalog-model'; import { - Button, ItemCardHeader, Link, + LinkButton, MarkdownContent, } from '@backstage/core-components'; import { @@ -291,13 +292,13 @@ export const TemplateCard = ({ template, deprecated }: TemplateCardProps) => { ))} - + ); diff --git a/plugins/search-react/src/components/DefaultResultListItem/DefaultResultListItem.stories.tsx b/plugins/search-react/src/components/DefaultResultListItem/DefaultResultListItem.stories.tsx index a790c12a8a..7049b7f4ef 100644 --- a/plugins/search-react/src/components/DefaultResultListItem/DefaultResultListItem.stories.tsx +++ b/plugins/search-react/src/components/DefaultResultListItem/DefaultResultListItem.stories.tsx @@ -14,7 +14,7 @@ * limitations under the License. */ -import { Button } from '@backstage/core-components'; +import { LinkButton } from '@backstage/core-components'; import { lightTheme } from '@backstage/theme'; import { Grid } from '@material-ui/core'; import CssBaseline from '@material-ui/core/CssBaseline'; @@ -66,7 +66,7 @@ export const WithSecondaryAction = () => { { style={{ textTransform: 'lowercase' }} > {mockSearchResult.owner} - + } /> ); diff --git a/plugins/techdocs/src/home/components/Grids/DocsCardGrid.tsx b/plugins/techdocs/src/home/components/Grids/DocsCardGrid.tsx index 6f1d9fbe61..8843249291 100644 --- a/plugins/techdocs/src/home/components/Grids/DocsCardGrid.tsx +++ b/plugins/techdocs/src/home/components/Grids/DocsCardGrid.tsx @@ -19,7 +19,7 @@ import { toLowerMaybe } from '../../../helpers'; import { Entity } from '@backstage/catalog-model'; import { useApi, useRouteRef, configApiRef } from '@backstage/core-plugin-api'; import { - Button, + LinkButton, ItemCardGrid, ItemCardHeader, } from '@backstage/core-components'; @@ -58,7 +58,7 @@ export const DocsCardGrid = (props: DocsCardGridProps) => { {entity.metadata.description} - + ))} diff --git a/plugins/techdocs/src/home/components/Tables/DocsTable.tsx b/plugins/techdocs/src/home/components/Tables/DocsTable.tsx index 842c80018f..5e5b41ee3e 100644 --- a/plugins/techdocs/src/home/components/Tables/DocsTable.tsx +++ b/plugins/techdocs/src/home/components/Tables/DocsTable.tsx @@ -25,7 +25,7 @@ import { } from '@backstage/plugin-catalog-react'; import { rootDocsRouteRef } from '../../../routes'; import { - Button, + LinkButton, EmptyState, Table, TableColumn, @@ -121,13 +121,13 @@ export const DocsTable = (props: DocsTableProps) => { title="No documents to show" description="Create your own document. Check out our Getting Started Information" action={ - + } /> )}