mirrors/mempool
1
0
Fork 0
mirror of https://github.com/mempool/mempool.git synced 2025-03-03 17:47:01 +01:00
Code Issues Projects Releases Wiki Activity

Merge pull request #3611 from mempool/nymkappa/fix-transaction-list-infinite-scroll

Browse source 
Fix infinite scroll transaction list component
This commit is contained in:
softsimon 2023-03-31 19:23:36 +09:00 • committed by GitHub
commit 427cef9f9d
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 6 additions and 9 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
frontend/src/app/components/transactions-list/transactions-list.component.html
View file

@ -1,3 +1,5 @@
<div infiniteScroll [alwaysCallback]="true" [infiniteScrollDistance]="2" [infiniteScrollUpDistance]="1.5" [infiniteScrollThrottle]="50" (scrolled)="onScroll()">
<ng-container *ngFor="let tx of transactions; let i = index; trackBy: trackByFn">
<div *ngIf="!transactionPage" class="header-bg box tx-page-container">
<a class="tx-link" [routerLink]="['/tx/' | relativeUrl, tx.txid]">
@ -11,7 +13,7 @@
</div>
</div>
<div class="header-bg box" infiniteScroll [alwaysCallback]="true" [infiniteScrollDistance]="2" [infiniteScrollUpDistance]="1.5" [infiniteScrollThrottle]="50" (scrolled)="onScroll()" [attr.data-cy]="'tx-' + i">
<div class="header-bg box">
<div *ngIf="errorUnblinded" class="error-unblinded">{{ errorUnblinded }}</div>
<div class="row">
@ -321,6 +323,8 @@
</ng-container>
</div>
<ng-template #assetBox let-item>
{{ item.value / pow(10, assetsMinimal[item.asset][3]) | number: '1.' + assetsMinimal[item.asset][3] + '-' + assetsMinimal[item.asset][3] }} {{ assetsMinimal[item.asset][1] }}
<br />

7
frontend/src/app/components/transactions-list/transactions-list.component.ts
View file

@ -182,15 +182,8 @@ export class TransactionsListComponent implements OnInit, OnChanges {
}
onScroll(): void {
const scrollHeight = document.body.scrollHeight;
const scrollTop = document.documentElement.scrollTop;
if (scrollHeight > 0) {
const percentageScrolled = scrollTop * 100 / scrollHeight;
if (percentageScrolled > 50) {
this.loadMore.emit();
}
}
}
haveBlindedOutputValues(tx: Transaction): boolean {
return tx.vout.some((v: any) => v.value === undefined);