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

machine.js

const assignField = (name) => assign({ [name]: (ctx, event) => event.payload });
const initialContext = {
  agreeToTerms: undefined,
};
const quoteAcceptionMachine = Machine({
  id: 'quoteAcception',
  initial: 'loading',
  context: initialContext,
  meta: {
    description:
      'A flow that describes the acceptance of an order quote also known as creating a "freight-only-shipper" order.'
  },
  on: {
    REQUEST_CLOSE: {actions: "requestClose"},
  },
  states: {
        loading: {
          invoke: {
            src: 'requestRate',
            onDone: {
              target: 'ready',
              actions: 'assignRate',
            },
            onError: {
              actions: 'requestRateFailed',
            },
          },
          meta: {
            description:
              'Wait for a quote to be offered before allowing the user to accept. If we do not submit anything to the server at this step, what is the workflow for showing presenting validation errors?',
          },
        },
        ready: {
          on: {
            SUBMIT: 'saving',
            CHANGE_AGREE_TO_TERMS: {
              actions: assignField('agreeToTerms'),
            },
            EDIT: 'editing'
          },
        },
        editing: {
          on: {
            SAVE_EDIT: 'ready'
          }
        },
        saving: {
          invoke: {
            src: 'saveQuoteAccepted',
            onDone: {
              actions: ['navigateQuoteAcceptedPage', 'notifySaveQuoteAcceptedSuccess'],
            },
            onError: {
              target: 'ready',
              actions: 'notifySaveQuoteAcceptedFailed',
            },
          },
          meta: {
            description:
              "Request goes out to accept a quote. We need to implement Promise cancellation here so that unexpected behavior doesn't occur when closing the modal or going to previous step.",
          },
        },
  },
});