fix: MergedStore allows updating child component

src/createMergedStore.tsx

@@ -3,7 +3,12 @@ import React from "react";
 import { mergedConnectContextFactory, useMergedConnectedContextFactory } from './connectContext';
 import { getProviderContext } from './createContextProvider';
 
-import { CustomProvider, ConnectContextFactory, KeyValue, ConnectContextOptions, ProviderCollection, ContextCollection } from "./typings";
+import { CustomProvider, ConnectContextFactory, KeyValue, ConnectContextOptions, ProviderCollection, ContextCollection, OnInit } from "./typings";
+
+type MergedStoreProps = {
+    children: React.ReactNode;
+    onInit?: OnInit;
+}
 
 const DefaultChild = ({ children }: any) => children;
 
@@ -24,20 +29,24 @@ function createMergedStore(providers: ProviderCollection): [CustomProvider, Conn
     const withStore = mergedConnectContextFactory(contexts);
     const useStore = useMergedConnectedContextFactory(contexts);
 
-    const MergedStore = (props: KeyValue) => {
+    const MergedStore = ({ children, onInit }: MergedStoreProps) => {
+
+        // onInit is supposed to be run only the first time, so we store a reference to its initial value and never update again
+        const [onInitFn] = React.useState(onInit);
+
         // TODO: this needs to be connected or can just read the merged values from the context similar to createContextProvider onInit
-        const Child = props.onInit ?  getConnectedChild(withStore, props.onInit) : DefaultChild;
+        const Child = React.useMemo(() => onInitFn ?  getConnectedChild(withStore, onInitFn) : DefaultChild, []);
 
-        let wrapper: any = <Child {...props} />;
+        let wrapper: any = <Child children={children} />;
 
         Object.values(providers).forEach((Provider) => {
             const previousWrapper = wrapper;
 
             wrapper = <Provider>{ previousWrapper }</Provider>
         });
 
-        return React.useMemo(() => wrapper, []);
-    }
+        return wrapper;
+    };
 
     return [
         MergedStore,

src/typings.d.ts

@@ -48,4 +48,6 @@ export type ConnectContextOptions = {
 export type ConnectContextFactory = (Component: CustomComponent, options: ConnectContextOptions) => React.FunctionComponent;
 
 export type ProviderCollection = CustomProvider[] | {[key: string]: CustomProvider}
-export type ContextCollection = React.Context<any>[] | {[key: string]: React.Context<any>}
+export type ContextCollection = React.Context<any>[] | {[key: string]: React.Context<any>}
+
+export type OnInit = [ConnectContextOptions, (params: any) => void]