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

machine.js

  // Available variables:
  // - Machine
  // - interpret
  // - assign
  // - send
  // - sendParent
  // - spawn
  // - raise
  // - actions
  // - XState (all XState exports)
  
  const challengeEmailState = {
    initial: "emailPreVerify",
    context: {
      emailRetries: 0
    },
    states: {
      emailPreVerify: {
        on: {
          SUBMIT:  "emailRequestChallenge",
        }
      },
      emailRequestChallenge: {
        on: {
          RESOLVE: "emailEnterChallenge",
          REJECT: "emailPreVerify",
        }
      },
      emailEnterChallenge: {
        on: {
          SUBMIT: "emailVerifyChallenge",
          RESEND: "emailRequestChallenge",
        }
      },
      emailVerifyChallenge: {
        on: {
          RESOLVE: "emailVerificationSuccess",
          REJECT: "emailVerificationFailure",
        }
      },
      emailVerificationFailure: {
        on: {
          RETRY: {
            target: "emailEnterChallenge",
            actions: assign({
              emailRetries: (context, event) => context.emailRetries + 1
            })
          }
        }
      },
       emailVerificationSuccess: {
        type: "final"
      },
    }
  }
  
  const setupPhoneState = {
    initial: "phoneEnterNumber",
    context: {
      phoneRetries: 0
    },
    states: {
      phoneEnterNumber: {
        on: {
          SUBMIT: "phoneRequestChallenge"
        }
      },
      phoneRequestChallenge: {
        on: {
          RESOLVE: "phoneEnterChallenge",
          REJECT: "phoneEnterChallenge",
        }
      },
      phoneEnterChallenge: {
        on: {
          SUBMIT: "phoneVerifyChallenge",
          CHANGE_NUMBER: "phoneChangeNumber",
          RESEND: "phoneRequestChallenge",
        }
      },
      phoneVerifyChallenge: {
        on: {
          RESOLVE: "phoneVerificationSuccess",
          REJECT: "phoneVerificationFailure",
        }
      },
      phoneChangeNumber: {
        on: {
          SUBMIT: "phoneResetNumber",
          CANCEL: "phonePreVerify",
        }
      },
      phonePreVerify: {
        on: {
          SUBMIT: "phoneRequestChallenge",
          CHANGE_NUMBER: "phoneChangeNumber",
        }
      },
      phoneResetNumber: {
        on: {
          RESOLVE: "phoneEnterNumber",
        }
      },
      phoneVerificationFailure: {
        on: {
          RETRY: {
            target: "phoneEnterChallenge",
            actions: assign({
              phoneRetries: (context, event) => context.phoneRetries + 1
            })
          }
        }
      },
      phoneVerificationSuccess: {
        type: "final"
      },
    }
  }
  
  const mfaMachine = Machine({
    id: "MFA_SETUP",
    initial: "unverified",
    context: {
      emailRetries: 0,
      phoneRetries: 0,
    },
    states: {
      unverified: {
        on: {
          BEGIN: "setupEmail"
        }
      },
      setupEmail: {
        on: {
          CONTINUE: "setupPhone"
        },
        ...challengeEmailState
      },
      setupPhone: {
        on: {
          CONTINUE: "verified",
          RESET: "setupEmail"
        },
        ...setupPhoneState
      },
      verified: {
        type: "final"
      }
    }
  });