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

machine.js

const allData = new Array(25).fill(0).map((_val, i) => i + 1);

const perPage = 10;

const dataMachine = new Machine({
  id: 'dataMachine',
  initial: 'loading',
  context: {
    data: [],
  },
  states: {
    loading: {
      on: {
        DONE_MORE: 'more',
        DONE_COMPLETE: 'complete',
        FAIL: 'failure',
      }
    },
    more: {
      on: {
        LOAD: 'loading',
      }
    },
    complete: {
      type: 'final',
    },
    failure: {
      type: 'final',
    },
  }
})