fix(overmind-devtools): properly handle mutations delimiter

Author: christianalfoni

packages/node_modules/overmind-devtools-client/src/components/ActionOperator/index.tsx

@@ -131,7 +131,7 @@ const ActionOperator: FunctionComponent<Props> = ({
                       textStyles.monospace
                     )}
                   >
-                    {mutation.path}
+                    {mutation.path.replace(new RegExp(delimiter, 'g'), '.')}
                   </span>
                   {mutation.args.map((arg, argIndex) => (
                     <ValueInspector delimiter={delimiter} key={argIndex} small value={arg} />

packages/node_modules/overmind-devtools-client/src/components/Inspector/index.tsx

@@ -234,7 +234,7 @@ const Nested: FunctionComponent<NestedProps> = memo(
           className={styles.bracket(true)}
           onClick={(event) => {
             event.stopPropagation()
-            onToggleExpand(path.split('.'))
+            onToggleExpand(path.split(delimiter))
           }}
         >
           <PathKey

packages/node_modules/overmind-devtools-client/src/overmind/operators.ts

@@ -161,8 +161,6 @@ export const updateDerived: () => Operator<DerivedMessage> = () =>
     target[key] = message.data.value
 
     state.apps[message.appName].derived[message.data.path.join('.')] = message.data
-
-    console.log(state.apps[message.appName].derived)
   })
 
 export const updateFlushWithDerived: () => Operator<DirtyDerivedMessage> = () =>

packages/node_modules/overmind-devtools-client/src/overmind/utils.ts

@@ -3,9 +3,9 @@ import * as ColorHash from 'color-hash'
 import { Action, App, Flush, OperatorsByPath } from './types'
 
 export const runMutation = (state) => (mutation) => {
-  const pathArray = mutation.path.split('.')
+  const pathArray = mutation.path.split(mutation.delimiter)
   const key = pathArray.pop()
-  const target = pathArray.reduce((current, pathKey) => current[pathKey].__CLASS__ ? current[pathKey].value : current[pathKey], state)
+  const target = pathArray.reduce((current, pathKey) => current[pathKey].__CLASS__ ? current[pathKey].value : current[pathKey], state)  
 
   switch (mutation.method) {
     case 'set':
@@ -35,6 +35,7 @@ export const createApp = (data: Partial<App>): App =>
     {
       name: null,
       messages: [],
+      delimiter: '.',
       state: {},
       components: {},
       derived: {},

packages/node_modules/overmind/src/index.ts

@@ -827,10 +827,9 @@ export class Overmind<ThisConfig extends IConfiguration>
             })
           }
 
-          // Access the derived async, which will trigger calculation and devtools
+          // Access the derived which will trigger calculation and devtools
           if (eventType === EventType.DERIVED_DIRTY) {
             data.derivedPath
-              .split(this.delimiter)
               .reduce((aggr, key) => aggr[key], this.proxyStateTree.state)
           }
         })(EventType[type])