Search code examples
angulartypescriptapiservice

Encompass API Pipeline Looping through API pagination using typescript service


I am trying to loop through an api with start and limit. Limit is always 1000 but start starts at 0. I want to return all records/data. This is where I am at as of now:

const pipeline = this.http.post(`${baseURL}/loanPipeline?start=0&limit=1000`, body, { headers: reqHeader });
const pipeline1 = this.http.post(`${baseURL}/loanPipeline?start=1000&limit=1000`, body, { headers: reqHeader });
const pipeline2 = this.http.post(`${baseURL}/loanPipeline?start=2000&limit=1000`, body, { headers: reqHeader });
const pipeline3 = this.http.post(`${baseURL}/loanPipeline?start=3000&limit=1000`, body, { headers: reqHeader });
const pipeline4 = this.http.post(`${baseURL}/loanPipeline?start=4000&limit=1000`, body, { headers: reqHeader });
const pipeline5 = this.http.post(`${baseURL}/loanPipeline?start=5000&limit=1000`, body, { headers: reqHeader });
const pipeline6 = this.http.post(`${baseURL}/loanPipeline?start=6000&limit=1000`, body, { headers: reqHeader });
const pipeline7 = this.http.post(`${baseURL}/loanPipeline?start=7000&limit=1000`, body, { headers: reqHeader });
const pipeline8 = this.http.post(`${baseURL}/loanPipeline?start=8000&limit=1000`, body, { headers: reqHeader });
const pipeline9 = this.http.post(`${baseURL}/loanPipeline?start=9000&limit=1000`, body, { headers: reqHeader });
const pipeline10 = this.http.post(`${baseURL}/loanPipeline?start=10000&limit=1000`, body, { headers: reqHeader });
const pipeline11 = this.http.post(`${baseURL}/loanPipeline?start=11000&limit=1000`, body, { headers: reqHeader });
const pipeline12 = this.http.post(`${baseURL}/loanPipeline?start=12000&limit=1000`, body, { headers: reqHeader });
const pipeline13 = this.http.post(`${baseURL}/loanPipeline?start=13000&limit=1000`, body, { headers: reqHeader });
const pipeline14 = this.http.post(`${baseURL}/loanPipeline?start=14000&limit=1000`, body, { headers: reqHeader });
const pipeline15 = this.http.post(`${baseURL}/loanPipeline?start=15000&limit=1000`, body, { headers: reqHeader });
const pipeline16 = this.http.post(`${baseURL}/loanPipeline?start=16000&limit=1000`, body, { headers: reqHeader });
const pipeline17 = this.http.post(`${baseURL}/loanPipeline?start=17000&limit=1000`, body, { headers: reqHeader });
const pipeline18 = this.http.post(`${baseURL}/loanPipeline?start=18000&limit=1000`, body, { headers: reqHeader });
const pipeline19 = this.http.post(`${baseURL}/loanPipeline?start=19000&limit=1000`, body, { headers: reqHeader });
const pipeline20 = this.http.post(`${baseURL}/loanPipeline?start=20000&limit=1000`, body, { headers: reqHeader });
const pipeline21 = this.http.post(`${baseURL}/loanPipeline?start=21000&limit=1000`, body, { headers: reqHeader });
const pipeline22 = this.http.post(`${baseURL}/loanPipeline?start=22000&limit=1000`, body, { headers: reqHeader });
const pipeline23 = this.http.post(`${baseURL}/loanPipeline?start=23000&limit=1000`, body, { headers: reqHeader });
const pipeline24 = this.http.post(`${baseURL}/loanPipeline?start=24000&limit=1000`, body, { headers: reqHeader });
const pipeline25 = this.http.post(`${baseURL}/loanPipeline?start=25000&limit=1000`, body, { headers: reqHeader });
const pipeline26 = this.http.post(`${baseURL}/loanPipeline?start=26000&limit=1000`, body, { headers: reqHeader });
const pipeline27 = this.http.post(`${baseURL}/loanPipeline?start=27000&limit=1000`, body, { headers: reqHeader });
const pipeline28 = this.http.post(`${baseURL}/loanPipeline?start=28000&limit=1000`, body, { headers: reqHeader });
const pipeline29 = this.http.post(`${baseURL}/loanPipeline?start=29000&limit=1000`, body, { headers: reqHeader });

