feat(proxy-state-tree): add global event listener

Author: christianalfoni

packages/node_modules/proxy-state-tree/README.md

@@ -126,6 +126,34 @@ listener.dispose()
 
 Here we combine the tracked paths with the mutations performed to see if this components, computed or whatever indeed needs to run again, doing a new **startPathsTracking** and **clearPathsTracking**.
 
+You can optionally declare a global listener which will be informed by all mutations:
+
+```js
+import ProxyStateTree from 'proxy-state-tree'
+
+const tree = new ProxyStateTree({
+  foo: 'bar',
+  bar: 'baz'
+})
+const state = tree.get()
+
+const listener = tree.addMutationListener((mutations) => {
+  /*
+    [{
+      method: "set",
+      path: "foo",
+      args: ["bar2"] 
+    }]
+  */
+})
+
+tree.startMutationTracking()
+state.foo = 'bar2'
+tree.clearMutationTracking()
+tree.flush()
+listener.dispose()
+```
+
 ## Dynamic state values
 
 If you insert a function into the state tree it will be called when accessed. The function is passed the **proxy-state-tree** instance and the path of where the function lives in the tree.

packages/node_modules/proxy-state-tree/src/index.test.ts

@@ -409,6 +409,26 @@ describe('REACTIONS', () => {
     tree.flush()
     expect(reactionCount).toBe(1)
   })
+  test('should be able to register a global listener', () => {
+    expect.assertions(1)
+    const tree = new ProxyStateTree({
+      foo: 'bar',
+    })
+    const state = tree.get()
+    tree.addMutationListener((mutations) => {
+      expect(mutations).toEqual([
+        {
+          method: 'set',
+          path: 'foo',
+          args: ['bar2'],
+        },
+      ])
+    })
+    tree.startMutationTracking()
+    state.foo = 'bar2'
+    tree.clearMutationTracking()
+    tree.flush()
+  })
   test('should be able to manually add a path to the current tracking', () => {
     let renderCount = 0
     const tree = new ProxyStateTree({

packages/node_modules/proxy-state-tree/src/index.ts

@@ -16,6 +16,7 @@ class ProxyStateTree {
   state: object
   options: Options
   pathDependencies: object
+  globalDependencies: Set<Function>
   objectChanges: Set<string>
   mutations: Mutation[]
   currentMutations: Mutation[]
@@ -34,6 +35,7 @@ class ProxyStateTree {
     this.state = state
     this.options = options
     this.pathDependencies = {}
+    this.globalDependencies = new Set()
     this.mutations = []
     this.currentMutations = []
     this.paths = []
@@ -79,6 +81,10 @@ class ProxyStateTree {
     this.mutations.length = 0
     this.objectChanges.clear()
 
+    for (let globalDependency of this.globalDependencies) {
+      globalDependency(mutations)
+    }
+
     return mutations
   }
   startMutationTracking() {
@@ -125,43 +131,61 @@ class ProxyStateTree {
 
     return pathSet
   }
-  addMutationListener(initialPaths: Set<string>, cb: () => void) {
-    const pathDependencies = this.pathDependencies
-    let currentStringPaths = initialPaths
-
-    for (let currentStringPath of currentStringPaths) {
-      pathDependencies[currentStringPath] = pathDependencies[currentStringPath]
-        ? pathDependencies[currentStringPath].add(cb)
-        : new Set([cb])
-    }
+  addMutationListener(cb: (mutations: Mutation[]) => void)
+  addMutationListener(initialPaths: Set<string>, cb: () => void)
+  addMutationListener() {
+    if (arguments.length === 1) {
+      const cb = arguments[0]
+      const globalDependencies = this.globalDependencies
+      globalDependencies.add(cb)
+
+      return {
+        dispose() {
+          globalDependencies.delete(cb)
+        },
+      }
+    } else {
+      const initialPaths = arguments[0]
+      const cb = arguments[1]
+      const pathDependencies = this.pathDependencies
+      let currentStringPaths = initialPaths
+
+      for (let currentStringPath of currentStringPaths) {
+        pathDependencies[currentStringPath] = pathDependencies[
+          currentStringPath
+        ]
+          ? pathDependencies[currentStringPath].add(cb)
+          : new Set([cb])
+      }
 
-    return {
-      update(newStringPaths: Set<string>) {
-        for (let currentStringPath of currentStringPaths) {
-          if (!newStringPaths.has(currentStringPath)) {
-            pathDependencies[currentStringPath].delete(cb)
+      return {
+        update(newStringPaths: Set<string>) {
+          for (let currentStringPath of currentStringPaths) {
+            if (!newStringPaths.has(currentStringPath)) {
+              pathDependencies[currentStringPath].delete(cb)
+            }
           }
-        }
 
-        for (let newStringPath of newStringPaths) {
-          if (!currentStringPaths.has(newStringPath)) {
-            pathDependencies[newStringPath] = pathDependencies[newStringPath]
-              ? pathDependencies[newStringPath].add(cb)
-              : new Set([cb])
+          for (let newStringPath of newStringPaths) {
+            if (!currentStringPaths.has(newStringPath)) {
+              pathDependencies[newStringPath] = pathDependencies[newStringPath]
+                ? pathDependencies[newStringPath].add(cb)
+                : new Set([cb])
+            }
           }
-        }
 
-        currentStringPaths = newStringPaths
-      },
-      dispose() {
-        for (let currentStringPath of currentStringPaths) {
-          pathDependencies[currentStringPath].delete(cb)
+          currentStringPaths = newStringPaths
+        },
+        dispose() {
+          for (let currentStringPath of currentStringPaths) {
+            pathDependencies[currentStringPath].delete(cb)
 
-          if (pathDependencies[currentStringPath].size === 0) {
-            delete pathDependencies[currentStringPath]
+            if (pathDependencies[currentStringPath].size === 0) {
+              delete pathDependencies[currentStringPath]
+            }
           }
-        }
-      },
+        },
+      }
     }
   }
 }