@squide/firefly 16.1.11 → 16.2.0

package/CHANGELOG.md

@@ -1,5 +1,23 @@
 # @squide/firefly
 
+## 16.2.0
+
+### Minor Changes
+
+- [#559](https://github.com/workleap/wl-squide/pull/559) [`33b1cd6`](https://github.com/workleap/wl-squide/commit/33b1cd639ef97e9d9fc892918ab6cbd08e6b91e9) Thanks [@patricklafrance](https://github.com/patricklafrance)! - React Router loaders execution is now delayed until MSW is ready.
+
+## 16.1.12
+
+### Patch Changes
+
+- [#551](https://github.com/workleap/wl-squide/pull/551) [`0a1bbdd`](https://github.com/workleap/wl-squide/commit/0a1bbddc758dc805e980b224f2f7c73fbd69f84b) Thanks [@patricklafrance](https://github.com/patricklafrance)! - Updated workspace dependency specifiers to use ranged workspace versions in package.json files.
+
+- Updated dependencies [[`0a1bbdd`](https://github.com/workleap/wl-squide/commit/0a1bbddc758dc805e980b224f2f7c73fbd69f84b)]:
+  - @squide/launch-darkly@1.0.10
+  - @squide/react-router@8.1.17
+  - @squide/env-vars@1.4.19
+  - @squide/msw@4.0.17
+
 ## 16.1.11
 
 ### Patch Changes

package/dist/AppRouter.d.ts

@@ -1,17 +1,21 @@
 import { type Route } from "@squide/react-router";
 import { type ReactElement } from "react";
+import { DataStrategyFunction, DataStrategyFunctionArgs, DOMRouterOpts } from "react-router";
 import type { RouterProviderProps } from "react-router/dom";
 import { type AppRouterState } from "./AppRouterReducer.ts";
+import { FireflyRuntime } from "./FireflyRuntime.tsx";
 export interface AppRouterRenderFunctionArgs {
     routes: Route[];
 }
 export interface RenderRouterProviderFunctionArgs {
     rootRoute: ReactElement;
     registeredRoutes: Route[];
+    routerProps: DOMRouterOpts;
     routerProviderProps: Omit<RouterProviderProps, "router">;
 }
 export type RenderRouterProviderFunction = (args: RenderRouterProviderFunctionArgs) => ReactElement;
 export declare function useCanRenderRouter({ areModulesRegistered, areModulesReady: areModulesReadyValue }: AppRouterState): boolean;
+export declare function createWaitForMswDataStrategy(runtime: FireflyRuntime): (args: DataStrategyFunctionArgs<unknown>) => ReturnType<DataStrategyFunction<unknown>>;
 export interface AppRouterProps {
     waitForPublicData?: boolean;
     waitForProtectedData?: boolean;

package/dist/AppRouter.js

@@ -1,5 +1,5 @@
 import { jsx } from "react/jsx-runtime";
-import { useLogger } from "@squide/core";
+import { useLogger, useRuntime } from "@squide/core";
 import { useRoutes } from "@squide/react-router";
 import { useEffect, useMemo } from "react";
 import { AppRouterDispatcherContext, AppRouterStateContext } from "./AppRouterContext.js";
@@ -37,7 +37,34 @@ function useCanRenderRouter({ areModulesRegistered, areModulesReady: areModulesR
     // depends on the protected data.
     areModulesRegistered || areModulesReadyValue);
 }
+// This is a custom React Router data strategy (https://reactrouter.com/api/data-routers/createMemoryRouter#optsdatastrategy)
+// to delay the execution of React Router data browser loaders until MSW is ready.
+// The data strategy implemention is copied from React Router default data strategy: https://github.com/remix-run/react-router/blob/main/packages/react-router/lib/router/router.ts#L5710.
+function createWaitForMswDataStrategy(runtime) {
+    const strategy = async (args)=>{
+        await new Promise((resolve)=>{
+            if (runtime.mswState.isReady) {
+                resolve(null);
+            } else {
+                const handler = ()=>{
+                    runtime.mswState.removeMswReadyListener(handler);
+                    resolve(null);
+                };
+                runtime.mswState.addMswReadyListener(handler);
+            }
+        });
+        const matchesToLoad = args.matches.filter((m)=>m.shouldCallHandler);
+        const keyedResults = {};
+        const results = await Promise.all(matchesToLoad.map((m)=>m.resolve()));
+        results.forEach((result, i)=>{
+            keyedResults[matchesToLoad[i].route.id] = result;
+        });
+        return keyedResults;
+    };
+    return strategy;
+}
 function useRenderRouterProvider(state, renderRouterProvider, strictMode) {
+    const runtime = useRuntime();
     const routes = useRoutes();
     // The value is computed outside of the router provider memo to prevent
     // rendering a new router provider everytime the app router state change.
@@ -49,11 +76,15 @@ function useRenderRouterProvider(state, renderRouterProvider, strictMode) {
                     strictMode: strictMode
                 }),
                 registeredRoutes: routes,
+                routerProps: {
+                    dataStrategy: runtime.isMswEnabled ? createWaitForMswDataStrategy(runtime) : undefined
+                },
                 routerProviderProps: {}
             });
         }
         return null;
     }, [
+        runtime,
         canRenderRouter,
         routes,
         renderRouterProvider,
@@ -83,6 +114,6 @@ function AppRouter(props) {
     });
 }
 
