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

machine.js

const signInMachine = Machine({
  id: 'signIn',
  initial: 'ready',
  states: {
    ready: {
      type: 'parallel',
      states: {
        email: {
          initial: 'noError',
          states: {
            noError: {},
            error: {
              type: 'parallel',
              states: {
                empty: {},
                invalid: {},
                noAccount: {}
              }
            }
          }
        },
        password: {
          initial: 'noError',
          states: {
            noError: {},
            error: {
              type: 'parallel',
              states: {
                empty: {},
                unsafe: {},
                incorrect: {}
              }
            }
          }
        },
        authService: {
          initial: 'noError',
          states: {
            noError: {},
            error: {
              type: 'parallel',
              states: {
                connection: {},
                server: {}
              }
            }
          }
        }
      },
      on: {
        INPUT_EMAIL: {
          target: 'ready',
          actions: ['cacheEmail']
        },
        VALIDATE_EMAIL: [
          {
            cond: 'isEmailEmpty',
            target: '.email.error.empty'
          },
          {
            cond: 'isEmailInvalid',
            target: '.email.error.invalid'
          },
          {
            target: '.email.noError'
          }
        ],
        INPUT_PASSWORD: {
          target: 'ready',
          actions: ['cachePassword']
        },
        VALIDATE_PASSWORD: [
          {
            cond: 'isPasswordEmpty',
            target: '.password.error.empty'
          },
          {
            cond: 'isPasswordUnsafe',
            target: '.password.error.unsafe'
          },
          {
            target: '.password.noError'
          }
        ],
        SUBMIT: 'waitingResponse'
      }
    },
    waitingResponse: {
      invoke: {
        src: 'signIn',
        onDone: 'success',
        onError: [
          {
            cond: 'hasNoAccount',
            target: 'ready.email.error.noAccount'
          },
          {
            cond: 'isPasswordIncorrect',
            target: 'ready.password.error.incorrect'
          },
          {
            cond: 'hasNoConnection',
            target: 'ready.authService.error.connection'
          },
          {
            cond: 'isServerDown',
            target: 'ready.authService.error.server'
          }
        ]
      }
    },
    success: {
      type: 'final'
    }
  }
})