diff --git a/plugins/scaffolder/src/next/TemplateListPage/TemplateGroups.test.tsx b/plugins/scaffolder/src/next/TemplateListPage/TemplateGroups.test.tsx
new file mode 100644
index 0000000000..35f878a5d1
--- /dev/null
+++ b/plugins/scaffolder/src/next/TemplateListPage/TemplateGroups.test.tsx
@@ -0,0 +1,40 @@
+/*
+ * Copyright 2022 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.
+ */
+
+jest.mock('@backstage/plugin-catalog-react', () => ({
+ useEntityList: jest.fn(),
+}));
+
+import React from 'react';
+import { render } from '@testing-library/react';
+import { useEntityList } from '@backstage/plugin-catalog-react';
+import { TemplateGroups } from './TemplateGroups';
+import { TestApiProvider } from '@backstage/test-utils';
+import { errorApiRef } from '@backstage/core-plugin-api';
+
+describe('TemplateGroups', () => {
+ it('should return progress if the hook is loading', async () => {
+ (useEntityList as jest.Mock).mockReturnValue({ loading: true });
+
+ const { findByTestId } = render(
+
+
+ ,
+ );
+
+ expect(await findByTestId('progress')).toBeInTheDocument();
+ });
+});
diff --git a/plugins/scaffolder/src/next/TemplateListPage/TemplateGroups.tsx b/plugins/scaffolder/src/next/TemplateListPage/TemplateGroups.tsx
index 17790729b1..59abe8c34c 100644
--- a/plugins/scaffolder/src/next/TemplateListPage/TemplateGroups.tsx
+++ b/plugins/scaffolder/src/next/TemplateListPage/TemplateGroups.tsx
@@ -13,14 +13,17 @@
* See the License for the specific language governing permissions and
* limitations under the License.
*/
+import React from 'react';
import { TemplateGroup } from './TemplateGroup';
import { Entity } from '@backstage/catalog-model';
import { useEntityList } from '@backstage/plugin-catalog-react';
import { TemplateEntityV1beta3 } from '@backstage/plugin-scaffolder-common';
+import { Progress, Link } from '@backstage/core-components';
+import { Typography } from '@material-ui/core';
+import { errorApiRef, useApi } from '@backstage/core-plugin-api';
export type TemplateGroupFilter = {
- title?: string;
- titleComponent?: React.ReactNode;
+ title?: React.ReactNode;
filter: (entity: Entity) => boolean;
};
@@ -33,5 +36,27 @@ export interface TemplateGroupsProps {
export const TemplateGroups = (props: TemplateGroupsProps) => {
const { loading, error, entities } = useEntityList();
+ const errorApi = useApi(errorApiRef);
+
+ if (loading) {
+ return ;
+ }
+
+ if (error) {
+ errorApi.post(error);
+ }
+
+ if (!entities) {
+ return (
+
+ No templates found that match your filter. Learn more about{' '}
+
+ adding templates
+
+ .
+
+ );
+ }
+
return null;
};
diff --git a/plugins/scaffolder/src/next/TemplateListPage/TemplateListPage.test.tsx b/plugins/scaffolder/src/next/TemplateListPage/TemplateListPage.test.tsx
index 1f6c60237c..7aee8cc397 100644
--- a/plugins/scaffolder/src/next/TemplateListPage/TemplateListPage.test.tsx
+++ b/plugins/scaffolder/src/next/TemplateListPage/TemplateListPage.test.tsx
@@ -28,11 +28,29 @@ import React from 'react';
import { TemplateListPage } from './TemplateListPage';
describe('TemplateListPage', () => {
+ const mockCatalogApi = {
+ getEntities: async () => ({
+ items: [
+ {
+ apiVersion: 'scaffolder.backstage.io/v1beta3',
+ kind: 'Template',
+ metadata: { name: 'blob', tags: ['blob'] },
+ spec: {
+ type: 'service',
+ },
+ },
+ ],
+ }),
+ getEntityFacets: async () => ({
+ facets: { 'spec.type': [{ value: 'service', count: 1 }] },
+ }),
+ };
+
it('should render the search bar for templates', async () => {
const { getByPlaceholderText } = await renderInTestApp(
{
const { getByRole } = await renderInTestApp(
{
const { getByText } = await renderInTestApp(
{
const { getByText } = await renderInTestApp(
({
- items: [
- {
- apiVersion: 'scaffolder.backstage.io/v1beta3',
- kind: 'Template',
- metadata: { name: 'blob', tags: ['blob'] },
- },
- ],
- }),
- },
- ],
+ [catalogApiRef, mockCatalogApi],
[
starredEntitiesApiRef,
new DefaultStarredEntitiesApi({
diff --git a/plugins/scaffolder/src/next/TemplateListPage/TemplateListPage.tsx b/plugins/scaffolder/src/next/TemplateListPage/TemplateListPage.tsx
index 497f78594c..9f7961a077 100644
--- a/plugins/scaffolder/src/next/TemplateListPage/TemplateListPage.tsx
+++ b/plugins/scaffolder/src/next/TemplateListPage/TemplateListPage.tsx
@@ -22,7 +22,6 @@ import {
Content,
ContentHeader,
Header,
- Lifecycle,
Page,
SupportButton,
} from '@backstage/core-components';