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

machine.js

const jobsMachine = Machine({
  id: 'jobs',
  initial: 'loading',
  context: {},
  states: {
    loading: {
      invoke: {
        id: 'loadJobs',
        onDone: { target: 'idle', actions: 'writeDataToContext' },
      },
    },
    idle: {
      on: {
        OPEN_DELETE_JOB_DIALOG: {
          target: 'deleteJobDialog',
          actions: 'writeJobIdToContext',
        },
        OPEN_CREATE_JOB_DIALOG: {
          target: 'createJobDialog',
          actions: 'writeEmptyVariablesToContext',
        },
        OPEN_EDIT_JOB_DIALOG: {
          target: 'editJobDialog',
          actions: ['writeJobIdToContext', 'writeVariablesToContext'],
        },
        OPEN_DUPLICATE_JOB_DIALOG: {
          target: 'createJobDialog',
          actions: ['writeVariablesToContext'],
        },
      },
    },
    deleteJobDialog: {
      on: {
        DELETE_JOB: 'deleting',
        CANCEL: { target: 'idle', actions: 'clearContext' },
      },
    },
    deleting: {
      invoke: {
        id: 'deleteJob',
        onDone: 'idle',
      },
      entry: 'removeJobFromContext',
      exit: 'removeJobIdFromContext',
    },
    createJobDialog: {
      on: {
        CANCEL: { target: 'idle', actions: 'clearContext' },
        CREATE_JOB: {
          target: 'creatingJob',
          actions: 'writeVariablesToContext',
        },
      },
    },
    creatingJob: {
      invoke: {
        id: 'createJob',
        onDone: { target: 'idle', actions: 'appendJob' },
      },
    },
    editJobDialog: {
      on: {
        CANCEL: { target: 'idle', actions: 'clearContext' },
        OPEN_DELETE_JOB_DIALOG: 'deleteJobDialog',
        UPDATE_JOB: {
          target: 'updatingJob',
          actions: ['writeVariablesToContext', 'optimisticallyUpdateJob'],
        },
      },
    },
    updatingJob: {
      invoke: {
        id: 'updateJob',
        onDone: 'idle',
      },
    },
  },
});