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: "authenticated",
    type: "parallel",
    states: {
      claims: {
        initial: "fetching",
        states: {
          fetching: {
            invoke: {
              src: "fetchClaims",
              onDone: {
                actions: assign({
                  claims: (context, event) => event.data,
                }),
                target: "loaded",
              },
              onError: {
                actions: assign({
                  error: (context, event) => event.data,
                }),
                target: "failed",
              },
            },
          },
          loaded: {
            entry: send("LOADED"),
            on: {
              REFRESH_CLAIMS: "fetching",
            },
          },
          failed: {
            entry: ["clearClaims", "sendFailed"],
            on: {
              RETRY: "fetching",
            },
          },
        },
      },
      token: {
        initial: "fetching",
        states: {
          fetching: {
            invoke: {
              src: "fetchToken",
              onDone: {
                actions: assign({
                  token: (context, event) => event.data,
                }),
                target: "loaded",
              },
              onError: {
                actions: assign({
                  error: (context, event) => event.data,
                }),
                target: "failed",
              },
            },
          },
          loaded: {
            entry: send("LOADED"),
            on: {
              REFRESH_TOKEN: "fetching",
            },
          },
          failed: {
            entry: ["clearToken", "sendFailed"],
            on: {
              RETRY: "fetching",
            },
          },
        },
      },
      status: {
        initial: "initializing",
        states: {
          initializing: {
            on: {
              LOADED: {
                target: "initialized",
                cond: "notNullTokenAndClaims",
              },
              FAILED: "broken",
            },
          },
          initialized: {
            on: {
              FAILED: "broken",
            },
          },
          broken: {
            on: {
              RETRY: "initializing",
            },
          },
        },
      },
    },
  },
  {
    services: {
      fetchClaims: (context, event) =>
        new Promise((resolve, reject) => {
          return setTimeout(() => resolve({ admin: false }), 3000);
        }),
      fetchToken: (context, event) =>
        new Promise((resolve, reject) => {
          return setTimeout(() => resolve("token"), 5000);
        }),
    },
    actions: {
      sendFailed: send("FAILED"),
      clearClaims: assign({ claims: (context, event) => undefined }),
      clearToken: assign({ token: (context, event) => undefined }),
    },
  }
);