)];
+ },
+ });
+
+ createExtensionTester(extension, { config: { mock: 'mock test config' } })
+ .add(mockExtension)
+ .render();
+
+ await waitFor(() => {
+ expect(screen.getByTestId('test')).toBeInTheDocument();
+ expect(screen.getByTestId('test')).toHaveTextContent(
+ 'config: mock test config',
+ );
+ expect(screen.getByTestId('contents')).toHaveTextContent('im a mock');
+ });
+ });
+});
diff --git a/plugins/catalog-react/src/alpha/blueprints/EntityCardBlueprint.tsx b/plugins/catalog-react/src/alpha/blueprints/EntityCardBlueprint.tsx
new file mode 100644
index 0000000000..c3153b6059
--- /dev/null
+++ b/plugins/catalog-react/src/alpha/blueprints/EntityCardBlueprint.tsx
@@ -0,0 +1,75 @@
+/*
+ * Copyright 2024 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.
+ */
+import React, { lazy } from 'react';
+import {
+ ExtensionBoundary,
+ coreExtensionData,
+ createExtensionBlueprint,
+} from '@backstage/frontend-plugin-api';
+import { catalogExtensionData } from '../extensions';
+
+/**
+ * @alpha
+ * A blueprint for creating cards for the entity pages in the catalog.
+ */
+export const EntityCardBlueprint = createExtensionBlueprint({
+ kind: 'entity-card',
+ attachTo: { id: 'entity-content:catalog/overview', input: 'cards' },
+ output: [
+ coreExtensionData.reactElement,
+ catalogExtensionData.entityFilterFunction.optional(),
+ catalogExtensionData.entityFilterExpression.optional(),
+ ],
+ dataRefs: {
+ filterFunction: catalogExtensionData.entityFilterFunction,
+ filterExpression: catalogExtensionData.entityFilterExpression,
+ },
+ config: {
+ schema: {
+ filter: z => z.string().optional(),
+ },
+ },
+ *factory(
+ {
+ loader,
+ filter,
+ }: {
+ loader: () => Promise;
+ filter?:
+ | typeof catalogExtensionData.entityFilterFunction.T
+ | typeof catalogExtensionData.entityFilterExpression.T;
+ },
+ { node, config },
+ ) {
+ const ExtensionComponent = lazy(() =>
+ loader().then(element => ({ default: () => element })),
+ );
+
+ yield coreExtensionData.reactElement(
+
+
+ ,
+ );
+
+ if (config.filter) {
+ yield catalogExtensionData.entityFilterExpression(config.filter);
+ } else if (typeof filter === 'string') {
+ yield catalogExtensionData.entityFilterExpression(filter);
+ } else if (typeof filter === 'function') {
+ yield catalogExtensionData.entityFilterFunction(filter);
+ }
+ },
+});
diff --git a/plugins/catalog-react/src/alpha/blueprints/EntityContentBlueprint.test.tsx b/plugins/catalog-react/src/alpha/blueprints/EntityContentBlueprint.test.tsx
new file mode 100644
index 0000000000..dab6013bab
--- /dev/null
+++ b/plugins/catalog-react/src/alpha/blueprints/EntityContentBlueprint.test.tsx
@@ -0,0 +1,226 @@
+/*
+ * Copyright 2024 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.
+ */
+import React from 'react';
+import { EntityContentBlueprint } from './EntityContentBlueprint';
+import { createExtensionTester } from '@backstage/frontend-test-utils';
+import {
+ coreExtensionData,
+ createExtension,
+ createExtensionInput,
+ createRouteRef,
+} from '@backstage/frontend-plugin-api';
+import { Entity } from '@backstage/catalog-model';
+import { waitFor, screen } from '@testing-library/react';
+
+describe('EntityContentBlueprint', () => {
+ it('should return an extension with sane defaults', () => {
+ const extension = EntityContentBlueprint.make({
+ name: 'test',
+ params: {
+ defaultPath: '/test',
+ defaultTitle: 'Test',
+ loader: async () =>