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

registerVisitMachine.js

function isEmpty(text) {
    return !Boolean(text);
}
function isShort(text, minLength) {
    return isEmpty(text) || text.length < minLength;
}

const fillDetailConfig = {
  id: 'fill-details',
  context: {
    visitor: '',
    resident: null,
  },
  type: 'parallel',
  states: {
    visitor: {
      initial: 'valid',
      states: {
        valid: {},
        invalid: {
          initial: 'empty',
          states: {
            empty: {},
            tooShort: {},
          },
        },
      },
      on: {
        SET_VISITOR_NAME: [
          {
            target: '.invalid.empty',
            actions: 'setVisitor',
            cond: 'isVisitorNameEmpty',
          },
          {
            target: '.invalid.tooShort',
            actions: 'setVisitor',
            cond: 'isVisitorNameShort',
          },
          { target: '.valid', actions: 'setVisitor' },
        ],
      },
    },
    resident: {
      initial: 'unset',
      states: {
        unset: {},
        chosen: {},
      },
      on: {
        SET_RESIDENT: [
          {
            target: '.unset',
            actions: 'setResident',
            cond: 'isResidentUnset',
          },
          { target: '.chosen', actions: 'setResident' },
        ],
      },
    },
  },
};
const fillDetailOptions = {
  actions: {
    setVisitor: assign((_, event) => ({
      visitor: event.fullName,
    })),
    setResident: assign((_, event) => ({
      resident: event.resident,
    })),
  },
  guards: {
    isVisitorNameEmpty(_, event) {
      return isEmpty(event.fullName);
    },
    isVisitorNameShort(_, event) {
      return isShort(event.fullName, 3);
    },
    isResidentUnset(_, event) {
      return event.resident == null;
    },
  },
};
const fillDetailMachine = Machine(fillDetailConfig, fillDetailOptions);

const registerVisitConfig = {
  id: 'register-visit',
  context: {
    fullName: '',
    resident: '',
    documentPhoto: '',
    vehiclePhoto: null,
    errorMessage: undefined,
    detailMachineRef: null,
  },
  initial: 'filling',
  states: {
    filling: {
      entry: 'spawnFillDetailMachine',
    },
    takingDocumentPhoto: {},
    viewingDocumentPhoto: {},
    takingVehiclePhoto: {},
    viewingVehiclePhoto: {},
    sending: {},
    successful: {},
    error: {},
  },
};
const registerVisitOptions = {
  actions: {
    spawnFillDetailMachine: assign({
      detailMachineRef: () => spawn(fillDetailMachine),
    }),
  },
};
const registerVisitMachine = Machine(registerVisitConfig, registerVisitOptions);