diff --git a/plugins/scaffolder/src/next/TemplateListPage/TemplateGroups.test.tsx b/plugins/scaffolder-react/src/next/components/TemplateGroups/TemplateGroups.test.tsx similarity index 90% rename from plugins/scaffolder/src/next/TemplateListPage/TemplateGroups.test.tsx rename to plugins/scaffolder-react/src/next/components/TemplateGroups/TemplateGroups.test.tsx index c0fb503d9b..c03af41f99 100644 --- a/plugins/scaffolder/src/next/TemplateListPage/TemplateGroups.test.tsx +++ b/plugins/scaffolder-react/src/next/components/TemplateGroups/TemplateGroups.test.tsx @@ -28,7 +28,6 @@ import { TemplateGroups } from './TemplateGroups'; import { renderInTestApp, TestApiProvider } from '@backstage/test-utils'; import { errorApiRef } from '@backstage/core-plugin-api'; import { TemplateGroup } from '@backstage/plugin-scaffolder-react/alpha'; -import { rootRouteRef } from '../../routes'; describe('TemplateGroups', () => { beforeEach(() => jest.clearAllMocks()); @@ -40,11 +39,6 @@ describe('TemplateGroups', () => { , - { - mountedRoutes: { - '/create': rootRouteRef, - }, - }, ); expect(await findByTestId('progress')).toBeInTheDocument(); @@ -62,11 +56,6 @@ describe('TemplateGroups', () => { , - { - mountedRoutes: { - '/create': rootRouteRef, - }, - }, ); expect(errorApi.post).toHaveBeenCalledWith(mockError); @@ -83,11 +72,6 @@ describe('TemplateGroups', () => { , - { - mountedRoutes: { - '/create': rootRouteRef, - }, - }, ); expect(await findByText(/No templates found/)).toBeInTheDocument(); @@ -104,11 +88,6 @@ describe('TemplateGroups', () => { , - { - mountedRoutes: { - '/create': rootRouteRef, - }, - }, ); expect(await findByText(/No templates found/)).toBeInTheDocument(); @@ -144,11 +123,6 @@ describe('TemplateGroups', () => { true }]} /> , - { - mountedRoutes: { - '/create': rootRouteRef, - }, - }, ); expect(TemplateGroup).toHaveBeenCalledWith( @@ -193,11 +167,6 @@ describe('TemplateGroups', () => { groups={[{ title: 'all', filter: e => e.metadata.name === 't1' }]} /> , - { - mountedRoutes: { - '/create': rootRouteRef, - }, - }, ); expect(TemplateGroup).toHaveBeenCalledWith( @@ -241,11 +210,6 @@ describe('TemplateGroups', () => { templateFilter={e => e.metadata.name === 't1'} /> , - { - mountedRoutes: { - '/create': rootRouteRef, - }, - }, ); expect(TemplateGroup).toHaveBeenCalledWith( diff --git a/plugins/scaffolder/src/next/TemplateListPage/TemplateGroups.tsx b/plugins/scaffolder-react/src/next/components/TemplateGroups/TemplateGroups.tsx similarity index 72% rename from plugins/scaffolder/src/next/TemplateListPage/TemplateGroups.tsx rename to plugins/scaffolder-react/src/next/components/TemplateGroups/TemplateGroups.tsx index 8d4b3f8470..ccf12b9309 100644 --- a/plugins/scaffolder/src/next/TemplateListPage/TemplateGroups.tsx +++ b/plugins/scaffolder-react/src/next/components/TemplateGroups/TemplateGroups.tsx @@ -17,19 +17,22 @@ import React, { useCallback } from 'react'; import { parseEntityRef, stringifyEntityRef } from '@backstage/catalog-model'; import { useEntityList } from '@backstage/plugin-catalog-react'; -import { TemplateEntityV1beta3 } from '@backstage/plugin-scaffolder-common'; +import { + isTemplateEntityV1beta3, + TemplateEntityV1beta3, +} from '@backstage/plugin-scaffolder-common'; import { Progress, Link, DocsIcon } from '@backstage/core-components'; import { Typography } from '@material-ui/core'; import { errorApiRef, + IconComponent, useApi, useApp, useRouteRef, } from '@backstage/core-plugin-api'; import { TemplateGroup } from '@backstage/plugin-scaffolder-react/alpha'; -import { viewTechDocRouteRef, selectedTemplateRouteRef } from '../../routes'; +import { viewTechDocRouteRef } from '../../routes'; import { useNavigate } from 'react-router-dom'; -import { isTemplateEntity } from '../../lib/isTemplateEntity'; /** * @alpha @@ -48,6 +51,15 @@ export interface TemplateGroupsProps { TemplateCardComponent?: React.ComponentType<{ template: TemplateEntityV1beta3; }>; + onTemplateSelected?: (template: { + namespace: string; + templateName: string; + }) => void; + additionalLinksForEntity?: (template: TemplateEntityV1beta3) => { + icon: IconComponent; + text: string; + url: string; + }[]; } /** @@ -55,18 +67,15 @@ export interface TemplateGroupsProps { */ export const TemplateGroups = (props: TemplateGroupsProps) => { const { loading, error, entities } = useEntityList(); - const { groups, templateFilter, TemplateCardComponent } = props; + const { groups, templateFilter, TemplateCardComponent, onTemplateSelected } = + props; const errorApi = useApi(errorApiRef); - const app = useApp(); - const viewTechDocsLink = useRouteRef(viewTechDocRouteRef); - const templateRoute = useRouteRef(selectedTemplateRouteRef); - const navigate = useNavigate(); const onSelected = useCallback( (template: TemplateEntityV1beta3) => { const { namespace, name } = parseEntityRef(stringifyEntityRef(template)); - navigate(templateRoute({ namespace, templateName: name })); + onTemplateSelected?.({ namespace, templateName: name }); }, - [navigate, templateRoute], + [onTemplateSelected], ); if (loading) { @@ -94,24 +103,12 @@ export const TemplateGroups = (props: TemplateGroupsProps) => { <> {groups.map(({ title, filter }, index) => { const templates = entities - .filter(isTemplateEntity) + .filter(isTemplateEntityV1beta3) .filter(e => (templateFilter ? !templateFilter(e) : true)) .filter(filter) .map(template => { - const { kind, namespace, name } = parseEntityRef( - stringifyEntityRef(template), - ); const additionalLinks = - template.metadata.annotations?.['backstage.io/techdocs-ref'] && - viewTechDocsLink - ? [ - { - icon: app.getSystemIcon('docs') ?? DocsIcon, - text: 'View TechDocs', - url: viewTechDocsLink({ kind, namespace, name }), - }, - ] - : []; + props.additionalLinksForEntity?.(template) ?? []; return { template, diff --git a/plugins/scaffolder-react/src/next/components/TemplateGroups/index.ts b/plugins/scaffolder-react/src/next/components/TemplateGroups/index.ts new file mode 100644 index 0000000000..765883916c --- /dev/null +++ b/plugins/scaffolder-react/src/next/components/TemplateGroups/index.ts @@ -0,0 +1,16 @@ +/* + * Copyright 2023 The Backstage Authors + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +export * from './TemplateGroups';