fix(reactant-module): fix plugin order issue

packages/reactant-module/src/core/createStore.ts

@@ -55,7 +55,12 @@ import type {
   ThisService,
 } from '../interfaces';
 import { getComposeEnhancers, getStageName, isEqual, perform } from '../utils';
-import { handlePlugin } from './handlePlugin';
+import {
+  assignPlugin,
+  pushPlugin,
+  mergePluginHooks,
+  generatePluginHooks,
+} from './handlePlugin';
 import { type Signal, signal } from './signal';
 
 interface CreateStoreOptions<T> {
@@ -98,6 +103,9 @@ export function createStore<T = any>({
   const enableInspector = devOptions.enableInspector ?? false;
   const strict = devOptions.strict ?? false;
 
+  const _pushPluginHooks = generatePluginHooks();
+  const _assignPluginHooks = generatePluginHooks();
+
   dynamicModules.forEach((module, key) => {
     try {
       const services = container!.getAll(key);
@@ -116,9 +124,11 @@ export function createStore<T = any>({
     }
   }
   const multipleInjectMap = getMetadata(METADATA_KEY.multiple);
+  // #region sort ServiceIdentifiers
   // it's just a workaround for the issue of `ServiceIdentifiers` order.
   // InversifyJS issue: https://github.com/inversify/InversifyJS/issues/1578
   const allServiceIdentifiers = Array.from(ServiceIdentifiers);
+  const allServiceIdentifierKeys = Array.from(ServiceIdentifiers.keys());
   allServiceIdentifiers.sort(([a], [b]) => {
     let aDeps = [];
     try {
@@ -142,6 +152,7 @@ export function createStore<T = any>({
   allServiceIdentifiers.forEach(([ServiceIdentifier, value]) => {
     ServiceIdentifiers.set(ServiceIdentifier, value);
   });
+  // #endregion
   for (const [ServiceIdentifier] of ServiceIdentifiers) {
     // `Service` should be bound before `createStore`.
     const isMultipleInjection = multipleInjectMap.has(ServiceIdentifier);
@@ -153,7 +164,12 @@ export function createStore<T = any>({
       const services: IService[] = container.getAll(ServiceIdentifier);
       loadedModules.add(ServiceIdentifier);
       services.forEach((service, index) => {
-        handlePlugin(service, pluginHooks);
+        const indexPlugin = allServiceIdentifierKeys.indexOf(ServiceIdentifier);
+        if (indexPlugin === -1) {
+          pushPlugin(service, _pushPluginHooks, indexPlugin);
+        } else {
+          assignPlugin(service, _assignPluginHooks, indexPlugin);
+        }
         const className = (ServiceIdentifier as Function).name;
         let identifier: string | undefined =
           typeof ServiceIdentifier === 'string'
@@ -428,6 +444,8 @@ export function createStore<T = any>({
       });
     }
   }
+  // #region keep plugin instance order
+  mergePluginHooks(pluginHooks, _assignPluginHooks, _pushPluginHooks);
   if (typeof store === 'undefined') {
     // load reducers and create store for Redux
     const reducer = isExistReducer

packages/reactant-module/src/core/handlePlugin.ts

@@ -1,8 +1,73 @@
+/* eslint-disable no-param-reassign */
 import { ReducersMapObject, Reducer, PreloadedState } from 'redux';
+import { type FunctionComponent } from 'react';
 import { PluginModule } from './plugin';
 import { PluginHooks, HandlePlugin } from '../interfaces';
 
-export const handlePlugin: HandlePlugin = (
+export const generatePluginHooks = (): PluginHooks => ({
+  middleware: [],
+  beforeCombineRootReducers: [],
+  afterCombineRootReducers: [],
+  enhancer: [],
+  preloadedStateHandler: [],
+  afterCreateStore: [],
+  provider: [] as FunctionComponent[],
+});
+
+export const mergePluginHooks = (
+  pluginHooks: PluginHooks,
+  _assignPluginHooks: PluginHooks,
+  _pushPluginHooks: PluginHooks
+) => {
+  Object.keys(pluginHooks).forEach((key) => {
+    const assignPluginHooks = _assignPluginHooks[
+      key as keyof PluginHooks
+    ].filter(Boolean) as any[];
+    const pushPluginHooks = _pushPluginHooks[key as keyof PluginHooks] as any[];
+    pluginHooks[key as keyof PluginHooks].push(
+      ...assignPluginHooks,
+      ...pushPluginHooks
+    );
+  });
+};
+
+export const assignPlugin: HandlePlugin = (
+  service: any,
+  pluginHooks: PluginHooks,
+  index: number
+) => {
+  if (service instanceof PluginModule) {
+    if (typeof service.beforeCombineRootReducers === 'function') {
+      pluginHooks.beforeCombineRootReducers[index] = (
+        reducers: ReducersMapObject
+      ) => service.beforeCombineRootReducers!(reducers);
+    }
+    if (typeof service.afterCombineRootReducers === 'function') {
+      pluginHooks.afterCombineRootReducers[index] = (rootReducer: Reducer) =>
+        service.afterCombineRootReducers!(rootReducer);
+    }
+    if (typeof service.preloadedStateHandler === 'function') {
+      pluginHooks.preloadedStateHandler[index] = (
+        preloadedState: PreloadedState<any>
+      ) => service.preloadedStateHandler!(preloadedState);
+    }
+    if (typeof service.enhancer === 'function') {
+      pluginHooks.enhancer[index] = service.enhancer.bind(service);
+    }
+    if (typeof service.middleware === 'function') {
+      pluginHooks.middleware[index] = service.middleware.bind(service);
+    }
+    if (typeof service.afterCreateStore === 'function') {
+      pluginHooks.afterCreateStore[index] =
+        service.afterCreateStore.bind(service);
+    }
+    if (typeof service.provider === 'function') {
+      pluginHooks.provider[index] = service.provider.bind(service);
+    }
+  }
+};
+
+export const pushPlugin: HandlePlugin = (
   service: any,
   pluginHooks: PluginHooks
 ) => {

packages/reactant-module/src/interfaces.ts

@@ -144,7 +144,8 @@ export type PluginHooks = Collection<PluginModule>;
 
 export type HandlePlugin<T = any> = (
   service: T,
-  pluginHooks: PluginHooks
+  pluginHooks: PluginHooks,
+  index: number
 ) => void;
 
 export type Subscribe = (

packages/reactant-module/test/core/handlePlugin.test.ts

@@ -1,8 +1,8 @@
 /* eslint-disable lines-between-class-members */
-import { handlePlugin, PluginModule, Store } from '../..';
+import { pushPlugin, PluginModule, Store } from '../..';
 
 test('base `handlePlugin` with invalid service', () => {
-  for (const item of [
+  const arr = [
     {},
     [],
     function () {
@@ -11,7 +11,8 @@ test('base `handlePlugin` with invalid service', () => {
     () => {
       //
     },
-  ]) {
+  ];
+  for (const item of arr) {
     const pluginHooks = {
       middleware: [],
       beforeCombineRootReducers: [],
@@ -21,15 +22,15 @@ test('base `handlePlugin` with invalid service', () => {
       afterCreateStore: [],
       provider: [],
     };
-    handlePlugin(item, pluginHooks);
+    pushPlugin(item, pluginHooks, arr.indexOf(item));
     Object.entries(pluginHooks).forEach(([_, hooks]) => {
       expect(hooks.length).toBe(0);
     });
   }
 });
 
 test('base `handlePlugin` with valid service', () => {
-  for (const item of [
+  const arr = [
     {
       service: new (class extends PluginModule {
         middleware = () => () => () => null;
@@ -50,7 +51,8 @@ test('base `handlePlugin` with valid service', () => {
         provider: 1,
       },
     },
-  ]) {
+  ];
+  for (const item of arr) {
     const pluginHooks = {
       middleware: [],
       beforeCombineRootReducers: [],
@@ -60,7 +62,7 @@ test('base `handlePlugin` with valid service', () => {
       afterCreateStore: [],
       provider: [],
     };
-    handlePlugin(item.service, pluginHooks);
+    pushPlugin(item.service, pluginHooks, arr.indexOf(item));
     Object.entries(pluginHooks).forEach(([key, hooks]) => {
       expect(hooks.length).toBe((item.length as any)[key]);
     });