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

machine.js

const fetchMachine = Machine({
  id: "root",
  states: {
    "Say Thanks": {
      id: "Say Thanks",
      states: {
        "View message": {
          id: "View message",
          states: {},
          on: {
            "Customer app link": "#Voucher logic",
            "SMS link": "#Voucher logic",
          },
        },
        "Voucher logic": {
          id: "Voucher logic",
          states: {
            "Has this voucher been claimed before?": {
              id: "Has this voucher been claimed before?",
              states: {},
              on: {
                No: "#Is this a single product voucher?",
                Yes: "#Voucher already redeemed",
              },
            },
            "Is this a single product voucher?": {
              id: "Is this a single product voucher?",
              states: {},
              on: { No: "#Multiple product voucher", Yes: "#Redeem" },
            },
          },
          initial: "Has this voucher been claimed before?",
          on: {},
        },
        "Voucher already redeemed": {
          id: "Voucher already redeemed",
          states: {
            "Has the vendor confirmed that voucher was used?": {
              id: "Has the vendor confirmed that voucher was used?",
              states: {},
              on: {
                No: "#View used voucher",
                Yes: "#View vendor confirmation",
              },
            },
            "View vendor confirmation": {
              id: "View vendor confirmation",
              states: {},
            },
            "View used voucher": { id: "View used voucher", states: {} },
          },
          initial: "Has the vendor confirmed that voucher was used?",
          on: {},
        },
        "Multiple product voucher": {
          id: "Multiple product voucher",
          states: {
            "Select reward": {
              id: "Select reward",
              states: {},
              on: {
                "TV & Media": "#Select partner",
                "Transport & Travel": "#Select partner",
                help: "#Reward help",
              },
            },
            "Select partner": {
              id: "Select partner",
              states: {},
              on: {
                "Go back": "#Select reward",
                Netflix: "#Select product",
                Uber: "#Select product",
              },
            },
            "Select product": {
              id: "Select product",
              states: {},
              on: {
                "3 month subscription - R400": "#Product description",
                "Go back": "#Select partner",
                "R200 voucher": "#Product description",
                help: "#Product help",
              },
            },
            "View selected product": {
              id: "View selected product",
              states: {},
              on: {
                "3 month subscription - R400": "#Product description",
                "Go back": "#Select reward",
                "R200 voucher": "#Product description",
                help: "#Product help",
              },
            },
            Help: {
              id: "Help",
              states: {
                "Reward help": {
                  id: "Reward help",
                  states: {},
                  on: { "Go back": "#Select reward" },
                },
                "Product help": {
                  id: "Product help",
                  states: {},
                  on: { "Go back": "#Select product" },
                },
              },
              initial: "Reward help",
              on: {},
            },
          },
          initial: "Select reward",
          on: {},
        },
        Redeem: {
          id: "Redeem",
          states: {
            "Product description": {
              id: "Product description",
              states: {},
              on: {
                "Go back multiple product": "#View selected product",
                Redeem: "#Confirm product",
              },
            },
            "Confirm product": {
              id: "Confirm product",
              states: {},
              on: {
                Confirm: "#Voucher code",
                "Go back": "#Product description",
              },
            },
          },
          initial: "Product description",
          on: {},
        },
        Voucher: {
          id: "Voucher",
          states: {
            "Voucher code": {
              id: "Voucher code",
              states: {},
              on: {
                Email: "#Email voucher code",
                WhatsApp: "#WhatsApp voucher code",
              },
            },
            "Email voucher code": {
              id: "Email voucher code",
              states: {},
              on: { "Go back": "#Voucher code" },
            },
            "WhatsApp voucher code": {
              id: "WhatsApp voucher code",
              states: {},
              on: { "Go back": "#Voucher code" },
            },
          },
          initial: "Voucher code",
          on: {},
        },
      },
      initial: "View message",
      on: {},
    },
  },
  initial: "Say Thanks",
  on: {},
});