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

machine.js

const context = { useLoadingStatus: false };
const queryMachine = Machine(
  {
    id: "query",
    context,

    on: {
      UPDATE: [
        { target: "loading", cond: "isLoading" },
        { target: "notFound", cond: "isNotFound" },
        { target: "error", cond: "isError" },
        { target: "success", cond: "isSuccess" },
      ],
    },

    initial: "loading",
    states: {
      error: {},
      loading: {},
      notFound: {},
      success: {},
    },
  },
  {
    guards: {
      isError: (_, { queryInfo: { status } }) => status === "error",
      isLoading: (
        { useLoadingStatus },
        { queryInfo: { status, isFetching } },
      ) => (useLoadingStatus ? status === "loading" : isFetching),
      isNotFound: (_, { queryInfo: { error } }) =>
        error?.response?.status === 404,
      isSuccess: (_, { queryInfo: { status, data } }) =>
        status === "success" && !isEmpty(data),
    },
  },
);