JSFiddle - React, Tailwind, and code Playground

by kpulkit29

JavaScript

function removeDuplicate(listContainingDuplicate) {
  seenChars = []
  for(let i = 0; i< listContainingDuplicate.length; i++) {
    if(!seenChars.includes(listContainingDuplicate[i])) {
      seenChars.push(listContainingDuplicate[i])
    }
  }
  
  return seenChars;
}

async function runAsyncGraph(graph, callback) {
  let executionOrder = [];
  
// construct "execution order"
// this block of code will produce a,b,d,c,d,e
// we know that if the letter near the end is a duplicate, then that is the duplicate that needs to be removed, since `d` needs to be ran before e anyways.
// I think we can rely on Object.keys keeping its order when looping through the keys (so it will never be out of order given the asyncGraph from your example)
// ^ if you think that's a bad assumption, you can adjust the code below to grab the keys and sort it alphabetically ascending. 
  Object.keys(graph).map(node => {
    const task = graph[node]
// necessary to check if dependency property exists, because a,b,c didn't have dependency arrays. 
    if (task.hasOwnProperty('dependency') && task.dependency.length > 0) {
      const {dependency} = task;
      dependency.forEach(deps => {
        executionOrder.push(deps)
      })
      executionOrder.push(node)
    }
  })
  console.log(executionOrder)
  executionOrder = removeDuplicate(executionOrder)
   
  let execution = 0;
   
  while(execution < executionOrder.length) {
      // pass the `resolve` function so that when the function is done executing, the code will signal to our current funtion that 
      // the in function A / B / C / D / E is done executing, letting us know we can move on to the next code. 
      await new Promise((resolve, reject) => {
        graph[`${executionOrder[execution]}`].task(resolve)
      }).then(() => {
        execution++;
      })
  }
}

function taskA(done) {
  console.log("Task A Completed");
  done();
}
function taskB(done) {
  setTimeout(function () {
    console.log("Task B Completed");
   ...