@tramvai/module-child-app 1.71.1 → 1.73.0

package/README.md

@@ -126,66 +126,41 @@ State for child-apps will be dehydrated on server as separate variable in the re
 
 :::warning
 
-Usually child-app cannot read data from root-app stores, but the dangerous workaround that allows to subscribe on any root-app store exists.
+By default, child-app cannot read data from root-app stores, but the you can specify the set of root-app stores that might be used inside child-app.
 
-It may be done using `CHILD_APP_INTERNAL_ROOT_STATE_SUBSCRIPTION_TOKEN` token.
+It may be done using `CHILD_APP_INTERNAL_ROOT_STATE_ALLOWED_STORE_TOKEN` token.
 
-This token is considered dangerous as it leads to high coupling with stores from root-app and this way stores in root-app might not change their public interface. But, in most cases, changes in stores ignore breaking change tracking and often breaks backward-compatibility. So **do not use this token if you can**, and if you should - use as little as possible from root-app and provide some fallback in case of wrong data.
+This token is considered undesirable to use as it leads to high coupling with stores from root-app and this way stores in root-app might not change their public interface. But, in most cases, changes in stores ignore breaking change tracking and may breaks backward-compatibility. So **do not use this token if you can**, and if you should - use as little as possible from root-app and provide some fallback in case of wrong data.
 
