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

machine.js

const ConnectionMachine = Machine({
    id: 'connection',
    initial: 'inactive',
    context: {},
    on: {
      CONNECT: {
        actions: ['assignConnector'],
        target: '#active',
      },
    },
    states: {
      active: {
        id: 'active',
        initial: 'connecting',
        exit: 'clearConnection',
        invoke: {
          id: 'connector',
          src: {
            type: 'connector',
          },
          onError: {
            // Allow connectors to escalate errors back to the parent machine.
            actions: ['handleConnectorError'],
            target: '#error',
          },
          onDone: {
            // Allow less complex connectors to prepare the connection simply by e.g. resolving a promise.
            actions: ['handleConnectorDone'],
            target: '#connected',
          },
        },
        on: {
          // Allow more complex connectors to manage the connection state by sending events to the parent.
          DISCONNECT: '#inactive',
          ERROR: {
            actions: ['assignError'],
            target: '#error',
          },
        },
        states: {
          connecting: {
            id: 'connecting',
            on: {
              CONNECTED: {
                actions: ['assignConnection'],
                target: '#connected',
              },
            },
          },
          connected: {
            id: 'connected',
            on: {
              ACCOUNTS_CHANGED: {
                actions: ['assignAccounts'],
              },
              NETWORK_CHANGED: {
                actions: ['assignNetwork'],
              },
            },
          },
        },
      },
      inactive: {
        id: 'inactive',
        initial: 'idle',
        states: {
          idle: {
            id: 'idle',
          },
          error: {
            id: 'error',
            exit: 'clearError',
          },
        },
      },
    },
  });