mirror of https://github.com/BTCPrivate/copay.git
add infinite scroll
This commit is contained in:
parent
e3afba64e6
commit
e28124652b
|
@ -11,7 +11,7 @@
|
|||
</div>
|
||||
|
||||
<ion-list>
|
||||
<button ion-item *ngFor="let tx of wallet.completeHistory" (click)="goToTxDetails(tx)">
|
||||
<button ion-item *ngFor="let tx of history" (click)="goToTxDetails(tx)">
|
||||
<ion-icon item-start>
|
||||
<img src="assets/img/tx-action/icon-received.svg" *ngIf="tx.action == 'received'" width="40">
|
||||
<img src="assets/img/tx-action/icon-sent.svg" *ngIf="tx.action == 'sent'" width="40">
|
||||
|
@ -24,4 +24,8 @@
|
|||
</div>
|
||||
</button>
|
||||
</ion-list>
|
||||
|
||||
<ion-infinite-scroll (ionInfinite)="loadHistory($event)">
|
||||
<ion-infinite-scroll-content></ion-infinite-scroll-content>
|
||||
</ion-infinite-scroll>
|
||||
</ion-content>
|
|
@ -9,7 +9,11 @@ import { TxDetailsPage } from '../../pages/tx-details/tx-details';
|
|||
templateUrl: 'wallet-details.html'
|
||||
})
|
||||
export class WalletDetailsPage {
|
||||
private HISTORY_SHOW_LIMIT: number;
|
||||
private HISTORY_PAGE_COUNTER: number;
|
||||
|
||||
public wallet: any;
|
||||
public history: any;
|
||||
|
||||
constructor(
|
||||
private navCtrl: NavController,
|
||||
|
@ -18,6 +22,9 @@ export class WalletDetailsPage {
|
|||
private walletProvider: WalletProvider,
|
||||
) {
|
||||
this.wallet = this.profileProvider.getWallet(this.navParams.data.walletId);
|
||||
this.history = [];
|
||||
this.HISTORY_SHOW_LIMIT = 10;
|
||||
this.HISTORY_PAGE_COUNTER = 2;
|
||||
}
|
||||
|
||||
ionViewDidEnter() {
|
||||
|
@ -29,16 +36,34 @@ export class WalletDetailsPage {
|
|||
}
|
||||
|
||||
getTxHistory(force?: boolean) {
|
||||
if (force) this.wallet.completeHistory = [];
|
||||
if (force) {
|
||||
this.history = [];
|
||||
this.HISTORY_PAGE_COUNTER = 2;
|
||||
}
|
||||
|
||||
this.walletProvider.getTxHistory(this.wallet, {force: force}).then((txh) => {
|
||||
this.walletProvider.getTxHistory(this.wallet, { force: force }).then((txh) => {
|
||||
this.wallet.completeHistory = txh;
|
||||
this.wallet.completeHistory.isValid = true;
|
||||
this.history = this.wallet.completeHistory.slice(0, this.HISTORY_SHOW_LIMIT);
|
||||
}).catch((err) => {
|
||||
console.log(err);
|
||||
});
|
||||
}
|
||||
|
||||
loadHistory(loading) {
|
||||
if (this.history.length === this.wallet.completeHistory.length) {
|
||||
loading.complete();
|
||||
return;
|
||||
}
|
||||
let self = this;
|
||||
setTimeout(function() {
|
||||
self.history = self.wallet.completeHistory.slice(0, self.HISTORY_PAGE_COUNTER * self.HISTORY_SHOW_LIMIT);
|
||||
self.HISTORY_PAGE_COUNTER++;
|
||||
loading.complete();
|
||||
}, 300);
|
||||
}
|
||||
|
||||
goToTxDetails(tx: any) {
|
||||
this.navCtrl.push(TxDetailsPage, {walletId: this.wallet.credentials.walletId, txid: tx.txid});
|
||||
this.navCtrl.push(TxDetailsPage, { walletId: this.wallet.credentials.walletId, txid: tx.txid });
|
||||
}
|
||||
}
|
|
@ -368,18 +368,22 @@ export class WalletProvider {
|
|||
|
||||
public getTxHistory(wallet: any, opts: any) {
|
||||
return new Promise((resolve, reject) => {
|
||||
opts = opts ? opts : {};
|
||||
opts = opts || {};
|
||||
|
||||
// TODO isHistoryCached should get the properties from status or profile service
|
||||
|
||||
this.logger.debug('Updating Transaction History');
|
||||
|
||||
this.getTxsFromLocal(wallet.credentials.walletId).then((txsFromLocal) => {
|
||||
if (!lodash.isEmpty(txsFromLocal) && !opts.force) return resolve(txsFromLocal);
|
||||
if (!lodash.isEmpty(txsFromLocal) && !opts.force) {
|
||||
return resolve(txsFromLocal.slice(0, opts.limit));
|
||||
}
|
||||
|
||||
this.getTxsFromServer(wallet, 0, null, 10).then((txsFromServer) => {
|
||||
this.getTxsFromServer(wallet, opts).then((txsFromServer) => {
|
||||
|
||||
this.updateTxHistory(wallet, txsFromLocal, txsFromServer);
|
||||
this.updateTxHistory(wallet, txsFromLocal, txsFromServer).then((newHistory: any) => {
|
||||
return resolve(newHistory);
|
||||
});
|
||||
}).catch((err) => {
|
||||
this.logger.debug('Error getting txs from server');
|
||||
return reject(err);
|
||||
|
@ -392,18 +396,21 @@ export class WalletProvider {
|
|||
}
|
||||
|
||||
private updateTxHistory(wallet: any, txsFromLocal: any, txsFromServer?: any) {
|
||||
let array = txsFromLocal.concat(txsFromServer.res);
|
||||
let newHistory = lodash.uniqBy(array, (x: any) => {
|
||||
return x.txid;
|
||||
});
|
||||
wallet.completeHistory = newHistory;
|
||||
wallet.completeHistory.isValid = true;
|
||||
let historyToSave = lodash.compact(lodash.flatten(newHistory));
|
||||
return new Promise((resolve, reject) => {
|
||||
var txsFromServer_ = txsFromServer && txsFromServer.res || [];
|
||||
let array = txsFromLocal.concat(txsFromServer_);
|
||||
let newHistory = lodash.uniqBy(array, (x: any) => {
|
||||
return x.txid;
|
||||
});
|
||||
resolve(newHistory);
|
||||
|
||||
this.persistenceProvider.setTxHistory(wallet.credentials.walletId, JSON.stringify(historyToSave)).then(() => {
|
||||
this.logger.debug('Tx History saved for: ' + wallet.credentials.walletId);
|
||||
}).catch((err) => {
|
||||
this.logger.warn('Error saving history for: ' + wallet.credentials.walletId);
|
||||
let historyToSave = lodash.compact(lodash.flatten(newHistory));
|
||||
|
||||
this.persistenceProvider.setTxHistory(wallet.credentials.walletId, JSON.stringify(historyToSave)).then(() => {
|
||||
this.logger.debug('Tx History saved for: ' + wallet.credentials.walletId);
|
||||
}).catch((err) => {
|
||||
this.logger.warn('Error saving history for: ' + wallet.credentials.walletId);
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
|
@ -429,13 +436,14 @@ export class WalletProvider {
|
|||
});
|
||||
}
|
||||
|
||||
private getTxsFromServer(wallet: any, skip: number, endingTxid: string, limit: number): Promise<any> {
|
||||
private getTxsFromServer(wallet: any, opts: any): Promise<any> {
|
||||
return new Promise((resolve, reject) => {
|
||||
opts = opts || {};
|
||||
let res = [];
|
||||
|
||||
wallet.getTxHistory({
|
||||
skip: skip,
|
||||
limit: limit
|
||||
skip: opts.skip,
|
||||
limit: opts.limit
|
||||
}, (err: Error, txsFromServer: Array<any>) => {
|
||||
if (err) return reject(err);
|
||||
|
||||
|
@ -443,12 +451,12 @@ export class WalletProvider {
|
|||
return resolve();
|
||||
|
||||
res = lodash.takeWhile(txsFromServer, (tx) => {
|
||||
return tx.txid != endingTxid;
|
||||
return tx.txid != opts.endingTxid;
|
||||
});
|
||||
|
||||
let result = {
|
||||
res: res,
|
||||
shouldContinue: res.length >= limit
|
||||
shouldContinue: res.length >= opts.limit
|
||||
};
|
||||
|
||||
return resolve(result);
|
||||
|
|
Loading…
Reference in New Issue