-export { AppRouter, useCanRenderRouter };
+export { AppRouter, createWaitForMswDataStrategy, useCanRenderRouter };
 
 //# sourceMappingURL=AppRouter.js.map

package/dist/AppRouter.js.map

@@ -1 +1 @@
-{"version":3,"file":"AppRouter.js","sources":["../src/AppRouter.tsx"],"sourcesContent":["import { useLogger } from \"@squide/core\";\nimport { useRoutes, type Route } from \"@squide/react-router\";\nimport { useEffect, useMemo, type ReactElement } from \"react\";\nimport type { RouterProviderProps } from \"react-router/dom\";\nimport { AppRouterDispatcherContext, AppRouterStateContext } from \"./AppRouterContext.ts\";\nimport { useAppRouterReducer, type AppRouterState } from \"./AppRouterReducer.ts\";\nimport { RootRoute } from \"./RootRoute.tsx\";\nimport { useStrictRegistrationMode } from \"./useStrictRegistrationMode.ts\";\n\nexport interface AppRouterRenderFunctionArgs {\n    routes: Route[];\n}\n\nexport interface RenderRouterProviderFunctionArgs {\n    rootRoute: ReactElement;\n    registeredRoutes: Route[];\n    routerProviderProps: Omit<RouterProviderProps, \"router\">;\n}\n\nexport type RenderRouterProviderFunction = (args: RenderRouterProviderFunctionArgs) => ReactElement;\n\nexport function useCanRenderRouter({ areModulesRegistered, areModulesReady: areModulesReadyValue }: AppRouterState) {\n    return (\n        // Wait until the modules has been registered, but do not wait for the deferred registrations to be registered has they will probably\n        // depends on the protected data.\n        (areModulesRegistered || areModulesReadyValue)\n    );\n}\n\nfunction useRenderRouterProvider(state: AppRouterState, renderRouterProvider: RenderRouterProviderFunction, strictMode: boolean) {\n    const routes = useRoutes();\n\n    // The value is computed outside of the router provider memo to prevent\n    // rendering a new router provider everytime the app router state change.\n    const canRenderRouter = useCanRenderRouter(state);\n\n    return useMemo(() => {\n        if (canRenderRouter) {\n            return renderRouterProvider({\n                rootRoute: <RootRoute strictMode={strictMode} />,\n                registeredRoutes: routes,\n                routerProviderProps: {}\n            });\n        }\n\n        return null;\n    }, [canRenderRouter, routes, renderRouterProvider, strictMode]);\n}\n\nexport interface AppRouterProps {\n    waitForPublicData?: boolean;\n    waitForProtectedData?: boolean;\n    strictMode?: boolean;\n    children: RenderRouterProviderFunction;\n}\n\nexport function AppRouter(props: AppRouterProps) {\n    const {\n        waitForPublicData = false,\n        waitForProtectedData = false,\n        strictMode = true,\n        children: renderRouterProvider\n    } = props;\n    const [state, dispatch] = useAppRouterReducer(waitForPublicData, waitForProtectedData);\n\n    const logger = useLogger();\n\n    useStrictRegistrationMode({\n        isEnabled: strictMode\n    });\n\n    useEffect(() => {\n        logger\n            .withText(\"[squide] AppRouter state has been updated to:\")\n            .withObject(state)\n            .debug();\n    }, [state, logger]);\n\n    const routerProvider = useRenderRouterProvider(state, renderRouterProvider, strictMode);\n\n    return (\n        <AppRouterDispatcherContext.Provider value={dispatch}>\n            <AppRouterStateContext.Provider value={state}>\n                {routerProvider}\n            </AppRouterStateContext.Provider>\n        </AppRouterDispatcherContext.Provider>\n    );\n}\n"],"names":["useLogger","useRoutes","useEffect","useMemo","AppRouterDispatcherContext","AppRouterStateContext","useAppRouterReducer","RootRoute","useStrictRegistrationMode","useCanRenderRouter","areModulesRegistered","areModulesReadyValue","useRenderRouterProvider","state","renderRouterProvider","strictMode","routes","canRenderRouter","AppRouter","props","waitForPublicData","waitForProtectedData","dispatch","logger","routerProvider"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAyC;AACoB;AACC;AAE4B;AACT;AACrC;AAC+B;AAcpE,SAASS,mBAAmB,EAAEC,oBAAoB,EAAE,iBAAiBC,oBAAoB,EAAkB;IAC9G,OACI,qIAAqI;IACrI,iCAAiC;IAChCD,wBAAwBC;AAEjC;AAEA,SAASC,wBAAwBC,KAAqB,EAAEC,oBAAkD,EAAEC,UAAmB;IAC3H,MAAMC,SAASf,SAASA;IAExB,uEAAuE;IACvE,yEAAyE;IACzE,MAAMgB,kBAAkBR,mBAAmBI;IAE3C,OAAOV,OAAOA,CAAC;QACX,IAAIc,iBAAiB;YACjB,OAAOH,qBAAqB;gBACxB,yBAAW,IAACP,SAASA;oBAAC,YAAYQ;;gBAClC,kBAAkBC;gBAClB,qBAAqB,CAAC;YAC1B;QACJ;QAEA,OAAO;IACX,GAAG;QAACC;QAAiBD;QAAQF;QAAsBC;KAAW;AAClE;AASO,SAASG,UAAUC,KAAqB;IAC3C,MAAM,EACFC,oBAAoB,KAAK,EACzBC,uBAAuB,KAAK,EAC5BN,aAAa,IAAI,EACjB,UAAUD,oBAAoB,EACjC,GAAGK;IACJ,MAAM,CAACN,OAAOS,SAAS,GAAGhB,mBAAmBA,CAACc,mBAAmBC;IAEjE,MAAME,SAASvB,SAASA;IAExBQ,yBAAyBA,CAAC;QACtB,WAAWO;IACf;IAEAb,SAASA,CAAC;QACNqB,OACK,QAAQ,CAAC,iDACT,UAAU,CAACV,OACX,KAAK;IACd,GAAG;QAACA;QAAOU;KAAO;IAElB,MAAMC,iBAAiBZ,wBAAwBC,OAAOC,sBAAsBC;IAE5E,qBACI,IAACX,mCAAmC;QAAC,OAAOkB;kBACxC,kBAACjB,8BAA8B;YAAC,OAAOQ;sBAClCW;;;AAIjB"}
+{"version":3,"file":"AppRouter.js","sources":["../src/AppRouter.tsx"],"sourcesContent":["import { useLogger, useRuntime } from \"@squide/core\";\nimport { useRoutes, type Route } from \"@squide/react-router\";\nimport { useEffect, useMemo, type ReactElement } from \"react\";\nimport { DataStrategyFunction, DataStrategyFunctionArgs, DataStrategyResult, DOMRouterOpts } from \"react-router\";\nimport type { RouterProviderProps } from \"react-router/dom\";\nimport { AppRouterDispatcherContext, AppRouterStateContext } from \"./AppRouterContext.ts\";\nimport { useAppRouterReducer, type AppRouterState } from \"./AppRouterReducer.ts\";\nimport { FireflyRuntime } from \"./FireflyRuntime.tsx\";\nimport { RootRoute } from \"./RootRoute.tsx\";\nimport { useStrictRegistrationMode } from \"./useStrictRegistrationMode.ts\";\n\nexport interface AppRouterRenderFunctionArgs {\n    routes: Route[];\n}\n\nexport interface RenderRouterProviderFunctionArgs {\n    rootRoute: ReactElement;\n    registeredRoutes: Route[];\n    routerProps: DOMRouterOpts;\n    routerProviderProps: Omit<RouterProviderProps, \"router\">;\n}\n\nexport type RenderRouterProviderFunction = (args: RenderRouterProviderFunctionArgs) => ReactElement;\n\nexport function useCanRenderRouter({ areModulesRegistered, areModulesReady: areModulesReadyValue }: AppRouterState) {\n    return (\n        // Wait until the modules has been registered, but do not wait for the deferred registrations to be registered has they will probably\n        // depends on the protected data.\n        (areModulesRegistered || areModulesReadyValue)\n    );\n}\n\n// This is a custom React Router data strategy (https://reactrouter.com/api/data-routers/createMemoryRouter#optsdatastrategy)\n// to delay the execution of React Router data browser loaders until MSW is ready.\n// The data strategy implemention is copied from React Router default data strategy: https://github.com/remix-run/react-router/blob/main/packages/react-router/lib/router/router.ts#L5710.\nexport function createWaitForMswDataStrategy(runtime: FireflyRuntime) {\n    const strategy: (args: DataStrategyFunctionArgs<unknown>) => ReturnType<DataStrategyFunction<unknown>> = async args => {\n        await new Promise(resolve => {\n            if (runtime.mswState.isReady) {\n                resolve(null);\n            } else {\n                const handler = () => {\n                    runtime.mswState.removeMswReadyListener(handler);\n                    resolve(null);\n                };\n\n                runtime.mswState.addMswReadyListener(handler);\n            }\n        });\n\n        const matchesToLoad = args.matches.filter(m => m.shouldCallHandler);\n        const keyedResults: Record<string, DataStrategyResult> = {};\n        const results = await Promise.all(matchesToLoad.map(m => m.resolve()));\n\n        results.forEach((result, i) => {\n            keyedResults[matchesToLoad[i].route.id] = result;\n        });\n\n        return keyedResults;\n    };\n\n    return strategy;\n}\n\nfunction useRenderRouterProvider(state: AppRouterState, renderRouterProvider: RenderRouterProviderFunction, strictMode: boolean) {\n    const runtime = useRuntime() as FireflyRuntime;\n    const routes = useRoutes();\n\n    // The value is computed outside of the router provider memo to prevent\n    // rendering a new router provider everytime the app router state change.\n    const canRenderRouter = useCanRenderRouter(state);\n\n    return useMemo(() => {\n        if (canRenderRouter) {\n            return renderRouterProvider({\n                rootRoute: <RootRoute strictMode={strictMode} />,\n                registeredRoutes: routes,\n                routerProps: {\n                    dataStrategy: runtime.isMswEnabled ? createWaitForMswDataStrategy(runtime) : undefined\n                },\n                routerProviderProps: {}\n            });\n        }\n\n        return null;\n    }, [runtime, canRenderRouter, routes, renderRouterProvider, strictMode]);\n}\n\nexport interface AppRouterProps {\n    waitForPublicData?: boolean;\n    waitForProtectedData?: boolean;\n    strictMode?: boolean;\n    children: RenderRouterProviderFunction;\n}\n\nexport function AppRouter(props: AppRouterProps) {\n    const {\n        waitForPublicData = false,\n        waitForProtectedData = false,\n        strictMode = true,\n        children: renderRouterProvider\n    } = props;\n    const [state, dispatch] = useAppRouterReducer(waitForPublicData, waitForProtectedData);\n\n    const logger = useLogger();\n\n    useStrictRegistrationMode({\n        isEnabled: strictMode\n    });\n\n    useEffect(() => {\n        logger\n            .withText(\"[squide] AppRouter state has been updated to:\")\n            .withObject(state)\n            .debug();\n    }, [state, logger]);\n\n    const routerProvider = useRenderRouterProvider(state, renderRouterProvider, strictMode);\n\n    return (\n        <AppRouterDispatcherContext.Provider value={dispatch}>\n            <AppRouterStateContext.Provider value={state}>\n                {routerProvider}\n            </AppRouterStateContext.Provider>\n        </AppRouterDispatcherContext.Provider>\n    );\n}\n"],"names":["useLogger","useRuntime","useRoutes","useEffect","useMemo","AppRouterDispatcherContext","AppRouterStateContext","useAppRouterReducer","RootRoute","useStrictRegistrationMode","useCanRenderRouter","areModulesRegistered","areModulesReadyValue","createWaitForMswDataStrategy","runtime","strategy","args","Promise","resolve","handler","matchesToLoad","m","keyedResults","results","result","i","useRenderRouterProvider","state","renderRouterProvider","strictMode","routes","canRenderRouter","undefined","AppRouter","props","waitForPublicData","waitForProtectedData","dispatch","logger","routerProvider"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAqD;AACQ;AACC;AAG4B;AACT;AAErC;AAC+B;AAepE,SAASU,mBAAmB,EAAEC,oBAAoB,EAAE,iBAAiBC,oBAAoB,EAAkB;IAC9G,OACI,qIAAqI;IACrI,iCAAiC;IAChCD,wBAAwBC;AAEjC;AAEA,6HAA6H;AAC7H,kFAAkF;AAClF,0LAA0L;AACnL,SAASC,6BAA6BC,OAAuB;IAChE,MAAMC,WAAmG,OAAMC;QAC3G,MAAM,IAAIC,QAAQC,CAAAA;YACd,IAAIJ,QAAQ,QAAQ,CAAC,OAAO,EAAE;gBAC1BI,QAAQ;YACZ,OAAO;gBACH,MAAMC,UAAU;oBACZL,QAAQ,QAAQ,CAAC,sBAAsB,CAACK;oBACxCD,QAAQ;gBACZ;gBAEAJ,QAAQ,QAAQ,CAAC,mBAAmB,CAACK;YACzC;QACJ;QAEA,MAAMC,gBAAgBJ,KAAK,OAAO,CAAC,MAAM,CAACK,CAAAA,IAAKA,EAAE,iBAAiB;QAClE,MAAMC,eAAmD,CAAC;QAC1D,MAAMC,UAAU,MAAMN,QAAQ,GAAG,CAACG,cAAc,GAAG,CAACC,CAAAA,IAAKA,EAAE,OAAO;QAElEE,QAAQ,OAAO,CAAC,CAACC,QAAQC;YACrBH,YAAY,CAACF,aAAa,CAACK,EAAE,CAAC,KAAK,CAAC,EAAE,CAAC,GAAGD;QAC9C;QAEA,OAAOF;IACX;IAEA,OAAOP;AACX;AAEA,SAASW,wBAAwBC,KAAqB,EAAEC,oBAAkD,EAAEC,UAAmB;IAC3H,MAAMf,UAAUb,UAAUA;IAC1B,MAAM6B,SAAS5B,SAASA;IAExB,uEAAuE;IACvE,yEAAyE;IACzE,MAAM6B,kBAAkBrB,mBAAmBiB;IAE3C,OAAOvB,OAAOA,CAAC;QACX,IAAI2B,iBAAiB;YACjB,OAAOH,qBAAqB;gBACxB,yBAAW,IAACpB,SAASA;oBAAC,YAAYqB;;gBAClC,kBAAkBC;gBAClB,aAAa;oBACT,cAAchB,QAAQ,YAAY,GAAGD,6BAA6BC,WAAWkB;gBACjF;gBACA,qBAAqB,CAAC;YAC1B;QACJ;QAEA,OAAO;IACX,GAAG;QAAClB;QAASiB;QAAiBD;QAAQF;QAAsBC;KAAW;AAC3E;AASO,SAASI,UAAUC,KAAqB;IAC3C,MAAM,EACFC,oBAAoB,KAAK,EACzBC,uBAAuB,KAAK,EAC5BP,aAAa,IAAI,EACjB,UAAUD,oBAAoB,EACjC,GAAGM;IACJ,MAAM,CAACP,OAAOU,SAAS,GAAG9B,mBAAmBA,CAAC4B,mBAAmBC;IAEjE,MAAME,SAAStC,SAASA;IAExBS,yBAAyBA,CAAC;QACtB,WAAWoB;IACf;IAEA1B,SAASA,CAAC;QACNmC,OACK,QAAQ,CAAC,iDACT,UAAU,CAACX,OACX,KAAK;IACd,GAAG;QAACA;QAAOW;KAAO;IAElB,MAAMC,iBAAiBb,wBAAwBC,OAAOC,sBAAsBC;IAE5E,qBACI,IAACxB,mCAAmC;QAAC,OAAOgC;kBACxC,kBAAC/B,8BAA8B;YAAC,OAAOqB;sBAClCY;;;AAIjB"}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@squide/firefly",
   "author": "Workleap",
-  "version": "16.1.11",
+  "version": "16.2.0",
   "description": "Squide bundle for the firefly technology stack.",
   "license": "Apache-2.0",
   "repository": {
@@ -49,11 +49,11 @@
     "@workleap-telemetry/core": "^2.0.0",
     "@workleap/logging": "^1.3.6",
     "uuid": "^13.0.0",
-    "@squide/core": "6.1.14",
-    "@squide/env-vars": "1.4.18",
-    "@squide/launch-darkly": "1.0.9",
-    "@squide/msw": "4.0.16",
-    "@squide/react-router": "8.1.16"
+    "@squide/core": "^6.1.14",
+    "@squide/launch-darkly": "^1.0.10",
+    "@squide/env-vars": "^1.4.19",
+    "@squide/msw": "^4.0.17",
+    "@squide/react-router": "^8.1.17"
   },
   "devDependencies": {
     "@eslint/js": "9.39.2",
@@ -63,13 +63,13 @@
     "@types/react": "19.2.14",
     "@types/react-dom": "19.2.3",
     "@typescript-eslint/parser": "8.56.1",
-    "@typescript/native-preview": "7.0.0-dev.20260224.1",
+    "@typescript/native-preview": "7.0.0-dev.20260303.1",
     "@vitejs/plugin-react": "5.1.4",
     "@workleap/eslint-configs": "1.1.13",
     "@workleap/rslib-configs": "1.1.7",
     "@workleap/typescript-configs": "3.0.7",
     "eslint": "9.39.2",
-    "happy-dom": "20.7.0",
+    "happy-dom": "20.8.3",
     "typescript": "5.9.3",
     "typescript-eslint": "8.54.0",
     "vitest": "4.0.18"

package/src/AppRouter.tsx

@@ -1,9 +1,11 @@
-import { useLogger } from "@squide/core";
+import { useLogger, useRuntime } from "@squide/core";
 import { useRoutes, type Route } from "@squide/react-router";
 import { useEffect, useMemo, type ReactElement } from "react";
+import { DataStrategyFunction, DataStrategyFunctionArgs, DataStrategyResult, DOMRouterOpts } from "react-router";
 import type { RouterProviderProps } from "react-router/dom";
 import { AppRouterDispatcherContext, AppRouterStateContext } from "./AppRouterContext.ts";
 import { useAppRouterReducer, type AppRouterState } from "./AppRouterReducer.ts";
+import { FireflyRuntime } from "./FireflyRuntime.tsx";
 import { RootRoute } from "./RootRoute.tsx";
 import { useStrictRegistrationMode } from "./useStrictRegistrationMode.ts";
 
@@ -14,6 +16,7 @@ export interface AppRouterRenderFunctionArgs {
 export interface RenderRouterProviderFunctionArgs {
     rootRoute: ReactElement;
     registeredRoutes: Route[];
+    routerProps: DOMRouterOpts;
     routerProviderProps: Omit<RouterProviderProps, "router">;
 }
 
@@ -27,7 +30,40 @@ export function useCanRenderRouter({ areModulesRegistered, areModulesReady: areM
     );
 }
 
+// This is a custom React Router data strategy (https://reactrouter.com/api/data-routers/createMemoryRouter#optsdatastrategy)
+// to delay the execution of React Router data browser loaders until MSW is ready.
+// The data strategy implemention is copied from React Router default data strategy: https://github.com/remix-run/react-router/blob/main/packages/react-router/lib/router/router.ts#L5710.
+export function createWaitForMswDataStrategy(runtime: FireflyRuntime) {
+    const strategy: (args: DataStrategyFunctionArgs<unknown>) => ReturnType<DataStrategyFunction<unknown>> = async args => {
+        await new Promise(resolve => {
+            if (runtime.mswState.isReady) {
+                resolve(null);
+            } else {
+                const handler = () => {
+                    runtime.mswState.removeMswReadyListener(handler);
+                    resolve(null);
+                };
+
+                runtime.mswState.addMswReadyListener(handler);
+            }
+        });
+
+        const matchesToLoad = args.matches.filter(m => m.shouldCallHandler);
+        const keyedResults: Record<string, DataStrategyResult> = {};
+        const results = await Promise.all(matchesToLoad.map(m => m.resolve()));
+
+        results.forEach((result, i) => {
+            keyedResults[matchesToLoad[i].route.id] = result;
+        });
+
+        return keyedResults;
+    };
+
+    return strategy;
+}
+
 function useRenderRouterProvider(state: AppRouterState, renderRouterProvider: RenderRouterProviderFunction, strictMode: boolean) {
+    const runtime = useRuntime() as FireflyRuntime;
     const routes = useRoutes();
 
     // The value is computed outside of the router provider memo to prevent
@@ -39,12 +75,15 @@ function useRenderRouterProvider(state: AppRouterState, renderRouterProvider: Re
             return renderRouterProvider({
                 rootRoute: <RootRoute strictMode={strictMode} />,
                 registeredRoutes: routes,
+                routerProps: {
+                    dataStrategy: runtime.isMswEnabled ? createWaitForMswDataStrategy(runtime) : undefined
+                },
                 routerProviderProps: {}
             });
         }
 
         return null;
-    }, [canRenderRouter, routes, renderRouterProvider, strictMode]);
+    }, [runtime, canRenderRouter, routes, renderRouterProvider, strictMode]);
 }
 
 export interface AppRouterProps {