frontend-plugin-api: swtich extension factory to bind all outputs at once

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

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

@@ -54,9 +54,17 @@ export function createExtensionInstance(options: {
     extension.factory({
       source,
       config: parsedConfig,
-      bind: mapValues(extension.output, ref => {
-        return (value: unknown) => extensionData.set(ref.id, value);
-      }),
+      bind: namedOutputs => {
+        for (const [name, output] of Object.entries(namedOutputs)) {
+          const ref = extension.output[name];
+          if (!ref) {
+            throw new Error(
+              `Extension instance '${extension.id}' tried to bind unknown output '${name}'`,
+            );
+          }
+          extensionData.set(ref.id, output);
+        }
+      },
       inputs: mapValues(
         extension.inputs,
         ({ extensionData: pointData }, inputName) => {

packages/frontend-app-api/src/extensions/CoreRouter.tsx

@@ -47,10 +47,12 @@ export const CoreRouter = createExtension({
 
       return element;
     };
-    bind.component(() => (
-      <BrowserRouter>
-        <Routes />
-      </BrowserRouter>
-    ));
+    bind({
+      component: () => (
+        <BrowserRouter>
+          <Routes />
+        </BrowserRouter>
+      ),
+    });
   },
 });