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 fetchMachine = Machine({
    id: "checkoutApp",
    initial: "studentEntry",
    strict: true,
    context: {},
    states: {
      studentEntry: {
        type: "atomic",
        on: {
          CHANGE_STUDENTS: {
            actions: assign((context, event) => {
              const students = event.value
              return {
                students,
                someoneTakingLanguage: students.some(student => student.tests.language),
                someoneTakingScience: students.some(student => student.tests.science),
              }
            }),
          },
          NEXT: [{ target: "scheduling.review", cond: "bookingComplete" }, { target: "scheduling" }],
        },
      },
      scheduling: {
        type: "compound",
        on: {
          CHANGE_BOOKINGS: {
            actions: assign({
              bookings: (context, event) => ({ ...context.bookings, ...event.bookings }),
            }),
          },
          NEXT: "checkout",
          "SCHEDULE.READING": "scheduling.reading",
          "SCHEDULE.MATH": "scheduling.math",
          "SCHEDULE.LANGUAGE": "scheduling.language",
          "SCHEDULE.SCIENCE": "scheduling.science",
          "NAVIGATE.STUDENT_ENTRY": "studentEntry",
        },
        initial: "reading",
        states: {
          reading: {
            entry: send({
              type: "CHANGE_BOOKINGS",
              bookings: { math: undefined, language: undefined, science: undefined },
            }),
            on: {
              NEXT: [{ target: "review", cond: "bookingComplete" }, { target: "math" }],
            },
          },
          math: {
            entry: send({
              type: "CHANGE_BOOKINGS",
              bookings: { language: undefined, science: undefined },
            }),
            on: {
              NEXT: [
                { target: "review", cond: "bookingComplete" },
                {
                  target: "language",
                  cond: {
                    type: "needTest",
                    testName: "language",
                  },
                },
              ],
            },
          },
          language: {
            entry: send({
              type: "CHANGE_BOOKINGS",
              bookings: { science: undefined },
            }),
            on: {
              NEXT: [
                { target: "review", cond: "bookingComplete" },
                {
                  target: "science",
                  cond: {
                    type: "needTest",
                    testName: "science",
                  },
                },
              ],
            },
          },
          science: {
            on: {
              NEXT: "review",
            },
          },
          review: {},
        },
      },
      checkout: {
        type: "atomic",
        on: {
          "NAVIGATE.STUDENT_ENTRY": "studentEntry",
          "NAVIGATE.SCHEDULING": "scheduling.review",
          SUCCESS: "checkoutSuccess",
        },
      },
      checkoutSuccess: {
        type: "final",
      },
    },
  },
  {
    actions: {},
    guards: {
      needTest: (context, event, { cond }) => {
        // logic omitted
        return true
      },
      bookingComplete: (context, event) => {
        // logic ommitted
        return false
      },
    },
  });