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

machine.js

const auth = Machine({
  id: 'auth',
  initial: 'authenticating',
  states: {
    authenticating: {
      after: {
        1000: 'authenticated'
      }
    },
    authenticated: {
      entry: sendParent('TOKEN')
    }
  }
});

const server = Machine({
  id: 'server',
  initial: 'idle',
  states: {
    idle: {
      on: {
        TOKEN: {
          actions: sendParent('USER', { delay: 1000 })
        }
      }
    }
  }
});

const client = Machine({
  id: 'client',
  initial: 'login',
  invoke: {
    id: 'server',
    src: server
  },
  states: {
    login: {
      on: {
        LOGIN: 'auth'
      }
    },
    auth: {
      invoke: {
        id: 'auth',
        src: auth
      },
      on: {
        TOKEN: 'fetchUser'
      }
    },
    fetchUser: {
      entry: send('TOKEN', { to: 'server' }),
      on: {
        USER: 'success'
      }
    },
    success: {}
  }
})