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

machine.js

// https://xstate.js.org/viz/?gist=5fe14e8b6f72489354c0dee1834cf5ce
// Available variables:
// - Machine
// - interpret
// - assign
// - send
// - sendParent
// - spawn
// - raise
// - actions
// - XState (all XState exports)
const scheduleRequest = request => ctx => {
  return [...ctx.networkQueue, Promise.resolve(request)]
}

const pullStep = (entity, nextEntity, parallel) => {
  return {
    on: {
      PULL_NEXT: nextEntity
    },
    initial: 'pulling',
    states: {
      pulling: {
        entry: [
          assign({
            networkQueue: scheduleRequest(entity)
          }),
          parallel ? send('PULL_NEXT') : send('FETCH_ENTITIES')
        ]
      }
    }
  }
}

const networkStates = {
  initial: 'ready',
  states: {
    ready: {
      on: {
        FETCH_ENTITIES: 'fetching'
      }
    },
    fetching: {
      invoke: {
        src: 'pullRemoteData',
        onDone: {
          target: 'ready',
          actions: [
            assign({
              networkQueue: ctx => [],
              pullResults: (ctx, event) => {
                return [...ctx.pullResults, event.data]
              }
            }),
            send('PULL_NEXT')
          ]
        },
        onError: {
          target: 'ready',
          actions: [sendParent('SYNC_FAILURE')]
        }
      }
    }
  }
}

const pullingOrderStates = {
  initial: 'settings',
  states: {
    settings: pullStep('settings', 'capabilities', true),
    capabilities: pullStep('capabilities', 'listGroups'),
    listGroups: pullStep('listGroups', 'lists'),
    lists: pullStep('lists', 'tasks'),
    tasks: pullStep('tasks', 'members', true),
    members: pullStep('members', 'taskSuggestions'),
    taskSuggestions: pullStep('taskSuggestions', 'finished'),
    finished: {
      entry: [send('DONE')],
      type: 'final',
    }
  }
}

const pullingQueue = Machine(
  {
    id: 'pullingQueue',
    initial: 'working',
    context: {
      networkQueue: [],
      pullResults: []
    },
    states: {
      working: {
        on: {
          DONE: 'done'
        },
        type: 'parallel',
        states: {
          pullingOrder: pullingOrderStates,
          network: networkStates
        }
      },
      done: {
        type: 'final',
        data: {
          results: ctx => ctx.pullResults
        }
      }
    }
  },
  {
    services: {
      pullRemoteData: ctx => {
        const tasks = ctx.networkQueue
        return Promise.all(tasks)
      }
    }
  }
)