feat(overmind): lazy config

Author: christianalfoni

packages/node_modules/overmind/src/config/config.test.ts

@@ -1,4 +1,5 @@
-import { merge, namespaced } from './'
+import { merge, namespaced, lazy } from './'
+import { Overmind } from '../'
 
 describe('Config', () => {
   test('should merge configs', () => {
@@ -17,6 +18,7 @@ describe('Config', () => {
     expect(merged.state.foo).toEqual('bar')
     expect(merged.state.bar).toEqual('baz')
   })
+
   test('should namespace', () => {
     const configA = {
       state: {
@@ -29,10 +31,46 @@ describe('Config', () => {
       },
     }
     const merged = namespaced({ configA, configB })
-
     expect(merged.state.configA.foo).toEqual('bar')
     expect(merged.state.configB.bar).toEqual('baz')
   })
+
+  test('should create lazy config', () => {
+    const configA = () =>
+      Promise.resolve({
+        state: {
+          foo: 'bar',
+        },
+      })
+    const configB = () =>
+      Promise.resolve({
+        state: {
+          bar: 'baz',
+        },
+      })
+    const merged = merge(
+      {
+        actions: {
+          loadConfigB: ({ lazy }) => {
+            lazy.loadConfig('configB')
+          },
+        },
+      },
+      lazy({ configA, configB })
+    )
+    const app = new Overmind(merged)
+
+    return Promise.all([
+      app.actions.lazy.loadConfig('configA'),
+      app.actions.loadConfigB({}),
+    ]).then(() => {
+      // @ts-ignore
+      expect(app.state.configA.foo).toEqual('bar')
+      // @ts-ignore
+      expect(app.state.configB.bar).toEqual('baz')
+    })
+  })
+
   test('should merge normal and namespaced', () => {
     const configA = {
       state: {

packages/node_modules/overmind/src/config/index.ts

@@ -1,4 +1,5 @@
-import { Configuration } from '../'
+import { Configuration, TAction } from '../'
+import { SubType } from 'overmind/src/internalTypes'
 
 /*
   MERGE
@@ -177,9 +178,9 @@ export function namespaced<T extends NamespacedConfiguration>(
   namespaces: T
 ): {
   onInitialize?: any
-  state: { [P in keyof T]: T[P]['state'] }
-  effects: { [P in keyof T]: T[P]['effects'] }
-  actions: { [P in keyof T]: T[P]['actions'] }
+  state: SubType<{ [P in keyof T]: T[P]['state'] }, object>
+  effects: SubType<{ [P in keyof T]: T[P]['effects'] }, object>
+  actions: SubType<{ [P in keyof T]: T[P]['actions'] }, object>
 } {
   const result: any = {
     initializers: [],
@@ -206,3 +207,96 @@ export function namespaced<T extends NamespacedConfiguration>(
       : {}
   )
 }
+
+interface LazyConfiguration {
+  [namespace: string]: () => Promise<{
+    onInitialize?: any
+    state?: {}
+    effects?: {}
+    actions?: {}
+    reactions?: {}
+  }>
+}
+
+type Foo<T, B = T> = { [P in keyof T]: boolean }
+
+export function lazy<T extends LazyConfiguration, B = T>(
+  configurations: T
+): {
+  onInitialize?: any
+  state: SubType<
+    {
+      [P in keyof T]?: ReturnType<T[P]> extends Promise<infer U>
+        ? U extends { state: any }
+          ? U['state']
+          : never
+        : never
+    },
+    object
+  >
+  effects: SubType<
+    {
+      [P in keyof T]?: ReturnType<T[P]> extends Promise<infer U>
+        ? U extends { effects: any }
+          ? U['effects']
+          : never
+        : never
+    },
+    object
+  > & {
+    lazy: {
+      loadConfig: (config: keyof T) => Promise<void>
+    }
+  }
+  actions: SubType<
+    {
+      [P in keyof T]?: ReturnType<T[P]> extends Promise<infer U>
+        ? U extends { actions: any }
+          ? U['actions']
+          : never
+        : never
+    },
+    object
+  > & {
+    lazy: {
+      loadConfig: TAction<any, keyof T>
+    }
+  }
+} {
+  let app
+  return {
+    onInitialize({ value }) {
+      app = value
+    },
+    effects: {
+      lazy: {
+        loadConfig(config) {
+          return app.actions.lazy.loadConfig(config)
+        },
+      },
+    },
+    actions: {
+      lazy: {
+        loadConfig({ value: key, state, ...rest }) {
+          const configToLoad = configurations[key]
+          configToLoad().then((loadedConfig) => {
+            const newConfig = namespaced({
+              [key]: loadedConfig,
+            })
+
+            if (newConfig.state) state[key] = newConfig.state[key]
+            if (newConfig.effects) app.effects[key] = newConfig.effects[key]
+            if (newConfig.actions)
+              app.actions[key] = app.getActions(newConfig.actions[key])
+            if (newConfig.onInitialize)
+              newConfig.onInitialize({
+                value: app,
+                state,
+                ...rest,
+              })
+          })
+        },
+      },
+    },
+  } as any
+}

packages/overmind-website/api/config.md

@@ -20,4 +20,12 @@ Allows you to namespace configurations by a key.
 
 ```marksy
 h(Example, { name: "api/config_namespaced" })
+```
+
+## lazy (beta)
+
+You can also lazy load configurations. You do this by giving each configuration a key with a function that returns the config when called. To actually load the configurations you can either call an effect or an action with th key of the configuration to load.
+
+```marksy
+h(Example, { name: "api/config_lazy" })
 ```

packages/overmind-website/examples/api/config_lazy.ts

@@ -0,0 +1,48 @@
+export default (ts) =>
+  ts
+    ? [
+        {
+          fileName: 'app.ts',
+          code: `
+import { Overmind, TConfig } from 'overmind'
+import { lazy } from 'overmind/config'
+import { Config as ModuleAConfig } from './moduleA'
+import { Config as ModuleBConfig } from './moduleB'
+
+const config = lazy({
+  moduleA: (): Promise<ModuleAConfig> => import('./moduleA'),
+  moduleB: (): Promise<ModuleBConfig> => import('./moduleB)
+})
+
+declare module 'overmind' {
+  interface IConfig extends TConfig<typeof config> {}
+}
+
+const app = new Overmind(config)
+
+app.actions.lazy.loadConfig('moduleA')
+
+export default app
+`,
+        },
+      ]
+    : [
+        {
+          fileName: 'app/index.js',
+          code: `
+import { Overmind } from 'overmind'
+import { lazy } from 'overmind/config'
+
+const config = lazy({
+  moduleA: () => import('./moduleA'),
+  moduleB: () => import('./moduleB)
+})
+
+const app = new Overmind(config)
+
+app.actions.lazy.loadConfig('moduleA')
+
+export default app
+`,
+        },
+      ]