-[See how to do it](#child_app_internal_root_state_subscription_token)
+[See how to do it](#child_app_internal_root_state_allowed_store_token)
 
 :::
 
 ## API
 
-### CHILD_APP_INTERNAL_ROOT_STATE_SUBSCRIPTION_TOKEN
+### CHILD_APP_INTERNAL_ROOT_STATE_ALLOWED_STORE_TOKEN
 
-Allows to subscribe to any store from the root app and execute actions based on its state, e.g. to fill internal child-app state.
+Defines the list of allowed root-app store names that might be used inside child-app.
 
-1. Create a new store and a new event within child-app. This store might be used inside child-app as usual store.
-
-   ```ts
-   import { createReducer, createEvent } from '@tramvai/state';
-
-   interface State {
-     value: string;
-   }
-   export const setRootState = createEvent<string>('child-root set state');
-
-   export const rootStore = createReducer('child-root', { value: 'child' } as State).on(
-     setRootState,
-     (state, value) => {
-       return { value };
-     }
-   );
-   ```
-
-2. Add provider for the `CHILD_APP_INTERNAL_ROOT_STATE_SUBSCRIPTION_TOKEN` in order to subscribe to store. In subscription you can dispatch internal event from the child-app
+1. Specify stores that might be used inside child-app
 
    ```ts
    provide({
-     provide: CHILD_APP_INTERNAL_ROOT_STATE_SUBSCRIPTION_TOKEN,
+     provide: CHILD_APP_INTERNAL_ROOT_STATE_ALLOWED_STORE_TOKEN,
      multi: true,
-     useFactory: ({ context }) => {
-       return {
-         stores: ['root'],
-         listener: (state: Record<string, any>) => {
-           return context.dispatch(setRootState(`root ${state.root.value}`));
-         },
-       };
-     },
-     deps: {
-       context: CONTEXT_TOKEN,
-     },
+     useValue: [MediaStore, AuthenticateStore],
    });
    ```
 
-3. Use internal child-app store anywhere in the child-app
+2. Use the specified root-app stores the same way as usual stores
+
+   ```ts
+   import React from 'react';
+   import { useSelector } from '@tramvai/state';
 
-   ```tsx
    export const StateCmp = () => {
-     const value = useSelector([rootStore], (state) => {
-       return state['child-root'].value;
+     const value = useSelector(['root'], (state) => {
+       return state.root.value;
      });
 
      return <div id="child-state">Current Value from Root Store: {value}</div>;

package/lib/server.browser.js

@@ -1,20 +1,20 @@
 import { __decorate } from 'tslib';
 import { provide, COMMAND_LINE_RUNNER_TOKEN, walkOfModules, getModuleParameters, commandLineListTokens as commandLineListTokens$1, Module } from '@tramvai/core';
 import { Container, ChildContainer, Scope, DI_TOKEN } from '@tinkoff/dippy';
-import { commandLineListTokens, CHILD_APP_INTERNAL_ROOT_STATE_SUBSCRIPTION_TOKEN, CHILD_APP_INTERNAL_ACTION_TOKEN, CHILD_APP_INTERNAL_CONFIG_TOKEN, IS_CHILD_APP_DI_TOKEN, CHILD_APP_INTERNAL_ROOT_DI_BORROW_TOKEN, CHILD_APP_RESOLUTION_CONFIG_MANAGER_TOKEN, CHILD_APP_RESOLUTION_CONFIGS_TOKEN, CHILD_APP_RESOLVE_CONFIG_TOKEN, CHILD_APP_RESOLVE_BASE_URL_TOKEN, CHILD_APP_SINGLETON_DI_MANAGER_TOKEN, CHILD_APP_LOADER_TOKEN, CHILD_APP_DI_MANAGER_TOKEN, CHILD_APP_COMMAND_LINE_RUNNER_TOKEN, CHILD_APP_PRELOAD_MANAGER_TOKEN, CHILD_APP_RENDER_MANAGER_TOKEN, CHILD_APP_COMMON_INITIAL_STATE_TOKEN, CHILD_APP_INTERNAL_RENDER_TOKEN } from '@tramvai/tokens-child-app';
+import { commandLineListTokens, CHILD_APP_INTERNAL_ROOT_STATE_SUBSCRIPTION_TOKEN, CHILD_APP_INTERNAL_ACTION_TOKEN, CHILD_APP_INTERNAL_CONFIG_TOKEN, IS_CHILD_APP_DI_TOKEN, CHILD_APP_INTERNAL_ROOT_DI_BORROW_TOKEN, CHILD_APP_INTERNAL_ROOT_STATE_ALLOWED_STORE_TOKEN, CHILD_APP_RESOLUTION_CONFIG_MANAGER_TOKEN, CHILD_APP_RESOLUTION_CONFIGS_TOKEN, CHILD_APP_RESOLVE_CONFIG_TOKEN, CHILD_APP_RESOLVE_BASE_URL_TOKEN, CHILD_APP_SINGLETON_DI_MANAGER_TOKEN, CHILD_APP_LOADER_TOKEN, CHILD_APP_DI_MANAGER_TOKEN, CHILD_APP_COMMAND_LINE_RUNNER_TOKEN, CHILD_APP_PRELOAD_MANAGER_TOKEN, CHILD_APP_RENDER_MANAGER_TOKEN, CHILD_APP_COMMON_INITIAL_STATE_TOKEN, CHILD_APP_INTERNAL_RENDER_TOKEN } from '@tramvai/tokens-child-app';
 export * from '@tramvai/tokens-child-app';
-import { ACTION_PAGE_RUNNER_TOKEN, CONTEXT_TOKEN, LOGGER_TOKEN, DISPATCHER_TOKEN, STORE_TOKEN, COMBINE_REDUCERS, ENV_MANAGER_TOKEN, REGISTER_CLEAR_CACHE_TOKEN, CLEAR_CACHE_TOKEN, ENV_USED_TOKEN } from '@tramvai/tokens-common';
+import { ACTION_PAGE_RUNNER_TOKEN, CONTEXT_TOKEN, LOGGER_TOKEN, DISPATCHER_TOKEN, STORE_TOKEN, DISPATCHER_CONTEXT_TOKEN, STORE_MIDDLEWARE, INITIAL_APP_STATE_TOKEN, COMBINE_REDUCERS, ENV_MANAGER_TOKEN, REGISTER_CLEAR_CACHE_TOKEN, CLEAR_CACHE_TOKEN, ENV_USED_TOKEN } from '@tramvai/tokens-common';
 import { RENDER_SLOTS, EXTEND_RENDER } from '@tramvai/tokens-render';
 import { PAGE_SERVICE_TOKEN } from '@tramvai/tokens-router';
 import flatten from '@tinkoff/utils/array/flatten';
-import { Subscription, createEvent, createReducer } from '@tramvai/state';
+import { Subscription, ChildDispatcherContext, createEvent, createReducer } from '@tramvai/state';
 import React, { createContext, useContext, useMemo, useState, useEffect, createElement } from 'react';
 import applyOrReturn from '@tinkoff/utils/function/applyOrReturn';
 import { loadModule } from '@tinkoff/module-loader-client';
 import noop from '@tinkoff/utils/function/noop';
 import { useDi } from '@tramvai/react';
 
-const getChildProviders$1 = (appDi) => {
+const getChildProviders$2 = (appDi) => {
     const context = appDi.get(CONTEXT_TOKEN);
     return [
         {
@@ -56,7 +56,7 @@ const getChildProviders$1 = (appDi) => {
     ];
 };
 
-const getChildProviders = (appDi) => {
+const getChildProviders$1 = (appDi) => {
     const logger = appDi.get(LOGGER_TOKEN);
     return [
         provide({
@@ -70,7 +70,7 @@ const getChildProviders = (appDi) => {
             multi: true,
             useValue: [],
         }),
-        ...getChildProviders$1(appDi),
+        ...getChildProviders$2(appDi),
     ];
 };
 
@@ -137,7 +137,8 @@ class SingletonDiManager {
             },
         ], this.appDi);
         const { modules = [], providers = [], actions = [] } = children;
-        const childProviders = getChildProviders(this.appDi);
+        // add providers on the Singleton Level to make it possible to reuse providers from the root-app Container
+        const childProviders = getChildProviders$1(this.appDi);
         childProviders.forEach((provider) => {
             di.register(provider);
         });
@@ -171,6 +172,35 @@ class SingletonDiManager {
     }
 }
 
+const getChildProviders = (appDi) => {
+    const parentDispatcherContext = appDi.get(DISPATCHER_CONTEXT_TOKEN);
+    return [
+        provide({
+            provide: DISPATCHER_CONTEXT_TOKEN,
+            useFactory: ({ dispatcher, middlewares, initialState, parentAllowedStores }) => {
+                return new ChildDispatcherContext({
+                    dispatcher,
+                    // context will be set later by the CONTEXT_TOKEN
+                    context: {},
+                    initialState,
+                    middlewares: flatten(middlewares || []),
+                    parentDispatcherContext,
+                    parentAllowedStores: flatten(parentAllowedStores || []),
+                });
+            },
+            deps: {
+                dispatcher: DISPATCHER_TOKEN,
+                middlewares: { token: STORE_MIDDLEWARE, optional: true },
+                initialState: { token: INITIAL_APP_STATE_TOKEN, optional: true },
+                parentAllowedStores: {
+                    token: CHILD_APP_INTERNAL_ROOT_STATE_ALLOWED_STORE_TOKEN,
+                    optional: true,
+                },
+            },
+        }),
+    ];
+};
+
 class DiManager {
     constructor({ appDi, loader, singletonDiManager, }) {
         this.cache = new Map();
@@ -201,7 +231,13 @@ class DiManager {
         if (!singletonDi) {
             return;
         }
-        return new ChildContainer(singletonDi, this.appDi);
+        const di = new ChildContainer(singletonDi, this.appDi);
+        // add providers on the Request Level to make it possible to reuse providers from the root-app ChildContainer
+        const childProviders = getChildProviders(this.appDi);
+        childProviders.forEach((provider) => {
+            di.register(provider);
+        });
+        return di;
     }
 }
 

package/lib/server.es.js

@@ -1,13 +1,13 @@
 import { __decorate } from 'tslib';
 import { provide, COMMAND_LINE_RUNNER_TOKEN, walkOfModules, getModuleParameters, commandLineListTokens as commandLineListTokens$1, Module } from '@tramvai/core';
 import { Container, ChildContainer, Scope, DI_TOKEN } from '@tinkoff/dippy';
-import { commandLineListTokens, CHILD_APP_INTERNAL_ACTION_TOKEN, CHILD_APP_INTERNAL_CONFIG_TOKEN, IS_CHILD_APP_DI_TOKEN, CHILD_APP_INTERNAL_ROOT_DI_BORROW_TOKEN, CHILD_APP_RESOLUTION_CONFIG_MANAGER_TOKEN, CHILD_APP_RESOLUTION_CONFIGS_TOKEN, CHILD_APP_RESOLVE_CONFIG_TOKEN, CHILD_APP_RESOLVE_BASE_URL_TOKEN, CHILD_APP_SINGLETON_DI_MANAGER_TOKEN, CHILD_APP_LOADER_TOKEN, CHILD_APP_DI_MANAGER_TOKEN, CHILD_APP_COMMAND_LINE_RUNNER_TOKEN, CHILD_APP_PRELOAD_MANAGER_TOKEN, CHILD_APP_RENDER_MANAGER_TOKEN, CHILD_APP_INTERNAL_ROOT_STATE_SUBSCRIPTION_TOKEN, CHILD_APP_STATE_MANAGER_TOKEN, CHILD_APP_INTERNAL_RENDER_TOKEN } from '@tramvai/tokens-child-app';
+import { commandLineListTokens, CHILD_APP_INTERNAL_ACTION_TOKEN, CHILD_APP_INTERNAL_CONFIG_TOKEN, IS_CHILD_APP_DI_TOKEN, CHILD_APP_INTERNAL_ROOT_DI_BORROW_TOKEN, CHILD_APP_INTERNAL_ROOT_STATE_ALLOWED_STORE_TOKEN, CHILD_APP_RESOLUTION_CONFIG_MANAGER_TOKEN, CHILD_APP_RESOLUTION_CONFIGS_TOKEN, CHILD_APP_RESOLVE_CONFIG_TOKEN, CHILD_APP_RESOLVE_BASE_URL_TOKEN, CHILD_APP_SINGLETON_DI_MANAGER_TOKEN, CHILD_APP_LOADER_TOKEN, CHILD_APP_DI_MANAGER_TOKEN, CHILD_APP_COMMAND_LINE_RUNNER_TOKEN, CHILD_APP_PRELOAD_MANAGER_TOKEN, CHILD_APP_RENDER_MANAGER_TOKEN, CHILD_APP_INTERNAL_ROOT_STATE_SUBSCRIPTION_TOKEN, CHILD_APP_STATE_MANAGER_TOKEN, CHILD_APP_INTERNAL_RENDER_TOKEN } from '@tramvai/tokens-child-app';
 export * from '@tramvai/tokens-child-app';
-import { ACTION_PAGE_RUNNER_TOKEN, LOGGER_TOKEN, DISPATCHER_TOKEN, STORE_TOKEN, CONTEXT_TOKEN, COMBINE_REDUCERS, ENV_MANAGER_TOKEN, REGISTER_CLEAR_CACHE_TOKEN, CLEAR_CACHE_TOKEN, ENV_USED_TOKEN, CREATE_CACHE_TOKEN } from '@tramvai/tokens-common';
+import { ACTION_PAGE_RUNNER_TOKEN, LOGGER_TOKEN, DISPATCHER_TOKEN, STORE_TOKEN, CONTEXT_TOKEN, DISPATCHER_CONTEXT_TOKEN, STORE_MIDDLEWARE, INITIAL_APP_STATE_TOKEN, COMBINE_REDUCERS, ENV_MANAGER_TOKEN, REGISTER_CLEAR_CACHE_TOKEN, CLEAR_CACHE_TOKEN, ENV_USED_TOKEN, CREATE_CACHE_TOKEN } from '@tramvai/tokens-common';
 import { RENDER_SLOTS, EXTEND_RENDER, ResourceType, ResourceSlot, RESOURCES_REGISTRY } from '@tramvai/tokens-render';
 import { PAGE_SERVICE_TOKEN } from '@tramvai/tokens-router';
 import flatten from '@tinkoff/utils/array/flatten';
-import { createEvent, createReducer } from '@tramvai/state';
+import { ChildDispatcherContext, createEvent, createReducer } from '@tramvai/state';
 import React, { createContext, useContext, useMemo, useState, useEffect, createElement } from 'react';
 import applyOrReturn from '@tinkoff/utils/function/applyOrReturn';
 import { combineValidators, isUrl, endsWith } from '@tinkoff/env-validators';
@@ -16,7 +16,7 @@ import { ServerLoader as ServerLoader$1 } from '@tinkoff/module-loader-server';
 import noop from '@tinkoff/utils/function/noop';
 import { useDi } from '@tramvai/react';
 
-const getChildProviders$1 = (appDi) => {
+const getChildProviders$2 = (appDi) => {
     return [
         provide({
             provide: commandLineListTokens.resolvePageDeps,
@@ -34,7 +34,7 @@ const getChildProviders$1 = (appDi) => {
     ];
 };
 
-const getChildProviders = (appDi) => {
+const getChildProviders$1 = (appDi) => {
     const logger = appDi.get(LOGGER_TOKEN);
     return [
         provide({
@@ -48,7 +48,7 @@ const getChildProviders = (appDi) => {
             multi: true,
             useValue: [],
         }),
-        ...getChildProviders$1(),
+        ...getChildProviders$2(),
     ];
 };
 
@@ -115,7 +115,8 @@ class SingletonDiManager {
             },
         ], this.appDi);
         const { modules = [], providers = [], actions = [] } = children;
-        const childProviders = getChildProviders(this.appDi);
+        // add providers on the Singleton Level to make it possible to reuse providers from the root-app Container
+        const childProviders = getChildProviders$1(this.appDi);
         childProviders.forEach((provider) => {
             di.register(provider);
         });
@@ -149,6 +150,35 @@ class SingletonDiManager {
     }
 }
 
+const getChildProviders = (appDi) => {
+    const parentDispatcherContext = appDi.get(DISPATCHER_CONTEXT_TOKEN);
+    return [
+        provide({
+            provide: DISPATCHER_CONTEXT_TOKEN,
+            useFactory: ({ dispatcher, middlewares, initialState, parentAllowedStores }) => {
+                return new ChildDispatcherContext({
+                    dispatcher,
+                    // context will be set later by the CONTEXT_TOKEN
+                    context: {},
+                    initialState,
+                    middlewares: flatten(middlewares || []),
+                    parentDispatcherContext,
+                    parentAllowedStores: flatten(parentAllowedStores || []),
+                });
+            },
+            deps: {
+                dispatcher: DISPATCHER_TOKEN,
+                middlewares: { token: STORE_MIDDLEWARE, optional: true },
+                initialState: { token: INITIAL_APP_STATE_TOKEN, optional: true },
+                parentAllowedStores: {
+                    token: CHILD_APP_INTERNAL_ROOT_STATE_ALLOWED_STORE_TOKEN,
+                    optional: true,
+                },
+            },
+        }),
+    ];
+};
+
 class DiManager {
     constructor({ appDi, loader, singletonDiManager, }) {
         this.cache = new Map();
@@ -179,7 +209,13 @@ class DiManager {
         if (!singletonDi) {
             return;
         }
-        return new ChildContainer(singletonDi, this.appDi);
+        const di = new ChildContainer(singletonDi, this.appDi);
+        // add providers on the Request Level to make it possible to reuse providers from the root-app ChildContainer
+        const childProviders = getChildProviders(this.appDi);
+        childProviders.forEach((provider) => {
+            di.register(provider);
+        });
+        return di;
     }
 }
 

package/lib/server.js

@@ -26,7 +26,7 @@ var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var applyOrReturn__default = /*#__PURE__*/_interopDefaultLegacy(applyOrReturn);
 var noop__default = /*#__PURE__*/_interopDefaultLegacy(noop);
 
-const getChildProviders$1 = (appDi) => {
+const getChildProviders$2 = (appDi) => {
     return [
         core.provide({
             provide: tokensChildApp.commandLineListTokens.resolvePageDeps,
@@ -44,7 +44,7 @@ const getChildProviders$1 = (appDi) => {
     ];
 };
 
-const getChildProviders = (appDi) => {
+const getChildProviders$1 = (appDi) => {
     const logger = appDi.get(tokensCommon.LOGGER_TOKEN);
     return [
         core.provide({
@@ -58,7 +58,7 @@ const getChildProviders = (appDi) => {
             multi: true,
             useValue: [],
         }),
-        ...getChildProviders$1(),
+        ...getChildProviders$2(),
     ];
 };
 
@@ -125,7 +125,8 @@ class SingletonDiManager {
             },
         ], this.appDi);
         const { modules = [], providers = [], actions = [] } = children;
-        const childProviders = getChildProviders(this.appDi);
+        // add providers on the Singleton Level to make it possible to reuse providers from the root-app Container
+        const childProviders = getChildProviders$1(this.appDi);
         childProviders.forEach((provider) => {
             di.register(provider);
         });
@@ -159,6 +160,35 @@ class SingletonDiManager {
     }
 }
 
+const getChildProviders = (appDi) => {
+    const parentDispatcherContext = appDi.get(tokensCommon.DISPATCHER_CONTEXT_TOKEN);
+    return [
+        core.provide({
+            provide: tokensCommon.DISPATCHER_CONTEXT_TOKEN,
+            useFactory: ({ dispatcher, middlewares, initialState, parentAllowedStores }) => {
+                return new state.ChildDispatcherContext({
+                    dispatcher,
+                    // context will be set later by the CONTEXT_TOKEN
+                    context: {},
+                    initialState,
+                    middlewares: flatten__default["default"](middlewares || []),
+                    parentDispatcherContext,
+                    parentAllowedStores: flatten__default["default"](parentAllowedStores || []),
+                });
+            },
+            deps: {
+                dispatcher: tokensCommon.DISPATCHER_TOKEN,
+                middlewares: { token: tokensCommon.STORE_MIDDLEWARE, optional: true },
+                initialState: { token: tokensCommon.INITIAL_APP_STATE_TOKEN, optional: true },
+                parentAllowedStores: {
+                    token: tokensChildApp.CHILD_APP_INTERNAL_ROOT_STATE_ALLOWED_STORE_TOKEN,
+                    optional: true,
+                },
+            },
+        }),
+    ];
+};
+
 class DiManager {
     constructor({ appDi, loader, singletonDiManager, }) {
         this.cache = new Map();
@@ -189,7 +219,13 @@ class DiManager {
         if (!singletonDi) {
             return;
         }
-        return new dippy.ChildContainer(singletonDi, this.appDi);
+        const di = new dippy.ChildContainer(singletonDi, this.appDi);
+        // add providers on the Request Level to make it possible to reuse providers from the root-app ChildContainer
+        const childProviders = getChildProviders(this.appDi);
+        childProviders.forEach((provider) => {
+            di.register(provider);
+        });
+        return di;
     }
 }
 

package/lib/shared/child/providers.d.ts

@@ -0,0 +1,3 @@
+import type { Container } from '@tinkoff/dippy';
+import type { Provider } from '@tramvai/core';
+export declare const getChildProviders: (appDi: Container) => Provider[];

package/package.json

@@ -1,10 +1,11 @@
 {
   "name": "@tramvai/module-child-app",
-  "version": "1.71.1",
+  "version": "1.73.0",
   "description": "Module for child apps",
   "browser": {
     "./lib/server.js": "./lib/browser.js",
     "./lib/server/child/singletonProviders.js": "./lib/browser/child/singletonProviders.js",
+    "./lib/server/child/providers.js": "./lib/browser/child/providers.js",
     "./lib/server.es.js": "./lib/server.browser.js"
   },
   "main": "lib/server.js",
@@ -30,20 +31,20 @@
     "@tinkoff/env-validators": "0.0.3",
     "@tinkoff/module-loader-client": "0.3.25",
     "@tinkoff/module-loader-server": "0.4.41",
-    "@tramvai/child-app-core": "1.71.1",
+    "@tramvai/child-app-core": "1.73.0",
     "@tramvai/safe-strings": "0.4.3",
-    "@tramvai/tokens-child-app": "1.71.1"
+    "@tramvai/tokens-child-app": "1.73.0"
   },
   "devDependencies": {},
   "peerDependencies": {
     "@tinkoff/dippy": "0.7.38",
     "@tinkoff/utils": "^2.1.2",
-    "@tramvai/core": "1.71.1",
-    "@tramvai/state": "1.71.1",
-    "@tramvai/react": "1.71.1",
-    "@tramvai/tokens-common": "1.71.1",
-    "@tramvai/tokens-render": "1.71.1",
-    "@tramvai/tokens-router": "1.71.1",
+    "@tramvai/core": "1.73.0",
+    "@tramvai/state": "1.73.0",
+    "@tramvai/react": "1.73.0",
+    "@tramvai/tokens-common": "1.73.0",
+    "@tramvai/tokens-render": "1.73.0",
+    "@tramvai/tokens-router": "1.73.0",
     "react": ">=16.8.0",
     "react-dom": ">=16.8.0",
     "object-assign": "^4.1.1",