feat(overmind): bring back effects proxy

Author: christianalfoni

packages/demos/react-typescript-todomvc/src/app/index.ts

@@ -7,6 +7,7 @@ import * as state from './state'
 
 const config = {
   actions,
+  effects,
   state,
 }
 

packages/node_modules/overmind/src/index.ts

@@ -19,6 +19,7 @@ import {
   TContext,
   TOperator,
 } from './types'
+import { proxifyEffects } from './proxyfyEffects'
 
 export * from './types'
 
@@ -272,25 +273,13 @@ export class Overmind<Config extends Configuration> implements BaseApp {
     }
   }
   private trackEffects(effects = {}, execution) {
-    const that = this
-
-    return effects
-    /*
-    return new Proxy(effects, {
-      get(target, prop) {
-        if (typeof target[prop] === 'function') {
-          return (...args) => {
-            const result = target[prop](...args)
-            return that.trackPromise(result, execution)
-          }
-        } else if (isPlainObject(target[prop])) {
-          return that.trackEffects(target[prop], execution)
-        }
+    if (IS_PRODUCTION) {
+      return effects
+    }
 
-        return target[prop]
-      },
-    })
-    */
+    return proxifyEffects(this.effects, (effect) =>
+      this.eventHub.emitAsync(EventType.EFFECT, { ...execution, ...effect })
+    )
   }
   private initializeDevtools(host, eventHub, proxyStateTree) {
     const devtools = new Devtools(

packages/node_modules/overmind/src/proxyfyEffects.ts

@@ -0,0 +1,87 @@
+export const doNotProxy = Symbol('doNotProxy')
+
+function isObject(value) {
+  return typeof value === 'object' && !Array.isArray(value) && value !== null
+}
+
+let hasWarnedConstructor = false
+
+function createProxyGetHandler(
+  path: string,
+  cb: (effect) => void
+): ProxyHandler<any>['get'] {
+  return (target, prop) => {
+    if (typeof target[prop] === 'function') {
+      const func = function(...args) {
+        const result = target[prop].apply(this, args)
+        if (result instanceof Promise) {
+          result.then((promisedResult) => {
+            // eslint-disable-next-line standard/no-callback-literal
+            cb({
+              name: path,
+              method: prop,
+              args,
+              result: promisedResult,
+            })
+          })
+        } else {
+          // eslint-disable-next-line standard/no-callback-literal
+          cb({
+            name: path,
+            method: prop,
+            args,
+            result,
+          })
+        }
+        return result
+      }
+
+      return new Proxy(func, {
+        construct(_, args) {
+          // eslint-disable-next-line
+          cb({
+            name: path,
+            method: prop,
+            args,
+            result: `[${prop.toString()}]`,
+          })
+
+          if (!hasWarnedConstructor) {
+            console.warn(
+              `EFFECTS - It is highly recommended to create a custom effect, exposing a method that deals with the instantiation of "${path}.${prop.toString()}". It improves readability and debugability of your app`
+            )
+            hasWarnedConstructor = true
+          }
+
+          return new target[prop](...args)
+        },
+      })
+    }
+    if (isObject(target[prop])) {
+      return new Proxy(target[prop], {
+        get: createProxyGetHandler(path + '.' + prop.toString(), cb),
+      })
+    }
+    return target[prop]
+  }
+}
+
+export function proxifyEffects<Effects>(
+  effects: Effects,
+  cb: (effect) => void
+): Effects {
+  return Object.keys(effects).reduce(
+    (currentEffects, key) => {
+      const effect = effects[key]
+      if (isObject(effect)) {
+        currentEffects[key] = new Proxy(effect, {
+          get: createProxyGetHandler(key, cb),
+        })
+      } else {
+        currentEffects[key] = effect
+      }
+      return currentEffects
+    },
+    {} as Effects
+  )
+}