overmind/packages/node_modules/overmind-devtools/src/app/state.ts at Top · 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
106
107
108
109
110
111
import { Derive } from 'overmind'
import {
  Action,
  App,
  Apps,
  Component,
  Flush,
  GroupedComponents,
  Tab,
} from './types'

type State = {
  isConnecting: boolean
  error: string
  port: string
  apps: Apps
  currentAppName: string
  newPortValue: string
  currentTab: Tab
  showApps: boolean
  expandedStatePaths: string[]
  expandAllActionDetails: boolean
  expandedComponents: string[]
  currentAction: Derive<State, Action>
  currentApp: Derive<State, App>
  componentsMounted: Derive<State, Component[]>
  componentsUpdateCount: Derive<State, number>
  componentsStatePathCount: Derive<State, number>
  flushes: Derive<State, Flush[]>
  flushesMutationsCount: Derive<State, number>
  flushesStatePathCount: Derive<State, number>
  groupedComponents: Derive<State, GroupedComponents>
}

const state: State = {
  isConnecting: true,
  error: null,
  showApps: false,
  currentAppName: null,
  port: '3031',
  apps: {},
  newPortValue: '',
  currentTab: Tab.State,
  expandedStatePaths: [''],
  expandAllActionDetails: false,
  expandedComponents: [],
  currentApp: (state) => state.apps[state.currentAppName],
  componentsMounted: (state) =>
    Object.keys(state.currentApp.components).reduce(
      (aggr, key) => {
        if (state.currentApp.components[key].isMounted) {
          return aggr.concat(state.currentApp.components[key])
        }

        return aggr
      },
      [] as Component[]
    ),
  componentsUpdateCount: (state) =>
    state.componentsMounted.reduce(
      (aggr, component) => aggr + component.updateCount,
      0
    ),
  componentsStatePathCount: (state) =>
    state.componentsMounted.reduce(
      (aggr, component) => aggr + component.paths.length,
      0
    ),
  flushes: (state) =>
    Object.keys(state.currentApp.flushes)
      .sort(
        (idA, idB) =>
          state.currentApp.flushes[idB].flushId -
          state.currentApp.flushes[idA].flushId
      )
      .map((id) => state.currentApp.flushes[id]),
  flushesMutationsCount: (state) =>
    state.flushes.reduce((aggr, flush) => aggr + flush.mutations.length, 0),
  flushesStatePathCount: (state) =>
    state.flushes.reduce((aggr, flush) => {
      return flush.mutations.reduce(
        (aggr, mutation) =>
          aggr.includes(mutation.path) ? aggr : aggr.concat(mutation.path),
        aggr
      )
    }, []).length,
  currentAction: (state) =>
    state.currentApp.actions[state.currentApp.currentActionId],
  groupedComponents(state) {
    const components = state.componentsMounted

    return components.reduce(
      (aggr, component) => {
        if (aggr[component.name]) {
          aggr[component.name].components.push(component)
        } else {
          aggr[component.name] = {
            name: component.name,
            components: [component],
            isCollapsed: !state.expandedComponents.includes(component.name),
          }
        }

        return aggr
      },
      {} as GroupedComponents
    )
  },
}

export default state