JSFiddle - React, Tailwind, and code Playground

by Lloyd Atkinson

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/axios/0.18.0/axios.js"></script>

Babel + JSX

console.clear();
const success = value => console.log(`Success: ${value}`);
const progress = value => console.log(`Progress: ${value}`);
const pending = value => console.log(`Pending: ${value}`);
const failure = value => console.log(`Failure: ${value}`);

/* const run = (data, success, progress, pending, failure) => {
    let pendingExecutions = [];

    const inner = new Promise((resolve, reject) => {
        for (const item of data) {
            //progress(item);

            if (item >= 15) {
                setTimeout(() => {
                    pending(item);
                    pendingExecutions.push(item);
                }, Math.floor(Math.random() * 5000));
            } else {
                setTimeout(() => {
                    success(item);
                }, Math.floor(Math.random() * 5000));
            }
        }
        
        //resolve('done');
    });
    
    return inner;
}; */

const get = async () => await axios.get('https://reqres.in/api/users?delay=2');

const run = async (data, success, progress, pending, failure) => {
    let pendingExecutions = [];

    for (const item of data) {
		const response = await get()
        console.log(response);
    }
};

const data = Array.from(Array(20).keys());
(async () => {
	run(data, success, progress, pending, failure);
})();