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

machine.js

const machine = Machine({
  id: "PGA Onboarding",

  initial: "Let's personalize",
  states: {
    "Let's personalize": {
      on: {
        "DO THIS LATER": "#app landing",
        CONTINUE: "Favorite tour?",
      },
    },

    "app landing": {
      id: "app landing",
    },

    "Favorite tour?": {
      initial: "none",
      states: {
        none: {
          on: { "SELECT A TOUR": "tour selected" },
        },
        "tour selected": {
          on: { CONTINUE: "#Favorite players?" },
        },
      },
      on: {
        BACK: "Let's personalize",
        SKIP: "Favorite players?",
      },
    },

    "Favorite players?": {
      id: "Favorite players?",
      initial: "none",
      states: {
        // TODO: searching players
        none: {
          on: { "SELECT A PLAYER": "player selected" },
        },
        "player selected": {
          on: {
            "SELECT A PLAYER": "player selected",
            CONTINUE: "#Notifications opt-in",
          },
        },
      },
      on: {
        BACK: "Favorite tour?",
        SKIP: "#Notifications opt-in",
      },
    },

    "Notifications opt-in": {
      id: "Notifications opt-in",
      initial: "not allowed",
      states: {
        "not allowed": {
          on: {
            BACK: "#Favorite players?",
            SKIP: "#Location opt-in",
            "TURN ON NOTIFICATIONS": "notifications prompt",
          },
        },
        "notifications prompt": {
          on: {
            "DON'T ALLOW": "#Location opt-in",
            ALLOW: "#Location opt-in",
          },
        },
      },
      // on: { BACK: "Favorite players?" },
    },

    "Location opt-in": {
      id: "Location opt-in",
      initial: "not allowed",
      states: {
        "not allowed": {
          on: {
            BACK: "#Notifications opt-in",
            SKIP: "#Let's save your progress",
            "SHARE YOUR LOCATION": "location prompt",
          },
        },
        "location prompt": {
          on: {
            "ONLY WHILE USING THE APP": "#Let's save your progress",
            "ALWAYS ALLOW": "#Let's save your progress",
            "DON'T ALLOW": "#Let's save your progress",
          },
        },
      },
    },

    "Let's save your progress": {
      id: "Let's save your progress",
      initial: "entering credentials",
      states: {
        // TODO: parallel states for name, email, password
        "entering credentials": {
          on: { "FILL FORM": "credentials ready" },
        },
        "credentials ready": {
          on: { "SUBMIT CREDENTIALS": "#building YourTOUR" },
        },
      },
      on: { BACK: "Location opt-in" },
    },

    "building YourTOUR": {
      id: "building YourTOUR",
      after: {
        2000: "#YourTOUR",
      },
    },

    YourTOUR: {
      id: "YourTOUR",
    },
  },
});