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

machine.js

Machine({
  id: 'booking',
  context: {
    placementId: null,
    availabilityId: null
  },
  initial: 'step1',
  states: {
    step1: {
      entry: "releaseReservation",
      on: {
        CONTINUE: {
          target: "step2"
        }
      }
    },
    step2: {
      entry: "releaseReservation",
      on: {
        SET_PLACEMENT: {
          target: "step3",
          actions: "setPlacement"
        }
      }
    },
    step3: {
      entry: "releaseReservation",
      on: {
        SELECT_AVAILABILITY: {
          target: "step4",
          actions: "setAvailability"
        },
        STEP_1: {
          target: "step1"
        },
        STEP_2: {
          target: "step2"
        }
      }
    },
    step4: {
      entry: "reserveDate",
      on: {
        EXTEND_RESERVATION: {
          actions: "extendReservation"
        },
        CONTINUE: {
          target: "step5"
        },
        STEP_1: {
          target: "step1"
        },
        STEP_2: {
          target: "step2"
        },
        STEP_3: {
          target: "step3"
        },
      }
    },
    step5: {
      on: {
        EXTEND_RESERVATION: {
          actions: "extendReservation"
        },
        CONTINUE: {
          target: "step6"
        },
        STEP_1: {
          target: "step1"
        },
        STEP_2: {
          target: "step2"
        },
        STEP_3: {
          target: "step3"
        },
        STEP_4: {
          target: "step4"
        }
      }
    },
    step6: {
      on: {
        EXTEND_RESERVATION: {
          actions: "extendReservation"
        },
        CONTINUE: {
          target: "step7"
        },
        STEP_1: {
          target: "step1"
        },
        STEP_2: {
          target: "step2"
        },
        STEP_3: {
          target: "step3"
        },
        STEP_4: {
          target: "step4"
        },
        STEP_5: {
          target: "step5"
        }
      }
    },
    step7: {}
  }
})