chore: remove remixRouter field context type declare and in browser r…

…outer plugin (#6515)
web-infra-dev · Nov 7, 2024 · c3a0c9e · c3a0c9e
1 parent 1ab7ecd
commit c3a0c9e
Show file tree

Hide file tree

Showing 4 changed files with 20 additions and 13 deletions.
diff --git a/packages/runtime/plugin-runtime/src/core/context/runtime.ts b/packages/runtime/plugin-runtime/src/core/context/runtime.ts
@@ -22,10 +22,6 @@ interface BaseRuntimeContext {
   store?: Store;
   routeManifest: RouteManifest;
   routerContext?: StaticHandlerContext;
-  /**
-   * private method
-   */
-  remixRouter?: Router;
   /**
    * private
    */

diff --git a/packages/runtime/plugin-runtime/src/router/runtime/hooks.ts b/packages/runtime/plugin-runtime/src/router/runtime/hooks.ts
@@ -5,6 +5,7 @@ import {
 import type { RouteObject } from '@modern-js/runtime-utils/router';
 import type { RuntimeContext } from '../../core';
 
+// only for inhouse use
 const modifyRoutes = createWaterfall<RouteObject[]>();
 const beforeCreateRoutes = createAsyncInterruptWorkflow<RuntimeContext, void>();
 

diff --git a/packages/runtime/plugin-runtime/src/router/runtime/plugin.node.tsx b/packages/runtime/plugin-runtime/src/router/runtime/plugin.node.tsx
@@ -126,6 +126,8 @@ export const routerPlugin = (
             return interrupt(routerContext);
           }
 
+          // requestHandler.ts also has same logic, but handle common status code
+          // maybe we can put the logic in requestHandler.ts in the future
           if (
             routerContext.statusCode >= 500 &&
             routerContext.statusCode < 600 &&
@@ -136,8 +138,17 @@ export const routerPlugin = (
           }
 
           const router = createStaticRouter(routes, routerContext);
-          context.remixRouter = router;
+          // routerContext is used in in css colletor、handle status code、inject loader data in html
           context.routerContext = routerContext;
+
+          // private api, pass to React Component in `wrapRoot`
+          // in the browser, we not need to pass router, cause we create Router in `wrapRoot`
+          // but in node, we need to pass router, cause we need run async function, it can only run in `beforeRender`
+          // when we deprected React 17, we can use Suspense to handle this async function
+          // so the `remixRouter` has no type declare in RuntimeContext
+          context.remixRouter = router;
+
+          // private api, pass to React Component in `wrapRoot`
           context.routes = routes;
         },
         wrapRoot: App => {

diff --git a/packages/runtime/plugin-runtime/src/router/runtime/plugin.tsx b/packages/runtime/plugin-runtime/src/router/runtime/plugin.tsx
@@ -24,6 +24,7 @@ export let finalRouteConfig: RouterConfig['routesConfig'] = {
 };
 export let beforeCreateRouter = true;
 // support csr only, it is not allowed to use in ssr app.
+// inhouse private, will deprecated
 export function modifyRoutes(modifyFunction: (routes: Routes) => Routes) {
   if (beforeCreateRouter) {
     const { routes: originRoutes } = finalRouteConfig;
@@ -49,12 +50,16 @@ export const routerPlugin = (
       window._SERVER_DATA = parsedJSONFromElement('__MODERN_SERVER_DATA__');
       return {
         beforeRender(context) {
+          // for garfish plugin to get basename,
+          // why not let garfish plugin just import @modern-js/runtime/router
+          // so the `router` has no type declare in RuntimeContext
           context.router = {
             useMatches,
             useLocation,
             useHref,
           };
 
+          // Prefetch Link will use routes for match next route
           Object.defineProperty(context, 'routes', {
             get() {
               return routes;
@@ -79,6 +84,7 @@ export const routerPlugin = (
             globalApp: getGlobalLayoutApp(),
             ...routesConfig,
           };
+
           // can not get routes config, skip wrapping React Router.
           // e.g. App.tsx as the entrypoint
           if (!finalRouteConfig.routes && !createRoutes) {
@@ -126,6 +132,7 @@ export const routerPlugin = (
                     );
 
                 const runner = (api as any).useHookRunners();
+                // inhouse private, try deprecated, different from the export function
                 routes = runner.modifyRoutes(routes);
 
                 const router = supportHtml5History
@@ -154,14 +161,6 @@ export const routerPlugin = (
                   return originSubscribe(wrapedListener);
                 };
 
-                Object.defineProperty(runtimeContext, 'remixRouter', {
-                  get() {
-                    return router;
-                  },
-                  configurable: true,
-                  enumerable: true,
-                });
-
                 return router;
               }, [
                 finalRouteConfig,