feat: add bridgeHook in runtime core

module-federation · Nov 1, 2024 · f673f69 · f673f69
1 parent fc7b133
commit f673f69
Show file tree

Hide file tree

Showing 3 changed files with 20 additions and 7 deletions.
diff --git a/packages/bridge/bridge-react/src/provider.tsx b/packages/bridge/bridge-react/src/provider.tsx
@@ -116,7 +116,6 @@ export function createBridgeComponent<T>(bridgeInfo: ProviderFnParams<T>) {
           dom: info.dom,
         });
 
-        // call beforeBridgeDestroy hook
         if (
           bridgeInfo?.hooks &&
           bridgeInfo?.hooks.beforeBridgeDestroy &&

diff --git a/packages/bridge/bridge-react/src/remote/index.tsx b/packages/bridge/bridge-react/src/remote/index.tsx
@@ -9,8 +9,9 @@ import * as ReactRouterDOM from 'react-router-dom';
 import type { ProviderParams } from '@module-federation/bridge-shared';
 import { dispatchPopstateEnv } from '@module-federation/bridge-shared';
 import { ErrorBoundaryPropsWithComponent } from 'react-error-boundary';
-import { registerBridgeLifeCycle } from '../lifecycle';
+// import { registerBridgeLifeCycle } from '../lifecycle';
 import { LoggerInstance, pathJoin } from '../utils';
+import { getInstance } from '@module-federation/runtime';
 
 export const getModuleName = (id: string) => {
   // separate module name without detailed module path
@@ -55,7 +56,8 @@ const RemoteAppWrapper = forwardRef(function (
   props: RemoteAppParams & RenderFnParams,
   ref,
 ) {
-  const bridgeHook = registerBridgeLifeCycle();
+  const host = getInstance();
+  LoggerInstance.log(`RemoteAppWrapper host >>>`, host);
   const RemoteApp = () => {
     LoggerInstance.log(`RemoteAppWrapper RemoteApp props >>>`, { props });
     const {
@@ -96,9 +98,12 @@ const RemoteAppWrapper = forwardRef(function (
           renderProps,
         );
 
-        if (bridgeHook && bridgeHook?.lifecycle?.beforeBridgeRender) {
+        if (
+          host?.bridgeHook &&
+          host?.bridgeHook?.lifecycle?.beforeBridgeRender
+        ) {
           const beforeBridgeRenderRes =
-            bridgeHook?.lifecycle?.beforeBridgeRender.emit({
+            host?.bridgeHook?.lifecycle?.beforeBridgeRender.emit({
               ...renderProps,
             });
           const extraProps =
@@ -124,8 +129,11 @@ const RemoteAppWrapper = forwardRef(function (
               `createRemoteComponent LazyComponent destroy >>>`,
               { moduleName, basename, dom: renderDom.current },
             );
-            if (bridgeHook && bridgeHook?.lifecycle?.afterBridgeDestroy) {
-              bridgeHook?.lifecycle?.afterBridgeDestroy.emit({
+            if (
+              host?.bridgeHook &&
+              host?.bridgeHook?.lifecycle?.afterBridgeDestroy
+            ) {
+              host?.bridgeHook?.lifecycle?.afterBridgeDestroy.emit({
                 moduleName,
                 dom: renderDom.current,
                 basename,

diff --git a/packages/runtime/src/core.ts b/packages/runtime/src/core.ts
@@ -116,6 +116,12 @@ export class FederationHost {
       Promise<Response> | void | false
     >(),
   });
+  bridgeHook = new PluginSystem({
+    beforeBridgeRender: new SyncHook<[Record<string, any>], any>(),
+    afterBridgeRender: new SyncHook<[Record<string, any>], any>(),
+    beforeBridgeDestroy: new SyncHook<[Record<string, any>], any>(),
+    afterBridgeDestroy: new SyncHook<[Record<string, any>], any>(),
+  });
 
   constructor(userOptions: UserOptions) {
     // TODO: Validate the details of the options