conditional observables nesting

[Kiflemariam Andom]

Hi,

I am getting 'undefined' in one of my nested calls. It is sort of ugly to follow thru so bear with me. The application needs to do:

1. valid the google email is valid in the backend (it is custom domain). If valid, it sets a session that my client/front end don't have access to.

2. if email is validated and session established, i get an api key. It passes the session set by step 1

3. if condition allows it, call 2 separate APIS that depend on the above api key

4. always call the api to destroy/delete the session created by step 1.

Now the main problem is action is 'undefined' as you will see below. If I nest

let vm: any = this;

 vm.apiService
 .authenticateGoogleToken('googleIdTokenGoesHere')
 .toPromise()
 .then(result => {
 console.log("google config result ", result);
 return result;
 })
 .then(data => {
 console.log("from google auth api ", data);
 vm.apiService
 .getNewApiKey()
 .toPromise()
 .then(apiKey => {
 if (apiKey == null) {
 alert('Sorry cant find api key for the user');

 

 return false;
 } else {
 // we got a valid api key
 
 let nextAction = 'apiKeyRetreived'; // i want nextAction to be passed to the next nest

 

 let dbFields = {
 apiKey : apiKey
 }

 if (1!=2){
 
 nextAction = 'reloadSitesSectors';
 }
 

 // update the changes now
 vm.configService.updateConfiguration(dbFields).subscribe(updatedConfig => {
 console.log("configuration after update is ", updatedConfig);

 return nextAction
 
 },
 error=> {
 alert('failed')
 return false;
 }
 );

 }
 })
 .then(action => {
 // now action is always 'undefined'

 console.log("logout of google no matter what but ordered to do ", action);
 // we will logout still no matter what but see if we need to get
 // sectors and cells for the district or leave things as they are
 if (action == 'reloadSitesSectors'){
 // we should clear
 vm.geoLocationService.clearSectors().subscribe(
 done => {

 vm.getSectors();
 vm.getSites();
 },
 error => {
 console.log("there was an error deleting current sectors");

 }
 );
 
 }

 // logout of google no matter what
 vm.apiService.googleTokenLogout().subscribe(
 logOut => {
 console.log("google logout info ", logOut);
 },
 err => {
 // likely the cookie wasn't found so server don't know what to logout exactly
 console.log("error logging out from auth ", err);
 }
 );
 });
 })
 .catch(err => {
 console.log("err ", err);
 });

[Sander Elias]

You have nsted your structure too deep, and are not returning the data you need in the next promise.

remove the nested promises, and replace them with a 'flat' variant.

look at this:

// tslint:disable: no-console

const somePromise = Promise.resolve();

const someOtherPromise = x => Promise.resolve('nested');

const badSample = somePromise

.then(result => {

someOtherPromise(result).then(endresult => {

console.log(endresult);

});

})

.then(x => console.log('result', x));

const goodSample = somePromise

.then(result => someOtherPromise(result))

.then(x => console.log('result', x));

if you unnest your promises and return them, it will work a lot easier.

Regards

Sander