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: "search",
  initial: "idle",
  context: {
    retries: 0,
    error: undefined,
    results: undefined
  },
  states: {
    idle: {
      on: {
        SEARCH: "loading",
      },
    },
    loading: {
      invoke: {
        id: "getSearchResults",
        src: () => Promise.resolve(""), // replace with real fetch
        onDone: {
          target: "success",
          actions: assign({ results: (context, event) => event.data }),
        },
        onError: {
          target: "failure",
          actions: assign({ error: (context, event) => event.data }),
        },
      },
    },
    success: {
      type: "final",
      on: {
        SEARCH: "loading",
      }
    },
    failure: {
      on: {
        RETRY: {
          target: "loading",
          actions: assign({
            retries: (context, event) => context.retries + 1,
          }),
        },
        SEARCH: "loading",
      },
    },
  },
});