a state chart for a signup form

signupMachine.js

const submitEvent = {
  SUBMIT: [
    {
      target: 'submitting',
      cond: 'isValidData',
    },
    { target: 'error' },
  ],
}

const signupMachine = Machine({
  id: 'signup',
  initial: 'idle',
  states: {
    idle: {
      on: {
        ...submitEvent,
      },
    },
    submitting: {
      invoke: {
        id: 'submitData',
        src: 'submitData',
        onDone: 'success',
        onError: 'failure',
      },
    },
    error: {
      on: {
        ...submitEvent,
      },
    },
    success: {},
    failure: {
      on: {
        RETRY: 'submitting',
      },
    },
  },
})