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: 'ConfirmAndExecuteMachine',
  initial: 'idle',

  context: {
    data: undefined,
  errorMessage: '',
  hasLoaded: false, // initial flag
  isLoading: false, // loading indicator per request,
  lastUpdate: undefined
  },

  states: {
    idle: {
      id: 'idle',
      on: {
        CONFIRM: 'confirm'
      }
    },

    confirm: {
      id: 'confirm',
      initial: 'showConfirm',
      
      states: {
        showConfirm: {
          on: {
            CANCEL: '#idle',
            SUBMIT: 'execute'
          }
        },

        execute: {
          initial: 'executing',

          states: {
            executing: {
              entry: ['startLoading'],
              exit: ['hasLoaded', 'stopLoading'],
              invoke: {
                src: 'execute',
                onDone: { target: 'success', actions: ['setData', 'clearError'] },
                onError: { target: 'failure', actions: ['setErrorMessage', 'clearData'] }
              }
            },

            failure: {
              after: {
                2000: '#idle'
              }
            },

            success: {
              after: {
                2000: '#idle'
              }
            }
          }
        }
      }
    }
  }
});