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 deleteMachine = Machine({
    id: 'deleteConfirmation',
    initial: 'idle',
    context: {
      requiresConfirmation: true,
      warnings: undefined,
      rejections: undefined
    },
    states: {
      idle: {
        on: {
          CLICK: 'verifying'
        }
      },
      verifying: {
        invoke: {
          src: 'checkIfDeleteIsPossible',
          onDone: {
            target: 'checking',
            actions: assign({
              rejections: (_, event) => event.data.Data.Rejections,
              warnings: (_, event) => event.data.Data.Warnings
            })
          }
        }
      },
      checking: {
        on: {
          '': [
            {
              target: 'containsRejections',
              cond: 'containsRejections'
            },
            {
              target: 'containsWarnings',
              cond: 'containsWarnings'
            },
            {
              target: 'requiresConfirmation',
              cond: 'requiresConfirmation'
            },
            { target: 'deleting' }
          ]
        }
      },
      containsRejections: {
        on: {
          CANCEL: 'idle',
          CONFIRM: undefined
        }
      },
      containsWarnings: {
        on: {
          CANCEL: 'idle',
          CONFIRM: 'deleting'
        }
      },
      requiresConfirmation: {
        on: {
          CANCEL: 'idle',
          CONFIRM: 'deleting'
        }
      },
      deleting: {
        invoke: {
          src: 'handleDelete',
          onDone: {
            target: 'success'
          }
        }
      },
      success: {
        invoke: {
          src: 'handleDeleteSuccess'
        },
        type: 'final'
      }
    }
  },
  {
    guards: {
      containsRejections: context => {
        const rejectionsLength = context.rejections?.length

        return rejectionsLength !== undefined && rejectionsLength > 0
      },
      containsWarnings: context => {
        const warningsLength = context.warnings?.length

        return warningsLength !== undefined && warningsLength > 0
      },
      requiresConfirmation: context => context.requiresConfirmation
    },
    services: {
      checkIfDeleteIsPossible: () => {
        return handleDelete(true)
      },
      handleDelete: () => handleDelete(false),
      handleDeleteSuccess: async () => {
        success()
      }
    }
  });

  function success() {
    window.alert('success!')
  }
  
  function handleDelete(checkIfDeleteIsPossible, deleteReason) {
    if (checkIfDeleteIsPossible) {
      return Promise.resolve({
        Data: {
          Rejections: [],
          Warnings: [{
            
          }]  
        }
      })
    }
    
    return Promise.resolve(true)
  }