overmind/packages/node_modules/overmind-vue/src/index.ts at actionContext · hipertracker/overmind · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
import { EventType } from 'overmind'

const OVERMIND = Symbol('OVERMIND')
const IS_PRODUCTION = process.env.NODE_ENV === 'production'

let nextComponentId = 0

function createMixin(overmind, propsCallback) {
  const componentId = nextComponentId++
  let componentInstanceId = 0

  return {
    beforeMount(this: any) {
      this[OVERMIND] = {
        tree: (overmind as any).proxyStateTree.getTrackStateTree(),
        componentInstanceId: componentInstanceId++,
        onUpdate: (mutations, paths, flushId) => {
          this[OVERMIND].currentFlushId = flushId
          this.$forceUpdate()
        },
      }
      this.overmind = {
        state: this[OVERMIND].tree.state,
        actions: overmind.actions,
        effects: overmind.effects,
        addMutationListener: overmind.addMutationListener,
      }

      if (propsCallback) {
        Object.assign(
          this,
          propsCallback({
            state: this[OVERMIND].tree.state,
            actions: overmind.actions,
            effects: overmind.effects,
          })
        )
      }
      this[OVERMIND].tree.track(this[OVERMIND].onUpdate)
    },
    beforeUpdate(this: any) {
      this[OVERMIND].tree.track(this[OVERMIND].onUpdate)
    },
    ...(IS_PRODUCTION
      ? null
      : {
          mounted(this: any) {
            overmind.eventHub.emitAsync(EventType.COMPONENT_ADD, {
              componentId,
              componentInstanceId: this[OVERMIND].componentInstanceId,
              name: this.$options.name || '',
              paths: Array.from(this[OVERMIND].tree.pathDependencies) as any,
            })
          },
          updated(this: any) {
            overmind.eventHub.emitAsync(EventType.COMPONENT_UPDATE, {
              componentId,
              componentInstanceId: this[OVERMIND].componentInstanceId,
              name: this.$options.name || '',
              flushId: this[OVERMIND].currentFlushId,
              paths: Array.from(this[OVERMIND].tree.pathDependencies) as any,
            })
          },
        }),
    beforeDestroy(this: any) {
      // @ts-ignore
      overmind.proxyStateTree.disposeTree(this[OVERMIND].tree)
      if (IS_PRODUCTION) {
        return
      }

      overmind.eventHub.emitAsync(EventType.COMPONENT_REMOVE, {
        componentId,
        componentInstanceId: this[OVERMIND].componentInstanceId,
        name: this.$options.name || '',
      })
    },
  }
}

export const createPlugin = (overmind) => ({
  install(
    Vue,
    propsCallback = ({ state, actions, effects }) => ({
      state,
      actions,
      effects,
    })
  ) {
    Vue.mixin(createMixin(overmind, propsCallback))
  },
})

export const createConnect = (overmind) => (...args) => {
  let options = args.length === 1 ? args[0] : args[1]
  let propsCallback = args.length === 1 ? null : args[0]

  return {
    ...options,
    mixins: (options.mixins ? options.mixins : []).concat(
      createMixin(overmind, propsCallback)
    ),
    overmind,
  } as any
}