Generated by XState Viz: https://xstate.js.org/viz

machine.js

const UserMachine = () => {};
Machine(
  {
    id: 'Get UserI',
    initial: 'idle',
    context: {
      user: null,
      retries: 0,
      maxRetries: 3,
    },
    states: {
      idle: {
        on: {
          FETCH: 'loading',
        },
      },
      loading: {
        invoke: {
          id: 'fetchUser',
          src: (context, event) =>
            fetch('https://reqres.in/api/users/2').then((data) => data.json()),
          onDone: {
            target: 'resolved',
            actions: assign({
              user: (_, event) => event,
            }),
          },
          onError: 'rejected',
        },
        on: {
          CANCEL: 'idle',
        },
      },
      resolved: {
        type: 'final',
      },
      rejected: {
        RETRY: {
          target: 'loading',
          actions: assign({
            retries: (context, event) => context.retries + 1,
          }),
          cond: 'canRetry',
        },
      },
    },
  },
  {
    guards: { 
      canRetry: (context) => context.retries >= maxRetries
    }
  },
);