Generated by XState Viz: https://xstate.js.org/viz

machine.js

const config = {
  id: 'application-workflow',
  initial: 'initializing',
  on: {CHANNEL_UPDATED: {actions: ['sendChannelUpdatedNotification']}},
  states: {
    initializing: {
      entry: 'displayUi',
      on: {
        CREATE_CHANNEL: {target: 'createChannelInStore', actions: ['assignChannelParams']},
        JOIN_CHANNEL: {target: 'joinChannel'}
      }
    },
    joinChannel: {
      invoke: {src: 'signFirstState', onDone: 'confirmChannelCreation'},
      entry: ['assignChannelId', 'spawnObserver'],
      exit: ['sendJoinChannelResponse']
    },
    createChannelInStore: {
      invoke: {
        data: (_, event) => event.data,
        src: 'createChannel',
        onDone: {
          target: 'confirmChannelCreation',
          actions: ['assignChannelId', 'spawnObserver', 'sendCreateChannelResponse']
        }
      }
    },
    confirmChannelCreation: {
      initial: 'getDataForCreateChannelConfirmation',
      states: {
        getDataForCreateChannelConfirmation: {
          invoke: {
            src: 'getDataForCreateChannelConfirmation',
            onDone: 'invokeCreateChannelConfirmation'
          }
        },
        invokeCreateChannelConfirmation: {
          invoke: {
            id: undefined,
            src: 'invokeCreateChannelConfirmation',
            data: (_, {data}) => data,
            onDone: 'done',
            autoForward: true
          }
        },
        done: {type: 'final'}
      },
      onDone: 'openChannelAndFundProtocol'
    },
    openChannelAndFundProtocol: {
      initial: 'getDataForCreateChannelAndFund',
      states: {
        getDataForCreateChannelAndFund: {
          invoke: {
            src: 'getDataForCreateChannelAndFund',
            onDone: 'invokeCreateChannelAndFundProtocol'
          }
        },
        invokeCreateChannelAndFundProtocol: {
          invoke: {
            id: undefined,
            src: 'invokeCreateChannelAndFundProtocol',
            data: (_, {data}) => data,
            onDone: 'done',
            autoForward: true
          }
        },
        done: {type: 'final'}
      },
      onDone: 'running'
    },
    running: {
      entry: ['hideUi'],
      on: {
        SPAWN_OBSERVERS: {actions: ['spawnObserver']},
        PLAYER_STATE_UPDATE: {
          target: 'running',
          actions: ['updateStoreWithPlayerState', 'sendUpdateChannelResponse']
        },
        CHANNEL_UPDATED: [
          {
            cond: {name: 'channelClosing', predicate: () => true, type: 'xstate.guard'},
            target: 'concludeState'
          }
        ],
        PLAYER_REQUEST_CONCLUDE: {target: 'concludeState'}
      }
    },
    concludeState: {invoke: {src: 'signConcludeState', onDone: {target: 'closing'}}},
    closing: {
      entry: 'displayUi',
      exit: 'hideUi',
      invoke: {
        id: 'closing-protocol',
        src: 'invokeClosingProtocol',
        data: context => context,
        autoForward: true,
        onDone: {target: 'done', actions: ['sendCloseChannelResponse']}
      }
    },
    done: {type: 'final'}
  }
};
const guards = {
  channelOpen: {name: 'channelOpen', predicate: () => true, type: 'xstate.guard'},
  channelClosing: {name: 'channelClosing', predicate: () => true, type: 'xstate.guard'},
  channelClosed: {name: 'channelClosed', predicate: () => true, type: 'xstate.guard'}
};
const customActions = {
  sendCloseChannelResponse: 'sendCloseChannelResponse',
  sendUpdateChannelResponse: 'sendUpdateChannelResponse',
  assignChannelParams: 'assignChannelParams',
  sendCreateChannelResponse: 'sendCreateChannelResponse',
  sendJoinChannelResponse: 'sendJoinChannelResponse',
  sendChannelUpdatedNotification: 'sendChannelUpdatedNotification',
  hideUi: 'hideUi',
  displayUi: 'displayUi',
  assignChannelId: 'assignChannelId',
  spawnObservers: 'spawnObserver',
  updateStoreWithPlayerState: 'updateStoreWithPlayerState'
};
const machine = Machine(config, {guards, actions: customActions});