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 fetchMachine = Machine({
  id: 'screen',
  context: {
    screen: null,
    patientScreen: null,
    showVisitHistory: false,
    visitId: null,
    productHistoryId: null,
    txCompletionDate: null,
    txCompletionFocusKey: null,
    generateTxSheetFromEstimateId: null,
  },
  on: {
    /**
     * Use a single machine for all the app routes so that we can support
     * navigating anywhere at any time. If we split this up and nest it
     * in child React components, then deep navigation events from a top-level
     * screen will get dropped. If you can discover a way to not drop deep nav
     * events, then feel free to split up this screen config.
     */
    GOTO_LOCKED: {target: '#lockScreen', actions: 'updateBrowserRoute'},
    GOTO_STATUS_BOARD: {
      target: '#statusBoardScreen',
      actions: 'updateBrowserRoute',
    },
    GOTO_PATIENT: {
      target: '#patientScreen',
      actions: 'updateBrowserRoute',
    },
    GOTO_PATIENT_TX_SHEET: {
      target: '#patientTxSheetScreen',
      actions: 'updateBrowserRoute',
    },
    GOTO_PATIENT_CHART: {
      target: '#patientChartScreen',
      actions: 'updateBrowserRoute',
    },
    GOTO_PATIENT_ESTIMATE: {
      target: '#patientEstimateScreen',
      actions: 'updateBrowserRoute',
    },
    GOTO_PATIENT_VITAL: {
      target: '#patientVitalScreen',
      actions: 'updateBrowserRoute',
    },
    GOTO_PATIENT_INVOICE: {
      target: '#patientInvoiceScreen',
      actions: 'updateBrowserRoute',
    },
    GOTO_PATIENT_TX_COMPLETION: {
      // targeting by custom id wasn't working for some reason
      target: '.medical.patient.viewing.txCompletion',
      actions: 'updateBrowserRoute',
    },
    GOTO_PATIENT_PRODUCT_HISTORY: {
      // targeting by custom id wasn't working for some reason
      target: '.medical.patient.viewing.productHistory',
      actions: 'updateBrowserRoute',
    },
    GOTO_ADMIN: {target: '#adminScreen', actions: 'updateBrowserRoute'},
    GO_BACK: {actions: 'goBack'},
  },
  initial: 'everyone',
  states: {
    everyone: {
      id: 'lockScreen',
      entry: 'assignLock',
    },
    medical: {
      initial: 'statusBoard',
      states: {
        statusBoard: {
          id: 'statusBoardScreen',
          entry: 'assignStatusBoard',
        },
        patient: {
          id: 'patientScreen',
          entry: 'assignPatient',
          exit: 'unassignPatientScreen',
          on: {
            TOGGLE_VISIT_HISTORY: {
              actions: ['toggleVisitHistory', 'updateBrowserRoute'],
            },
          },
          initial: 'waitingForCache',
          states: {
            /**
             * When a new visit is loaded, we were having issues with apollo cache not updating the data for
             * some of the visit screen components. The easiest solution was to unmount everything when
             * visits are changed from the patient switcher. The 300ms is an arbitrary value.
             */
            waitingForCache: {
              entry: 'assignPatientPending',
              after: {
                300: 'viewing',
              },
            },
            viewing: {
              initial: 'txSheet',
              // todo: simplify all of this by generating it from a config
              states: {
                txSheet: {
                  id: 'patientTxSheetScreen',
                  entry: 'assignTxSheet',
                },
                chart: {
                  id: 'patientChartScreen',
                  entry: 'assignChart',
                },
                estimate: {
                  id: 'patientEstimateScreen',
                  entry: 'assignEstimate',
                },
                vital: {
                  id: 'patientVitalScreen',
                  entry: 'assignVital',
                },
                invoice: {
                  id: 'patientInvoiceScreen',
                  entry: 'assignInvoice',
                },
                productHistory: {
                  id: 'patientProductHistoryScreen',
                  entry: 'assignProductHistory',
                },
                txCompletion: {
                  id: 'patientTxCompletionScreen',
                  entry: 'assignTxCompletion',
                },
              },
            },
          },
        },
      },
    },
    business: {
      id: 'adminScreen',
      entry: 'assignAdmin',
      on: {
        TOGGLE_VISIT_HISTORY: {actions: 'toggleVisitHistory'},
      },
    },
  },
});