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 PAGE_TITLES = {
    EMO: {
      LANDING_PAGE: 'landing page',
      NO_PROGRAM: 'no program',
      CONFIRM_AREA: 'confirm area',
      BODY_SELECTOR: 'body selector',      
    },
  };
  
  const getPageTitle = (
  newTitle
) => {
  return {
    pageTitle: newTitle,
    ariaLiveText: `Page loaded: ${newTitle}`,
  };
};
  
  const intakeMachine = Machine(  {
    initial: 'landingPage',
    context: {
      pageTitle: 'loading',
      ariaLiveText: 'loading',
      userResponses: {
        emoOnCurrentIndication: undefined,
        emoIndication: undefined,
      },
    },
    states: {
      landingPage: {
        entry: assign(getPageTitle(PAGE_TITLES.EMO.LANDING_PAGE)),

        on: {
          STEP_FORWARD: [
            { target: 'confirmFocusArea', cond: 'emoSupported' },
            { target: 'programNotSupported' },
          ],
        },
      },
      programNotSupported: {
        entry: assign(getPageTitle(PAGE_TITLES.EMO.NO_PROGRAM)),
        type: 'final',
      },
      confirmFocusArea: {
        entry: assign(getPageTitle(PAGE_TITLES.EMO.CONFIRM_AREA)),
        on: {
          STEP_FORWARD: {
            target: 'bodySelector',
            actions: ['setUserResponses'],
            cond: 'workOnNewArea',
          },
        },
      },

      bodySelector: {
        entry: assign(getPageTitle(PAGE_TITLES.EMO.BODY_SELECTOR)),
        type: 'final',
      },
    },
  },
  {
    actions: {
      setUserResponses: assign((_context, event) => {
        return event.type === 'STEP_FORWARD'
          ? {
              userResponses: event.userResponses,
            }
          : {};
      }),
    },
    guards: {
      emoSupported: (_context, event) => {
        return event.type === 'STEP_FORWARD' && !!event.clientSupportsEmo;
      },
      workOnNewArea: (_context, event) => {
        return (
          event.type === 'STEP_FORWARD' &&
          event.userResponses?.emoOnCurrentIndication === 'no'
        );
      },
    },
  },
);