// Available variables:
  // - Machine
  // - interpret
  // - assign
  // - send
  // - sendParent
  // - spawn
  // - raise
  // - actions
  // - XState (all XState exports)

  const fetchMachine = Machine({
  id: 'Recommendations',
  initial: 'loading',
  context: {
    highlighted: null,
    Recommendations: [],
  },
  states: {
    loading: {
      invoke: {
        src: () => setTimeout(() => Promise.resolve(), 500),
        onDone: 'loaded',
        onError: 'hasError',
      },
    },
    loaded: {
      entry: ['saveRecommendations', 'setHighlighted'],
      type: 'parallel',
      states: {
        ui: {
          initial: 'ready',
          states: {
            ready: {
              on: {
                OMIT_Recommendation: {
                  actions: ['sendRequestOmit', 'findNextHighlighted'],
                },
              },
            },
          },
        },
        background: {
          initial: 'waiting',
          states: {
            waiting: {
              on: {
                SEND_REQUEST_OMIT: 'omiting',
              },
            },
            omiting: {
              invoke: {
                src: setTimeout(() => Promise.resolve(), 500),
                onDone: 'updatingRecommendations',
                // onError: 'autoRetry',
              },
            },
            updatingRecommendations: {
              invoke: {
                src: setTimeout(() => Promise.resolve(), 500),
                onDone: {
                  target: 'waiting',
                  actions: ['updateRecommendationsContext'],
                },
                // onError: 'waiting'
              },
            },
          },
        },
      },
    },
    hasError: {
      RETRY_LOAD_RecommendationS: 'loading',
    },
  },
});