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

machine.js

const fetchMachine = Machine({
  id: 'Form Wizard',
  initial: 'pending',
  context: {
    retries: 0
  },
  states: {
    pending: {
      initial: 'email',
      states: {
        email: {
          on: {
            NEXT: {
              target: 'name',
              cond: 'isEmailValid'
            }
          }
        },
        name: {
          on: {
            PREVIOUS: 'email',
            NEXT: {
              target: 'age',
              cond: 'isNameValid',
            }
          }
        },
        age: {
          on: {
            PREVIOUS: 'name',
          }
        },
      },
      on: {
        SUBMIT: {
          target: 'submitting',
          cond: 'isValid',
        },
      }
    },
    submitting: {
      invoke: {
        src: 'submit',
        onDone: 'confirmed',
        onError: {
          target: 'error',
          actions: assign({
            error: (_ctx, action) => action.error,
          })
        }
      }
    },
    confirmed: {
      type: 'final',
    },
    error: {
      on: {
        RETRY: 'pending',
      }
    },
  }
});