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 ReviewStepStates = {
  id: 'registrationReviewStep',
  initial: 'Reviewing',
  states: {
    Reviewing: {
      on: {
        SubmitForm: {
          target: 'Submitting',
        },
      },
    },
    Submitting: {
      invoke: {
        src: 'submitRegistration',
        onDone: {
          target: 'Success',
        },
        onError: {
          target: 'Failure',
          actions: assign({ error: (_, event) => event.data }),
        },
      },
    },
    Success: {},
    Failure: {},
  },
};

  
  const fetchMachine = Machine(  {
    id: 'farmRegistrationPage',
    initial: 'FarmDetailsStep',
    context: {
      activeStep: 0,
      farmDetails: undefined,
      farmGeolocationData: undefined,
      farmAddress: undefined,
      error: '',
    },
    states: {
      FarmDetailsStep: {
        on: {
          SubmitFarmDetails: {
            target: 'GeolocationStep',
            actions: [
              assign({
                farmDetails: (_, event) => event.data,
              }),
              'nextStep',
            ],
          },
        },
      },
      GeolocationStep: {
        on: {
          SubmitFarmGeolocationData: {
            target: 'FarmAddressStep',
            actions: [
              assign({
                farmGeolocationData: (_, event) => event.data,
              }),
              'nextStep',
            ],
          },
          Back: {
            target: 'FarmDetailsStep',
            actions: 'prevStep',
          },
        },
      },
      FarmAddressStep: {
        on: {
          SubmitFarmAddress: {
            target: 'ReviewStep',
            actions: [
              assign({
                farmAddress: (_, event) => event.data,
              }),
              'nextStep',
            ],
          },
          Back: {
            target: 'GeolocationStep',
            actions: 'prevStep',
          },
        },
      },
      ReviewStep: {
        on: {
          Edit: {
            target: 'FarmDetailsStep',
            actions: assign({ activeStep: () => 0 }),
          },
        },
        ...ReviewStepStates,
      },
    },
  },
  {
    actions: {
      nextStep: assign({
        activeStep: (context) => context.activeStep + 1,
      }),
      prevStep: assign({
        activeStep: (context) => context.activeStep - 1,
      }),
    },
  },
);