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

machine.js

// See https://xstate.js.org/viz/?gist=759a3ee0b7d85087b18be566a1f40224 for a visualization.
// It may need to be updated. To do so just copy & paste and remove the `export` keywords.

const States = {
  START_EMAIL_AUTH: "START_EMAIL_AUTH",
  LOGIN_OR_CREATE: "LOGIN_OR_CREATE",
  LOGIN: "LOGIN",
  LOGGED_OUT: "LOGGED_OUT",
  CREATE_ACCOUNT: "CREATE_ACCOUNT",
  ACCEPT_TERMS: "ACCEPT_TERMS",
  ADD_USERNAME: "ADD_USERNAME",
  ADD_EMAIL: "ADD_EMAIL",
  ADD_PASSWORD: "ADD_PASSWORD",
  LOGGED_IN: "LOGGED_IN",
  DECIDE_NEXT_STATE: "DECIDE_NEXT_STATE"
};

const Events = {
  LOGIN: "LOGIN",
  CREATE: "CREATE",
  START: "START",
  NEXT: "NEXT",
  COMPLETE: "COMPLETE",
  ENTER_CREDENTIALS: "ENTER_CREDENTIALS"
};

const Guards = {
  isLoggedIn: "isLoggedIn",
  isLoggedOut: "isLoggedOut",
  isNextStateAcceptTerms: "isNextStateAcceptTerms",
  isNextStateAddUsername: "isNextStateAddUsername"
};

Machine(
    {
    strict: true,
    initial: States.START_EMAIL_AUTH,
    context: {
      serverState: "addUsername"
    },
    states: {
      [States.START_EMAIL_AUTH]: {
        on: {
          "": States.LOGIN_OR_CREATE
        }
      },
      [States.LOGIN_OR_CREATE]: {
        on: {
          CREATE: States.CREATE_ACCOUNT,
          LOGIN: States.LOGIN
        }
      },

      [States.LOGIN]: {
        on: {
          [Events.ENTER_CREDENTIALS]: States.LOGGED_IN
        }
      },

      [States.LOGGED_OUT]: {
        on: {
          [Events.START]: States.CREATE_ACCOUNT
        }
      },

      [States.CREATE_ACCOUNT]: {
        initial: States.DECIDE_NEXT_STATE,
        states: {
          [States.DECIDE_NEXT_STATE]: {
            on: {
              "": [
                { target: States.ACCEPT_TERMS, cond: "isNextStateAcceptTerms" },
                { target: States.ADD_USERNAME, cond: "isNextStateAddUsername" }
              ]
            }
          },

          [States.ACCEPT_TERMS]: {
            on: {
                 [Events.NEXT]: States.DECIDE_NEXT_STATE
            }
          },
          [States.ADD_USERNAME]: {
            on: {
                 [Events.NEXT]: States.DECIDE_NEXT_STATE
            }
          },

          [States.ADD_EMAIL]: {
            on: {
                 [Events.NEXT]: States.DECIDE_NEXT_STATE
            }
          },

          [States.ADD_PASSWORD]: {
            on: {
                 [Events.NEXT]: States.DECIDE_NEXT_STATE
            }
          }
        }
      },

      [States.LOGGED_IN]: {}
    }
  },
  {
    guards: {
      [Guards.isNextStateAcceptTerms]: (context, event) => {
        return context.serverState == "acceptTerms";
      },
      
      [Guards.isNextStateAddUsername]: (context, event) => {
        return context.serverState == "addUsername"
      }
    }
  }
);