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({
    strict: true,
    id: "core",
    type: "parallel",
    states : {
        individuals : {
            initial: "loadingRandom",
            states: {
                loadingRandom: {
                    invoke: {
                        id: "fetchRandom",
                        src: "fetchRandom",
                        onDone: {
                            target: "active",
                            actions: ["recordGroup"]
                        },
                        onError: {
                            target: "#core.individuals.failure",
                            actions: () => alert("There was a problem with the Pokemon API :(")
                        }
                    },
                },
                active: {
                    entry: [ "sortItems" ],
                    initial: "loadingIndividuals",
                    states: {
                        loadingIndividuals: {
                            invoke: {
                                id: "fetchIndividuals",
                                src: "fetchIndividuals",
                                onDone: {
                                    target: "idle",
                                    actions: ["recordIndividuals"]
                                },
                                onError: {
                                    target: "#core.individuals.failure",
                                    actions: ["alertProblemWithAPI"]
                                }
                            },
                        },
                        idle: {}
                    },
                    on: {
                        FAVORITE: { actions: ["favoriteOne"] },
                        UNFAVORITE: { actions: ["unfavoriteOne"] }
                    }
                },
                failure: { type: "final" }
            },
        },
        sorting: {
            initial: "byId",
            states: {
                byId: {
                    entry: [ "setSortingFunctionById", "sortItems" ],
                    on : { SORT_BY_NAME : "byName" }
                },
                byName: {
                    entry: [ "setSortingFunctionByName", "sortItems" ],
                    on : { SORT_BY_ID : "byId" }
                }
            },
        }
    }
  }
);