feat: added NavLogoBlueprint

Signed-off-by: blam <ben@blam.sh>

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: <div>Logo Full</div>,
+        logoIcon: <div>Logo Icon</div>,
+      },
+    });
+
+    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 = <div>Logo Full</div>;
+    const logoIcon = <div>Logo Icon</div>;
+
+    const extension = NavLogoBlueprint.make({
+      name: 'test',
+      params: {
+        logoFull,
+        logoIcon,
+      },
+    });
+
+    const tester = createExtensionTester(extension);
+
+    expect(tester.data(NavLogoBlueprint.dataRefs.logoElements)).toEqual({
+      logoFull,
+      logoIcon,
+    });
+  });
+});

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,
+    });
+  },
+});

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,

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 = () => <div>MockSignInPage</div>;
+    const MockSignInPage = () => <div data-test-id="mock-sign-in" />;
 
     const extension = SignInPageBlueprint.make({
       params: { loader: async () => () => <MockSignInPage /> },
@@ -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();
     });
   });
 });