From 48d53d1d344ff900a0255c5ab227d161e5519fdd Mon Sep 17 00:00:00 2001
From: Patrik Oldsberg <poldsberg@gmail.com>
Date: Wed, 15 Nov 2023 13:47:03 +0100
Subject: [PATCH] frontend-app-api: refactor to resolve app info ahead of
 render
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Co-authored-by: Fredrik Adelöw <freben@gmail.com>
Co-authored-by: Camila Belo <camilaibs@gmail.com>
Co-authored-by: Philipp Hugenroth <philipph@spotify.com>
Signed-off-by: Patrik Oldsberg <poldsberg@gmail.com>
---
 .../frontend-app-api/src/wiring/createApp.tsx | 24 +++++++++----------
 1 file changed, 11 insertions(+), 13 deletions(-)

diff --git a/packages/frontend-app-api/src/wiring/createApp.tsx b/packages/frontend-app-api/src/wiring/createApp.tsx
index dd20604e8c..8495f961db 100644
--- a/packages/frontend-app-api/src/wiring/createApp.tsx
+++ b/packages/frontend-app-api/src/wiring/createApp.tsx
@@ -299,24 +299,22 @@ export function createSpecializedApp(options?: {
     ),
   );
 
-  const routeIds = collectRouteIds(features);
+  const apiHolder = createApiHolder(tree, config);
+  const routeInfo = extractRouteInfoFromAppNode(tree.root);
+  const routeBindings = resolveRouteBindings(
+    options?.bindRoutes,
+    config,
+    collectRouteIds(features),
+  );
+  const rootEl = tree.root.instance!.getData(coreExtensionData.reactElement);
 
   const App = () => (
-    <ApiProvider apis={createApiHolder(tree, config)}>
+    <ApiProvider apis={apiHolder}>
       <AppContextProvider appContext={appContext}>
         <AppThemeProvider>
-          <RoutingProvider
-            {...extractRouteInfoFromAppNode(tree.root)}
-            routeBindings={resolveRouteBindings(
-              options?.bindRoutes,
-              config,
-              routeIds,
-            )}
-          >
+          <RoutingProvider {...routeInfo} routeBindings={routeBindings}>
             {/* TODO: set base path using the logic from AppRouter */}
-            <BrowserRouter>
-              {tree.root.instance!.getData(coreExtensionData.reactElement)}
-            </BrowserRouter>
+            <BrowserRouter>{rootEl}</BrowserRouter>
           </RoutingProvider>
         </AppThemeProvider>
       </AppContextProvider>