feat(proxy-state-tree): aggregate mutations and reset on flush

Author: christianalfoni

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

@@ -394,6 +394,31 @@ describe('REACTIONS', () => {
     tree.flush()
     expect(tree.pathDependencies).toEqual({})
   })
+  test('should allow subsequent mutation tracking and return all on flush', () => {
+    const tree = new ProxyStateTree({
+      foo: 'bar',
+    })
+    const state = tree.get()
+    tree.startMutationTracking()
+    state.foo = 'bar2'
+    tree.clearMutationTracking()
+    tree.startMutationTracking()
+    state.foo = 'bar3'
+    tree.clearMutationTracking()
+    const mutations = tree.flush()
+    expect(mutations).toEqual([
+      {
+        path: 'foo',
+        method: 'set',
+        args: ['bar2'],
+      },
+      {
+        path: 'foo',
+        method: 'set',
+        args: ['bar3'],
+      },
+    ])
+  })
 })
 
 describe('ITERATIONS', () => {

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

@@ -15,6 +15,7 @@ class ProxyStateTree {
   options: Options
   pathDependencies: object
   mutations: Mutation[]
+  currentMutations: Mutation[]
   paths: Set<string>[]
   status: STATUS
   proxy: any
@@ -23,6 +24,7 @@ class ProxyStateTree {
     this.options = options
     this.pathDependencies = {}
     this.mutations = []
+    this.currentMutations = []
     this.paths = []
     this.status = STATUS.IDLE
     this.proxy = proxify(this, state)
@@ -32,6 +34,7 @@ class ProxyStateTree {
   }
   flush() {
     const pathCallbacksCalled = new Set()
+    const mutations = this.mutations.slice()
 
     for (let mutation in this.mutations) {
       const path = this.mutations[mutation].path
@@ -46,6 +49,9 @@ class ProxyStateTree {
       }
     }
     pathCallbacksCalled.clear()
+    this.mutations.length = 0
+
+    return mutations
   }
   startMutationTracking() {
     if (this.status !== STATUS.IDLE) {
@@ -55,18 +61,16 @@ class ProxyStateTree {
         }`
       )
     }
-
-    const currentMutations = this.mutations.slice()
-
     this.status = STATUS.TRACKING_MUTATIONS
-    this.mutations.length = 0
-
-    return currentMutations
   }
   clearMutationTracking() {
+    const currentMutations = this.currentMutations.slice()
+
     this.status = STATUS.IDLE
+    this.currentMutations.length = 0
+    this.mutations = this.mutations.concat(currentMutations)
 
-    return this.mutations.slice()
+    return currentMutations
   }
   startPathsTracking() {
     if (this.status === STATUS.TRACKING_MUTATIONS) {

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

@@ -57,7 +57,7 @@ function createArrayProxy(tree, value, path) {
           )
         }
         return (...args) => {
-          tree.mutations.push({
+          tree.currentMutations.push({
             method: prop,
             path: path,
             args: args,
@@ -77,7 +77,7 @@ function createArrayProxy(tree, value, path) {
         )
       }
 
-      tree.mutations.push({
+      tree.currentMutations.push({
         method: 'set',
         path: nestedPath,
         args: [value],
@@ -114,7 +114,7 @@ function createObjectProxy(tree, value, path) {
         )
       }
       if (shouldTrackMutations(tree, nestedPath)) {
-        tree.mutations.push({
+        tree.currentMutations.push({
           method: 'set',
           path: nestedPath,
           args: [value],
@@ -132,7 +132,7 @@ function createObjectProxy(tree, value, path) {
         )
       }
       if (shouldTrackMutations(tree, nestedPath)) {
-        tree.mutations.push({
+        tree.currentMutations.push({
           method: 'unset',
           path: nestedPath,
           args: [],