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 idle = '@state/idle';
const loading = '@state/loading';
const noResults = '@state/noResults';
const getEntityTypeById = '@state/getEntityTypeById';
const addControl = '@state/addControl';
const addEntityType = '@state/addEntity';
const addEntityProperty = '@state/addEntityProperty';
const done = '@state/done';
const error = '@state/error';
const empty = '@state/empty';
const editing = '@state/editing';
const success = '@state/success';
const deleting = '@state/deleting';
const deleted = '@state/deleted';
const pending = '@state/pending';
const debouncing = '@state/debouncing';
const retry = '@state/retry';
const noMoreRetries = '@state/noMoreRetries';
const fatal = '@state/fatal';
const FETCH = '@action/FETCH';
  const fetchMachine = Machine({
    id: 'foo',
    initial: idle,
    context: {
      maxRetries: 3,
      retries: 0,
      retryDelayMs: 2000,
      error: null,
      items: [],
    },
    states: {
      [idle]: {
        on: {
          [FETCH]: {
            target: pending,
          },
        },
      },
      [pending]: {
        invoke: {
          id: 'pending',
          src: 'fetchData',
          onDone: {
            target: success,
            actions: 'setData',
          },
          onError: {
            target: error,
            actions: ['setError'],
          },
        },
      },
      [success]: {
        target: done,
      },
      [error]: {
        after: [
          {
            delay: 1000,
            target: retry,
            cond: 'shouldRetry',
          },
        ],
      },
      [retry]: {
        entry: send(FETCH, {
          delay: 'backoff',
        }),
        on: {
          [FETCH]: {
            target: pending,
            actions: 'willRetry',
          },
        },
      },
      [done]: {
        type: 'final',
      },
    },
  }, {
    actions: {
      willRetry: assign({
        retries: ({ retries }) => retries + 1,
      }),
      setError: assign({
        error: () => 'error',
      }),
      setData: assign({
        items: () => ['item one', 'item two']
      }),
    },
    guards: {
      shouldRetry: ({ retries, maxRetries } = {}) => retries < maxRetries,
    }
  });