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

machine.js

  
  let _activeIndexingId = "";
  let _activeQueryId = "";
  const indexingMachine = Machine({
    id: 'indexer',
    initial: "QUERYING",
    states: {
      IDLE: {
        on: {
          INVALIDATE: 'STALE',
          UPDATE_FILTERS: 'QUERYING'
        }
      },
      STALE: {
        on: {
          START: 'INDEXING'
        },
        after: {
          750: 'INDEXING'
        },
      },
      INDEXING: {
        on: {
          INVALIDATE: 'STALE',
        },
        invoke: {
          id: "reindex",
          src: () => reIndex(_activeIndexingId = Date.now()),
          onDone: {
            target: 'QUERYING'
          },
          onError: {
            target: 'FAILED'
          }
        }
      },
      QUERYING: {
        on: {
          INVALIDATE: "STALE",
          UPDATE_FILTERS: "QUERYING",
        },
        invoke: {
          id: "query",
          src: () => query(_activeQueryId = Date.now()),
          onDone: {
            target: "IDLE"
          },
          onError: {
            target: "FAILED"
          }
          
        }
      },

      FAILED: {
        on: {
          INVALIDATE: 'STALE',
          RETRY: 'INDEXING'
        }
      }
    }
  });
  
  const query = (queryId) => {
    console.log("STARTING QUERY", queryId, _activeQueryId);
    return new Promise((resolve) => {
      setTimeout(() => {
        if (queryId !== _activeQueryId) {
          console.log("CANCELED QUERY")
          
        } else {
          console.log("SAVING QUERY RESULT", queryId, _activeQueryId, Date.now())
        }
        resolve();
      }, 4000)
    })
  }
  
  const reIndex = (indexingId) => {
    console.log("STARTING INDEX", indexingId, _activeIndexingId);
    return new Promise((resolve) => {
      setTimeout(() => {
         console.log("COMPLETED INDEX", indexingId, _activeIndexingId);   
        if (indexingId !== _activeIndexingId) {
          console.log("CANCELING TRANSACTION");
        } else {
          console.log("SAVING TRANSACTION");
        }
        resolve();
      }, 700);
    })
  };