return forkJoin([pipeline, pipeline1, pipeline2, pipeline3, pipeline4, pipeline5, pipeline6, pipeline7, pipeline8,
  pipeline9, pipeline10, pipeline11, pipeline12, pipeline13, pipeline14, pipeline15, pipeline16, pipeline17, pipeline18,
  pipeline19, pipeline20, pipeline21, pipeline22, pipeline23, pipeline24, pipeline25, pipeline26, pipeline27, pipeline28,
  pipeline29])
  .pipe(
    map(data => {
      return [].concat(...data);
    }),
    catchError((err) => {
      if (err.status == 401) {
        alert(`Please refresh page. ${err.error}`);
        return throwError(err.error);
      }
    })
  );

What I really want to do is iterate the start to go every 1000 records like this where you see map.:

const limit = 1000;
const start = 0;
let foundLoan = null;
  return this.http.post(`${baseURL}/loanPipeline?start=${start}&limit=${limit}`, body, { headers: reqHeader })
    .pipe(
      map((data: any) => {
        console.log(data);
        return data;
      }),
      catchError((err) => {
        if (err.status == 401) {
          alert(`Please refresh page. ${err.error}`);
          return throwError(err.error);
        }
      }));

Is there any solution to this? I just can't seem to find anything out there that can give me some feedback. Thanks in advance.


Solution

  • I was able to fix this issue by creating a function outside of the service and in the component subscribe that will loop through the array of objects. Something like this:

    getLoanNumbers(start = 0, limit = 1000) {
      this.encompass.getLoanNumbers(this.currentLimit * 1000)
        .subscribe(loanNumbers => {
          this.elliLoanNumbers.push(...loanNumbers);
    
          this.currentLimit++;
    
          this.loan = loanNumbers.find(loan => loan.fields['Loan.LoanNumber'] === this.data.loanNumber);
    
          if (this.currentLimit < limit) {
            if (this.loan) {
              this.getLoanDetails(this.loan.loanId);
              this.guidLoading = false;
            } else {
              this.getLoanNumbers(this.currentLimit);
            }
    
          } else {
            //console.log(`Reached the end of the limit. We're done here.`);
          }
        })
    

    }

    And then Service:

    getLoanNumbers(start: number): Observable<any[]> {
    const body = {
      "fields": [
        "Loan.LoanNumber"
      ],
      "sortOrder": [
        {
          "canonicalName": "Loan.LoanNumber",
          "order": "Descending"
        }
      ],
      "filter": {
        "canonicalName": "Loan.LoanFolder",
        "value": "(Trash)",
        "matchType": "exact",
        "precision": "Day",
        "include": false
      }
    };
    
    const reqHeader = new HttpHeaders().set('Content-Type', 'application/json').set('Accept', 'application/json');
    
    const limit = 1000;
    //console.log('Hitting up an API');
    
    return this.http.post<any[]>(`${baseURL}/loanPipeline?start=${start}&limit=${limit}`, body, { headers: reqHeader })
      .pipe(
        map(data => {
          //console.log(data);
          return data.filter((loanNumber: any) => loanNumber.fields['Loan.LoanNumber'] !== null || loanNumber.fields['Loan.LoanNumber'] !== '');
        }),
        catchError((err) => {
          if (err.status == 401) {
            alert(`Please refresh page.`);
            return throwError(err.error);
          }
        })
      );
    

    }

    If anyone is looking for an answer on this for Encompass this will be a great way to loop through many records within this api structure.