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

machine.js

const bookingMachine = Machine({
  id: "booking",
  initial: "idle",
  context: {
    fetched: {
      purposes: undefined,
      specifiers: undefined,
      servicePoints: undefined,
      appointmentTypes: undefined,
    },
    selected: {
      purpose: undefined,
      specifiers: undefined,
      appointmentType: undefined,
    },
  },
  states: {
    idle: {
      on: {
        NEXT: "fetchPurposes",
      },
    },
    fetchPurposes: {
      invoke: {
        id: "fetchPurposes",
        onDone: {
          target: "selectPurpose",
          actions: assign({
            fetched: (context, event) => ({
              purposes: event.data,
              specifiers: event.data,
            }),
          }),
        },
        onError: "failure",
      },
    },
    selectPurpose: {
      on: {
        NEXT: "selectSpecifiers",
      },
    },
    selectSpecifiers: {
      on: {
        NEXT: "fetchServicePoints",
      },
    },
    fetchServicePoints: {
      invoke: {
        id: "fetchServicePoints",
        onDone: {
          target: "selectAppointmentType",
          actions: assign({
            fetched: (context, event) => ({
              servicePoints: event.data,
              appointmentTypes,
            }),
          }),
        },
        onError: "failure",
      },
    },
    selectAppointmentType: {},
    ready: {
      type: "final",
    },
    failure: {
      type: "final",
    },
  },
});