frontend-plugin-api: move extension instance creation to frontend-app-api

Co-authored-by: Fredrik Adelöw <freben@gmail.com>
Co-authored-by: Johan Haals <johan.haals@gmail.com>
Co-authored-by: Vincenzo Scamporlino <vincenzos@spotify.com>
Co-authored-by: Philipp Hugenroth <philipph@spotify.com>
Co-authored-by: Camila Belo <camilaibs@gmail.com>
Signed-off-by: Patrik Oldsberg <poldsberg@gmail.com>

packages/frontend-app-api/package.json

@@ -32,10 +32,11 @@
   "dependencies": {
     "@backstage/config": "workspace:^",
     "@backstage/frontend-plugin-api": "workspace:^",
-    "@backstage/plugin-graphiql": "workspace:^"
+    "@backstage/plugin-graphiql": "workspace:^",
+    "lodash": "^4.17.21"
   },
   "peerDependencies": {
-    "react": "*",
-    "react-router-dom": "*"
+    "react": "^16.13.1 || ^17.0.0",
+    "react-router-dom": "6.0.0-beta.0 || ^6.3.0"
   }
 }

packages/frontend-app-api/src/createApp.tsx

@@ -19,11 +19,13 @@ import { Config, ConfigReader } from '@backstage/config';
 import {
   ExtensionInstanceConfig,
   BackstagePlugin,
-  ExtensionInstance,
-  createExtensionInstance,
   coreExtensionData,
 } from '@backstage/frontend-plugin-api';
 import { RouteExtension } from './extensions/RouteExtension';
+import {
+  createExtensionInstance,
+  ExtensionInstance,
+} from './createExtensionInstance';
 
 // Since we'll never merge arrays in config the config reader context
 // isn't too much of a help. Fall back to manual config reading logic

packages/frontend-app-api/src/createExtensionInstance.ts

@@ -0,0 +1,52 @@
+/*
+ * 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 { Extension } from '@backstage/frontend-plugin-api';
+import mapValues from 'lodash/mapValues';
+
+/** @internal */
+export interface ExtensionInstance {
+  id: string;
+  data: Map<string, unknown>;
+  $$type: 'extension-instance';
+}
+
+/** @internal */
+export function createExtensionInstance(options: {
+  id: string;
+  extension: Extension;
+  config: unknown;
+  attachments: Record<string, ExtensionInstance[]>;
+}): ExtensionInstance {
+  const { extension, config, attachments } = options;
+  const extensionData = new Map<string, unknown>();
+  extension.factory({
+    config,
+    bind: mapValues(extension.output, ref => {
+      return (value: unknown) => extensionData.set(ref.id, value);
+    }),
+    inputs: mapValues(
+      extension.inputs,
+      ({ extensionData: pointData }, inputName) => {
+        // TODO: validation
+        return (attachments[inputName] ?? []).map(attachment =>
+          mapValues(pointData, ref => attachment.data.get(ref.id)),
+        );
+      },
+    ),
+  });
+  return { id: options.id, data: extensionData, $$type: 'extension-instance' };
+}

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

@@ -43,14 +43,6 @@ export function createExtension<
   >,
 >(options: CreateExtensionOptions<TData, TPoint>): Extension;
 
-// @public (undocumented)
-export function createExtensionInstance(options: {
-  id: string;
-  extension: Extension;
-  config: unknown;
-  attachments: Record<string, ExtensionInstance[]>;
-}): ExtensionInstance;
-
 // @public (undocumented)
 export interface CreateExtensionOptions<
   TData extends AnyExtensionDataMap,
@@ -106,9 +98,6 @@ export type ExtensionDataBind<TData extends AnyExtensionDataMap> = {
   [K in keyof TData]: (value: TData[K]['T']) => void;
 };
 
-// @public (undocumented)
-export type ExtensionDataId = string;
-
 // @public (undocumented)
 export type ExtensionDataRef<T> = {
   id: string;
@@ -121,16 +110,6 @@ export type ExtensionDataValue<TData extends AnyExtensionDataMap> = {
   [K in keyof TData]: TData[K]['T'];
 };
 
-// @public (undocumented)
-export interface ExtensionInstance {
-  // (undocumented)
-  $$type: 'extension-instance';
-  // (undocumented)
-  data: Map<ExtensionDataId, unknown>;
-  // (undocumented)
-  id: string;
-}
-
 // @public (undocumented)
 export interface ExtensionInstanceConfig {
   // (undocumented)

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

@@ -22,18 +22,15 @@
 
 export {
   createExtension,
-  createExtensionInstance,
   coreExtensionData,
   createPlugin,
   type ExtensionInstanceConfig,
   type BackstagePlugin,
-  type ExtensionInstance,
   type Extension,
   type AnyExtensionDataMap,
   type BackstagePluginOptions,
   type CreateExtensionOptions,
   type ExtensionDataBind,
-  type ExtensionDataId,
   type ExtensionDataRef,
   type ExtensionDataValue,
 } from './types';

packages/frontend-plugin-api/src/types.ts

@@ -14,7 +14,6 @@
  * limitations under the License.
  */
 
-import mapValues from 'lodash/mapValues';
 import { ComponentType } from 'react';
 
 /** @public */
@@ -86,43 +85,6 @@ export function createExtension<
   return { ...options, $$type: 'extension', inputs: options.inputs ?? {} };
 }
 
-/** @public */
-export type ExtensionDataId = string;
-
-/** @public */
-export interface ExtensionInstance {
-  id: string;
-  data: Map<ExtensionDataId, unknown>;
-  $$type: 'extension-instance';
-}
-
-/** @public */
-export function createExtensionInstance(options: {
-  id: string;
-  extension: Extension;
-  config: unknown;
-  attachments: Record<string, ExtensionInstance[]>;
-}): ExtensionInstance {
-  const { extension, config, attachments } = options;
-  const extensionData = new Map<ExtensionDataId, unknown>();
-  extension.factory({
-    config,
-    bind: mapValues(extension.output, ref => {
-      return (value: unknown) => extensionData.set(ref.id, value);
-    }),
-    inputs: mapValues(
-      extension.inputs,
-      ({ extensionData: pointData }, inputName) => {
-        // TODO: validation
-        return (attachments[inputName] ?? []).map(attachment =>
-          mapValues(pointData, ref => attachment.data.get(ref.id)),
-        );
-      },
-    ),
-  });
-  return { id: options.id, data: extensionData, $$type: 'extension-instance' };
-}
-
 /** @public */
 export interface ExtensionInstanceConfig {
   id: string;

yarn.lock

@@ -4069,9 +4069,10 @@ __metadata:
     "@backstage/frontend-plugin-api": "workspace:^"
     "@backstage/plugin-graphiql": "workspace:^"
     "@testing-library/jest-dom": ^5.10.1
+    lodash: ^4.17.21
   peerDependencies:
-    react: "*"
-    react-router-dom: "*"
+    react: ^16.13.1 || ^17.0.0
+    react-router-dom: 6.0.0-beta.0 || ^6.3.0
   languageName: unknown
   linkType: soft