chore: make the tree.root output a react element

Co-authored-by: Fredrik Adelöw <freben@gmail.com>
Co-authored-by: Patrik Oldsberg <poldsberg@gmail.com>
Co-authored-by: Johan Haals <johan.haals@gmail.com>
Signed-off-by: blam <ben@blam.sh>

packages/frontend-app-api/src/extensions/Root.ts

@@ -32,6 +32,6 @@ export const Root = createExtension({
       replaces: [{ id: 'app', input: 'apis' }],
     }),
   },
-  output: [],
-  factory: () => [],
+  output: [coreExtensionData.reactElement],
+  factory: ({ inputs }) => inputs.app,
 });

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

@@ -309,9 +309,8 @@ export function createSpecializedApp(options?: {
     ],
   });
 
-  for (const appNode of tree.root.edges.attachments.get('app') ?? []) {
-    instantiateAppNodeTree(appNode, apiHolder);
-  }
+  // Now instantiate the entire tree, which will skip anything that's already been instantiated
+  instantiateAppNodeTree(tree.root, apiHolder);
 
   routeResolutionApi.initialize();
   appTreeApi.initialize();
@@ -335,9 +334,7 @@ export function createSpecializedApp(options?: {
     }
   }
 
-  const rootEl = tree.root.edges.attachments
-    .get('app')![0]
-    .instance!.getData(coreExtensionData.reactElement);
+  const rootEl = tree.root.instance!.getData(coreExtensionData.reactElement);
 
   const AppComponent = () => rootEl;