frontend-plugin-api: add createSignInPageExtension

Co-authored-by: Camila Belo <camilaibs@gmail.com>
Co-authored-by: Vincenzo Scamporlino <vincenzos@spotify.com>
Co-authored-by: Philipp Hugenroth <philipph@spotify.com>
Signed-off-by: Patrik Oldsberg <poldsberg@gmail.com>

packages/frontend-plugin-api/api-report.md

@@ -68,6 +68,7 @@ import { default as React_2 } from 'react';
 import { ReactNode } from 'react';
 import { SessionApi } from '@backstage/core-plugin-api';
 import { SessionState } from '@backstage/core-plugin-api';
+import { SignInPageProps } from '@backstage/core-plugin-api';
 import { StorageApi } from '@backstage/core-plugin-api';
 import { storageApiRef } from '@backstage/core-plugin-api';
 import { StorageValueSnapshot } from '@backstage/core-plugin-api';
@@ -454,6 +455,25 @@ export function createSchemaFromZod<TOutput, TInput>(
   schemaCreator: (zImpl: typeof z) => ZodSchema<TOutput, ZodTypeDef, TInput>,
 ): PortableSchema<TOutput>;
 
+// @public (undocumented)
+export function createSignInPageExtension<
+  TConfig extends {},
+  TInputs extends AnyExtensionInputMap,
+>(options: {
+  id: string;
+  attachTo?: {
+    id: string;
+    input: string;
+  };
+  configSchema?: PortableSchema<TConfig>;
+  disabled?: boolean;
+  inputs?: TInputs;
+  loader: (options: {
+    config: TConfig;
+    inputs: Expand<ExtensionInputValues<TInputs>>;
+  }) => Promise<ComponentType<SignInPageProps>>;
+}): Extension<TConfig>;
+
 // @public
 export function createSubRouteRef<
   Path extends string,

packages/frontend-plugin-api/src/extensions/createSignInPageExtension.tsx

@@ -0,0 +1,79 @@
+/*
+ * 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.
+ */
+
+import React, { ComponentType, lazy } from 'react';
+import { ExtensionBoundary } from '../components';
+import { PortableSchema } from '../schema';
+import {
+  createExtension,
+  Extension,
+  ExtensionInputValues,
+  AnyExtensionInputMap,
+  createExtensionDataRef,
+} from '../wiring';
+import { Expand } from '../types';
+import { SignInPageProps } from '@backstage/core-plugin-api';
+
+/** @internal */
+export const signInPageComponentDataRef =
+  createExtensionDataRef<ComponentType<SignInPageProps>>('core.signInPage');
+
+/**
+ *
+ * @public
+ */
+export function createSignInPageExtension<
+  TConfig extends {},
+  TInputs extends AnyExtensionInputMap,
+>(options: {
+  id: string;
+  attachTo?: { id: string; input: string };
+  configSchema?: PortableSchema<TConfig>;
+  disabled?: boolean;
+  inputs?: TInputs;
+  loader: (options: {
+    config: TConfig;
+    inputs: Expand<ExtensionInputValues<TInputs>>;
+  }) => Promise<ComponentType<SignInPageProps>>;
+}): Extension<TConfig> {
+  const { id } = options;
+
+  return createExtension({
+    id,
+    attachTo: options.attachTo ?? { id: 'core.router', input: 'signInPage' },
+    configSchema: options.configSchema,
+    inputs: options.inputs,
+    disabled: options.disabled,
+    output: {
+      component: signInPageComponentDataRef,
+    },
+    factory({ config, inputs, source }) {
+      const ExtensionComponent = lazy(() =>
+        options
+          .loader({ config, inputs })
+          .then(component => ({ default: component })),
+      );
+
+      return {
+        component: props => (
+          <ExtensionBoundary id={id} source={source} routable>
+            <ExtensionComponent {...props} />
+          </ExtensionBoundary>
+        ),
+      };
+    },
+  });
+}

packages/frontend-plugin-api/src/extensions/index.ts

@@ -17,4 +17,5 @@
 export { createApiExtension } from './createApiExtension';
 export { createPageExtension } from './createPageExtension';
 export { createNavItemExtension } from './createNavItemExtension';
+export { createSignInPageExtension } from './createSignInPageExtension';
 export { createThemeExtension } from './createThemeExtension';