Bizconcept

Common pattern to handle justbe bizconcept. To get basic concept lets consider bizconcept as list/collection/array. for example consider myMatches bizconcept which returns the list of matches so how the response is handle and what processes happens under the hood are as follows,

step 1 : app requests for a bizconcept. 
step 2 : library calls server and one parallel process look in to pouch database if some older records are present.
step 3 : if older matches are present then it update the store as store got updated and app listen to store application view gets updated automatically.
step 4 : As asynchronus response of bizconcept comes from server it also got updated in to store and application view gets updated automatically.

so one name to these steps can be given => bizconcept synchronisation

Installation

Use the node package manager npm to install @justbe-angular/jb-bizconcept.

npm install @justbe-angular/jb-bizconcept --save

Usage

import JBBizconceptModule into your root module/app.module

import { NgModule } from '@angular/core';
import { JBBizconceptModule } from '@justbe-angular/jb-bizconcept';
@NgModule({
    declarations: [
        ..
    ],
    imports: [
        ..,
        JBBizconceptModule,
        ..,
    ]
})
export class AppModule { }

configure bizconcept service at root of your application.

import { Component } from '@angular/core';
import { BizconceptService } from '@justbe-angular/jb-bizconcept';
@Component({
    templateUrl: 'root.component.html'
})
export class RootComponent {
    ..
    constructor(
        ..,
        private bizconceptService: BizconceptService,
        ..
    ){}
    this.bizconceptService.setConfig({
        apiEndpt: 'http://your-domain.com', //api end points to make calls
        apiType: 'mapi' //api access type //api//mapi//for secure and public access
    })
}

synchronise 'allLiveMatches' bizconcept;

import { BizconceptService } from '@justbe-angular/jb-bizconcept';
import { StoreService } from '@justbe-angular/jb-store';
export class MatchesTabComponent{
    constructor(
        ..,
        private bizconceptService: BizconceptService,
        private storeService: StoreService
        ..,
    ){}
    subscriptions = [];
    ngOnInit(){
        this.bizconceptService.sync({ pattern: 'allLiveMatches' });
        let subOne = this.storeService.getListener('allLiveMatches').subscribe(allLiveMatches => {
            console.log(allLiveMatches)
            //here are the list of matches
            //caution as we are using subscription we need to unsubscribe it when we dont need it to //-avoi memory leaks & and data leaks
        })
    }
    ngOnDestroy(){
        this.subscriptions.forEach(sub=>{
            sub.unsubscribe();
        })
    }
}

Use SuperSubscriptionsClass class to avoid boilerplate code as below;

Installation

Use the node package manager npm to install @justbe-super-classes/subscriptions.

npm install @justbe-super-classes/subscriptions --save

import { BizconceptService } from '@justbe-angular/jb-bizconcept';
import { StoreService } from '@justbe-angular/jb-store';
import { SuperSubscriptionsClass } from '@justbe-super-classes/subscriptions';
export class MatchesTabComponent extends SuperSubscriptionsClass{
    constructor(
        ..,
        private bizconceptService: BizconceptService,
        private storeService: StoreService
        ..,
    ){}
    ngOnInit(){
        this.bizconceptService.sync({ pattern: 'allLiveMatches' });
        let subOne = this.storeService.getListener('allLiveMatches').subscribe(allLiveMatches => {
            console.log(allLiveMatches)
            //here are the list of matches
            //caution as we are using subscription we need to unsubscribe it when we dont need it to //-avoi memory leaks & and data leaks
        })
    }
}

by using super class we dont need to delare subscriptions array and dont need to mannually //unsubscribe to the subscriptions under the hood there is one base method ionViewDidLeave(){} which is lifecycle event hook for ionic which gets triggered as ionic view get left from viewcontroller subscriptions gets unsubscribed

pattern can get more complecated as we need to synchronise child bizconcept ex 'liveAndUpcomingMatchesForTP/tp-12342gs5' as below,

..
this.bizconceptService.sync({ pattern: 'completedMatchesForTP/' + this.team.id });
let subOne = this.storeService.getListener('completedMatchesForTP-' + this.team.id).subscribe(completedMatchesForTP => {
    console.log(completedMatchesForTP);
})
..

Bizconcept with infinite scroll

..
let configs = this.bizconceptService.sync({ pattern: 'completedMatchesForTP/' + this.team.id });
..

the bizconcept also return a configs object which has complete information of store and pouch where data is going to resides, this object is input to the pagination method and that method evaluate where next set of response is going to resides suppose paginate method gets called when ever view reaches to the bottom,

paginate(event){
    this.bizconceptService.paginate(configs).subscribe(res => {
        if (res === 404) {
            console.log('no more data to load')
        }
        event.complete();
    })
}

License

MIT