From b7506f214ea83a5e833261de20e30ec8e92bbe7b Mon Sep 17 00:00:00 2001 From: blam Date: Wed, 7 Aug 2024 09:53:02 +0200 Subject: [PATCH] feat: added NavLogoBlueprint Signed-off-by: blam --- .../src/extensions/NavLogoBlueprint.test.tsx | 71 +++++++++++++++++++ .../src/extensions/NavLogoBlueprint.ts | 39 ++++++++++ .../src/extensions/RouterBlueprint.tsx | 3 + .../extensions/SignInPageBlueprint.test.tsx | 6 +- 4 files changed, 116 insertions(+), 3 deletions(-) create mode 100644 packages/frontend-plugin-api/src/extensions/NavLogoBlueprint.test.tsx create mode 100644 packages/frontend-plugin-api/src/extensions/NavLogoBlueprint.ts diff --git a/packages/frontend-plugin-api/src/extensions/NavLogoBlueprint.test.tsx b/packages/frontend-plugin-api/src/extensions/NavLogoBlueprint.test.tsx new file mode 100644 index 0000000000..fa01862785 --- /dev/null +++ b/packages/frontend-plugin-api/src/extensions/NavLogoBlueprint.test.tsx @@ -0,0 +1,71 @@ +/* + * 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 { NavLogoBlueprint } from './NavLogoBlueprint'; +import { createExtensionTester } from '@backstage/frontend-test-utils'; + +describe('NavLogoBlueprint', () => { + it('should create an extension with sensible defaults', () => { + const extension = NavLogoBlueprint.make({ + params: { + logoFull:
Logo Full
, + logoIcon:
Logo Icon
, + }, + }); + + expect(extension).toMatchInlineSnapshot(` + { + "$$type": "@backstage/ExtensionDefinition", + "attachTo": { + "id": "app/nav", + "input": "logos", + }, + "configSchema": undefined, + "disabled": false, + "factory": [Function], + "inputs": {}, + "kind": "nav-logo", + "name": undefined, + "namespace": undefined, + "output": [ + [Function], + ], + "toString": [Function], + "version": "v2", + } + `); + }); + + it('should return a valid component ref', () => { + const logoFull =
Logo Full
; + const logoIcon =
Logo Icon
; + + const extension = NavLogoBlueprint.make({ + name: 'test', + params: { + logoFull, + logoIcon, + }, + }); + + const tester = createExtensionTester(extension); + + expect(tester.data(NavLogoBlueprint.dataRefs.logoElements)).toEqual({ + logoFull, + logoIcon, + }); + }); +}); diff --git a/packages/frontend-plugin-api/src/extensions/NavLogoBlueprint.ts b/packages/frontend-plugin-api/src/extensions/NavLogoBlueprint.ts new file mode 100644 index 0000000000..d119287f29 --- /dev/null +++ b/packages/frontend-plugin-api/src/extensions/NavLogoBlueprint.ts @@ -0,0 +1,39 @@ +/* + * 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 { createExtensionBlueprint } from '../wiring'; +import { createNavLogoExtension } from './createNavLogoExtension'; + +export const NavLogoBlueprint = createExtensionBlueprint({ + kind: 'nav-logo', + attachTo: { id: 'app/nav', input: 'logos' }, + output: [createNavLogoExtension.logoElementsDataRef], + dataRefs: { + logoElements: createNavLogoExtension.logoElementsDataRef, + }, + *factory({ + logoIcon, + logoFull, + }: { + logoIcon: JSX.Element; + logoFull: JSX.Element; + }) { + yield createNavLogoExtension.logoElementsDataRef({ + logoIcon, + logoFull, + }); + }, +}); diff --git a/packages/frontend-plugin-api/src/extensions/RouterBlueprint.tsx b/packages/frontend-plugin-api/src/extensions/RouterBlueprint.tsx index 9e9cddbdd1..bf910eb944 100644 --- a/packages/frontend-plugin-api/src/extensions/RouterBlueprint.tsx +++ b/packages/frontend-plugin-api/src/extensions/RouterBlueprint.tsx @@ -21,6 +21,9 @@ export const RouterBlueprint = createExtensionBlueprint({ kind: 'app-router-component', attachTo: { id: 'app/root', input: 'router' }, output: [createRouterExtension.componentDataRef], + dataRefs: { + component: createRouterExtension.componentDataRef, + }, *factory( { Component, diff --git a/packages/frontend-plugin-api/src/extensions/SignInPageBlueprint.test.tsx b/packages/frontend-plugin-api/src/extensions/SignInPageBlueprint.test.tsx index 7bbeb4e5d7..11fe1420f1 100644 --- a/packages/frontend-plugin-api/src/extensions/SignInPageBlueprint.test.tsx +++ b/packages/frontend-plugin-api/src/extensions/SignInPageBlueprint.test.tsx @@ -48,7 +48,7 @@ describe('SignInPageBlueprint', () => { }); it('should return the component as the componentRef', async () => { - const MockSignInPage = () =>
MockSignInPage
; + const MockSignInPage = () =>
; const extension = SignInPageBlueprint.make({ params: { loader: async () => () => }, @@ -57,11 +57,11 @@ describe('SignInPageBlueprint', () => { const tester = createExtensionTester(extension); expect(tester.data(SignInPageBlueprint.dataRefs.component)).toBeDefined(); - const { getByText } = tester.render(); + const { getByTestId } = tester.render(); // todo(blam): need a better way to test this, currently fails. await waitFor(() => { - expect(getByText('MockSignInPage')).toBeInTheDocument(); + expect(getByTestId('mock-sign-in')).toBeInTheDocument(); }); }); });