state.ts

import { Derive } from './'
import {
  Action,
  App,
  Apps,
  Component,
  Flush,
  GroupedComponents,
  Tab,
} from './types'

export let isConnecting: boolean = true

export let error: string = null

export let currentAppName: string = null

export let port: string = '3031'

export let apps: Apps = {}

export let newPortValue: string = ''

export let currentTab: Tab = Tab.State

export let expandedStatePaths: string[] = ['']

export const currentApp: Derive<App> = (state) =>
  state.apps[state.currentAppName]

export const componentsMounted: Derive<Component[]> = (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[]
  )

export const componentsUpdateCount: Derive<number> = (state) =>
  state.componentsMounted.reduce(
    (aggr, component) => aggr + component.updateCount,
    0
  )

export const componentsStatePathCount: Derive<number> = (state) =>
  state.componentsMounted.reduce(
    (aggr, component) => aggr + component.paths.length,
    0
  )

export const flushes: Derive<Flush[]> = (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])

export const flushesMutationsCount: Derive<number> = (state) =>
  state.flushes.reduce((aggr, flush) => aggr + flush.mutations.length, 0)

export const flushesStatePathCount: Derive<number> = (state) =>
  state.flushes.reduce((aggr, flush) => {
    return flush.mutations.reduce(
      (aggr, mutation) =>
        aggr.includes(mutation.path) ? aggr : aggr.concat(mutation.path),
      aggr
    )
  }, []).length

export const currentAction: Derive<Action> = (state) =>
  state.currentApp.actions[state.currentApp.currentActionId]

export let expandAllActionDetails: boolean = false

export const expandedComponents: string[] = []

export const groupedComponents: Derive<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
  )
}