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 IdType = {
    DriversLicense: 0,
    Passport: 1
  }
  
  const FileUploadState = {
   Default: 'default',
   Loading: 'loading',
   Success: 'success',
   Fail: 'fail',
   Disabled: 'disabled'
  }
  
  const fetchMachine = Machine({
  id: 'idUploadMachine',
  initial: 'idle',
  context: {
    idType: IdType.DriversLicense,
    driversLicenseUpload: {
      frontState: FileUploadState.Default,
      backState: FileUploadState.Default
    },
    passportUpload: {
      state: FileUploadState.Default
    }
  },
  states: {
    idle: {
      on: {
        CHANGE_TYPE: {
          actions: assign({ idType: (ctx, e) => e.value })
        },
        UPLOADING_FRONT: {
          target: 'uploading',
          actions: assign({
            driversLicenseUpload: (ctx, e) => ({
              ...ctx.driversLicenseUpload,
              frontState: e.value
            })
          })
        },
        UPLOADING_BACK: {
          target: 'uploading',
          actions: assign({
            driversLicenseUpload: (ctx, e) => ({
              ...ctx.driversLicenseUpload,
              backState: e.value
            })
          })
        },
        UPLOADING_PASSPORT: {
          target: 'uploading',
          actions: assign({
            passportUpload: (ctx, e) => ({
              ...ctx.passportUpload,
              state: e.value
            })
          })
        }
      }
    },
    uploading: {}
  }
});