diff --git a/.changeset/nine-hornets-wave.md b/.changeset/nine-hornets-wave.md new file mode 100644 index 0000000000..7eab7fadc5 --- /dev/null +++ b/.changeset/nine-hornets-wave.md @@ -0,0 +1,5 @@ +--- +'@backstage/plugin-scaffolder': patch +--- + +Provide a link to the template source on the `TemplateCard`. diff --git a/plugins/scaffolder/src/components/TemplateCard/TemplateCard.tsx b/plugins/scaffolder/src/components/TemplateCard/TemplateCard.tsx index 7e34c0d868..db0d583cb8 100644 --- a/plugins/scaffolder/src/components/TemplateCard/TemplateCard.tsx +++ b/plugins/scaffolder/src/components/TemplateCard/TemplateCard.tsx @@ -13,7 +13,21 @@ * See the License for the specific language governing permissions and * limitations under the License. */ -import { Button, ItemCardHeader, useRouteRef } from '@backstage/core'; +import { + Entity, + RELATION_OWNED_BY, + TemplateEntityV1alpha1, +} from '@backstage/catalog-model'; +import { Button, ItemCardHeader, useApi, useRouteRef } from '@backstage/core'; +import { + ScmIntegrationIcon, + scmIntegrationsApiRef, +} from '@backstage/integration-react'; +import { + EntityRefLinks, + getEntityRelations, + getEntitySourceLocation, +} from '@backstage/plugin-catalog-react'; import { BackstageTheme, pageTheme } from '@backstage/theme'; import { Box, @@ -22,26 +36,18 @@ import { CardContent, CardMedia, Chip, + IconButton, Link, makeStyles, Tooltip, Typography, useTheme, } from '@material-ui/core'; -import React from 'react'; import WarningIcon from '@material-ui/icons/Warning'; +import React from 'react'; import { generatePath } from 'react-router'; import { rootRouteRef } from '../../routes'; -import { - TemplateEntityV1alpha1, - Entity, - RELATION_OWNED_BY, -} from '@backstage/catalog-model'; import { FavouriteTemplate } from '../FavouriteTemplate/FavouriteTemplate'; -import { - getEntityRelations, - EntityRefLinks, -} from '@backstage/plugin-catalog-react'; const useStyles = makeStyles(theme => ({ cardHeader: { @@ -67,6 +73,9 @@ const useStyles = makeStyles(theme => ({ lineHeight: 1, paddingBottom: '0.2rem', }, + leftButton: { + marginRight: 'auto', + }, })); const useDeprecationStyles = makeStyles(theme => ({ @@ -145,6 +154,9 @@ export const TemplateCard = ({ template, deprecated }: TemplateCardProps) => { templateName: templateProps.name, }); + const scmIntegrationsApi = useApi(scmIntegrationsApiRef); + const sourceLocation = getEntitySourceLocation(template, scmIntegrationsApi); + return ( @@ -179,6 +191,14 @@ export const TemplateCard = ({ template, deprecated }: TemplateCardProps) => { + {sourceLocation && ( + + + + )}