Merge pull request #3611 from mempool/nymkappa/fix-transaction-list-infinite-scroll
Fix infinite scroll transaction list component
This commit is contained in:
		
						commit
						427cef9f9d
					
				@ -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">
 | 
					<ng-container *ngFor="let tx of transactions; let i = index; trackBy: trackByFn">
 | 
				
			||||||
  <div *ngIf="!transactionPage" class="header-bg box tx-page-container">
 | 
					  <div *ngIf="!transactionPage" class="header-bg box tx-page-container">
 | 
				
			||||||
    <a class="tx-link" [routerLink]="['/tx/' | relativeUrl, tx.txid]">
 | 
					    <a class="tx-link" [routerLink]="['/tx/' | relativeUrl, tx.txid]">
 | 
				
			||||||
@ -11,7 +13,7 @@
 | 
				
			|||||||
    </div>
 | 
					    </div>
 | 
				
			||||||
  </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 *ngIf="errorUnblinded" class="error-unblinded">{{ errorUnblinded }}</div>
 | 
				
			||||||
    <div class="row">
 | 
					    <div class="row">
 | 
				
			||||||
@ -321,6 +323,8 @@
 | 
				
			|||||||
 | 
					
 | 
				
			||||||
</ng-container>
 | 
					</ng-container>
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					</div>
 | 
				
			||||||
 | 
					
 | 
				
			||||||
<ng-template #assetBox let-item>
 | 
					<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] }}
 | 
					  {{ item.value / pow(10, assetsMinimal[item.asset][3]) | number: '1.' + assetsMinimal[item.asset][3] + '-' + assetsMinimal[item.asset][3] }} {{ assetsMinimal[item.asset][1] }}
 | 
				
			||||||
  <br />
 | 
					  <br />
 | 
				
			||||||
 | 
				
			|||||||
@ -182,14 +182,7 @@ export class TransactionsListComponent implements OnInit, OnChanges {
 | 
				
			|||||||
  }
 | 
					  }
 | 
				
			||||||
 | 
					
 | 
				
			||||||
  onScroll(): void {
 | 
					  onScroll(): void {
 | 
				
			||||||
    const scrollHeight = document.body.scrollHeight;
 | 
					    this.loadMore.emit();
 | 
				
			||||||
    const scrollTop = document.documentElement.scrollTop;
 | 
					 | 
				
			||||||
    if (scrollHeight > 0) {
 | 
					 | 
				
			||||||
      const percentageScrolled = scrollTop * 100 / scrollHeight;
 | 
					 | 
				
			||||||
      if (percentageScrolled > 50) {
 | 
					 | 
				
			||||||
        this.loadMore.emit();
 | 
					 | 
				
			||||||
      }
 | 
					 | 
				
			||||||
    }
 | 
					 | 
				
			||||||
  }
 | 
					  }
 | 
				
			||||||
 | 
					
 | 
				
			||||||
  haveBlindedOutputValues(tx: Transaction): boolean {
 | 
					  haveBlindedOutputValues(tx: Transaction): boolean {
 | 
				
			||||||
 | 
				
			|||||||
		Loading…
	
	
			
			x
			
			
		
	
		Reference in New Issue
	
	Block a user