JSFiddle - React, Tailwind, and code Playground

JavaScript

$.flatMap = function(promise, f) {
    var deferred = $.Deferred();

    function reject(/* arguments */) {
        // The reject() method puts a deferred into its failure
        // state.
        deferred.reject.apply(deferred, arguments);
    }

    promise.then(function(/* values... */) {
        var newPromise = f.apply(null, arguments);

        newPromise.then(function(/* newValues... */) {
            deferred.resolve.apply(deferred, arguments);
        }, reject);

    }, reject);

    return deferred.promise();
};



function uploadToTarget(target, file) {
  console.log('uploadToTarget >', target);
  var deferred = $.Deferred();
  setTimeout(function() {
  	console.log("upload done " + target); 
    deferred.resolve(target)
  }, 5000);
  return deferred.promise();
};

function applyUpdateToTarget(target, file) {
	console.log('applyUpdateToTarget > ', target);
  var deferred = $.Deferred();
  if (target === 2) deferred.reject("I don't like this one " + target);
  setTimeout(function() {
  	console.log("apply done " + target); 
    deferred.resolve(target)
  }, 5000);
  return deferred.promise();
  
}

// http://sitr.us/2012/07/31/promise-pipelines-in-javascript.html
function uploadAndApply(target, file) {
	return uploadToTarget(target, file).then(function(response) {
    return applyUpdateToTarget(target, file);
  });  
}
console.clear();

var cancel = false;
var targets = [1, 2, 3, 4, 5]
var res = targets.reduce(function(prev, cur) {
	return prev.then(
     function (result) {
        console.log('resolved, going for next', result);
        return uploadAndApply(cur, 'foo');
     },
     function (err) {
     	  console.log('rejected, ', err);
        return uploadAndApply(cur, 'foo')
     });
}, $.Deferred().resolve());



/*
uploadAndApply('10.10.1.33', 'foo').then(function(result) { 
    console.log('then', arguments);
	  uploadAndApply('10.10.1.70', 'foo');
});
console.log(d);
*/