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 isStoreMember = (context, event) => event.isStoreMember;
  
  const isOtpFromSignup = (context) => context.stateBeforeOtp === 'signUp';
  
  const isOtpFromForgotPassword = (context) => context.stateBeforeOtp === 'forgotPassword';
  
  const fetchMachine = Machine({
    id: 'userSession',
    initial: 'inputPhone',
    context: {
      stateBeforeOtp: undefined,
    },
    states: {
      inputPhone: {
        on: {
          SIGN_IN: 'checkIsMember',
          SIGN_UP: 'signUp',
        },
      },
      
      checkIsMember: {
        on: {
          NEXT: [
            { target: 'signIn', cond: isStoreMember },
            { target: 'becomeMember' },
          ],
        },
      },
      
      signIn: {
        on: {
          BACK: 'inputPhone',
          NEXT: 'success',
          FORGOT_PASSWORD: 'forgotPassword',
        },
      },
      
      becomeMember: {
        initial: 'start',
        states: {
          start: {
            on: {
              BACK: '#userSession.inputPhone',
              NEXT: 'successMsg',
              FORGOT_PASSWORD: '#userSession.forgotPassword',
            },
          },
          successMsg: {
            on: {
              NEXT: '#userSession.success',
            },
          },
        },
      },
      
      verifyOtp: {
        initial: 'start',
        states: {
          start: {
            on: {
              '': 'enterOtpCode',
            },
          },
          enterOtpCode: {
            on: {
              BACK: [
                { target: '#userSession.signUp', cond: isOtpFromSignup },
                { target: '#userSession.forgotPassword', cond: isOtpFromForgotPassword },
              ],
              VERIFIED: [
                { target: '#userSession.signUp.enterUserData', cond: isOtpFromSignup },
                { target: '#userSession.forgotPassword', cond: isOtpFromForgotPassword },
              ],
              DID_NOT_RECEIVE: 'smsHelp',
            },
          },
          smsHelp: {
            on: {
              BACK: 'enterOtpCode',
            },
          },
        },
      },
      
      signUp: {
        initial: 'start',
        states: {
          start: {
            on: {
              BACK: '#userSession.inputPhone',
              NEXT: '#userSession.verifyOtp',
            },
          },
          enterUserData: {
            on: {
              FINISH: '#userSession.success',
              CLOSE: '#userSession.aborted',
            },
          },
        },
      },
      
      forgotPassword: {
        initial: 'start',
        states: {
          start: {
            on: {
              '': {
                target: '#userSession.verifyOtp',
                actions: assign({
                  stateBeforeOtp: 'forgotPassword',
                }),
              },
            },
          },
        },
      },
      
      success: {
        type: 'final',
      },
      
      aborted: {
        type: 'final',
      },
      
      externalBecomeMember: {
        type: 'final',
      },
    },
  });