JSFiddle - React, Tailwind, and code Playground

by dunerunner

JavaScript 1.7

const sleep = (ms) => {
	  return new Promise(res => setTimeout(res, ms));
	}

	const handleState = async (stateObj) => {
	  switch (stateObj.state) {
	    case 'processing':
	      await sleep(2000);
	      break;
	    case 'success':
	      return new Promise(res => res({
	        title: 'Order complete',
	        message: null
	      }));
	      break;
	    case 'error':
	      return new Promise(res => res(handleErrorState(stateObj)));
	      break;
	  }
	}

	const handleErrorState = (stateObj) => {
	  const result = {
	    title: 'Error page',
	    message: null
	  }

	  switch (stateObj.errorCode) {
	    case 'NO_STOCK':
	      result.message = 'No stock has been found';
	      break;
	    case 'INCORRECT_DETAILS':
	      result.message = 'Incorrect details have been entered';
	      break;
	    default:
	      result.message = null;
	  }
	  return result;
	};

	/** 
	 * Gets the processing page 
	 * @param {array} data  
	 */
	const getProcessingPage = (data) => {
	  let index = 0;

	  const resultPromise = new Promise(resolvePage => {

	    let processedStatesPromise = data.reduce(async (previousPromise, nextState) => {
	      await previousPromise;
	      return handleState(nextState);
	    }, Promise.resolve());

	    processedStatesPromise.then(result => resolvePage(result));
	  });

	  return resultPromise;
	};


	// USAGE EXAMPLES
	const stateSet1 = [{
	    state: 'processing'
	  },
    {
	    state: 'processing'
	  },
	  {
	    state: 'error',
	    errorCode: 'NO_STOCK'
	  }
	];

	const stateSet2 = [{
	    state: 'processing'
	  },
	  {
	    state: 'success'
	  }
	];

	getProcessingPage(stateSet1).then(result => console.log(result));
	getProcessingPage(stateSet2).then(result => console.log(result));