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

Add fee rate display component

Browse source
This commit is contained in:
Mononaut 2023-06-15 15:16:49 -04:00
parent a45f1fde1c
commit c29558db20
No known key found for this signature in database
GPG key ID: A3F058E41374C04E
6 changed files with 39 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
frontend/src/app/shared/components/fee-rate/fee-rate.component.html Normal file
View file

@ -0,0 +1,4 @@
<ng-container *ngIf="rateUnits$ | async as units">
<ng-container *ngIf="units !== 'wu'">{{ fee / (weight / 4) | feeRounding:rounding }} <span *ngIf="showUnit" [class]="unitClass">sat/vB</span></ng-container>
<ng-container *ngIf="units === 'wu'">{{ fee / weight | feeRounding:rounding }} <span *ngIf="showUnit" [class]="unitClass">sat/WU</span></ng-container>
</ng-container>

0
frontend/src/app/shared/components/fee-rate/fee-rate.component.scss Normal file
View file

26
frontend/src/app/shared/components/fee-rate/fee-rate.component.ts Normal file
View file

@ -0,0 +1,26 @@
import { Component, Input, OnInit } from '@angular/core';
import { Observable } from 'rxjs';
import { StateService } from '../../../services/state.service';
@Component({
selector: 'app-fee-rate',
templateUrl: './fee-rate.component.html',
styleUrls: ['./fee-rate.component.scss']
})
export class FeeRateComponent implements OnInit {
@Input() fee: number;
@Input() weight: number = 4;
@Input() rounding: string = null;
@Input() showUnit: boolean = true;
@Input() unitClass: string = 'symbol';
rateUnits$: Observable<string>;
constructor(
private stateService: StateService,
) { }
ngOnInit() {
this.rateUnits$ = this.stateService.rateUnits$;
}
}

6
frontend/src/app/shared/pipes/fee-rounding/fee-rounding.pipe.ts
View file

@ -9,7 +9,11 @@ export class FeeRoundingPipe implements PipeTransform {
@Inject(LOCALE_ID) private locale: string,
) {}
transform(fee: number): string {
transform(fee: number, rounding = null): string {
if (rounding) {
return formatNumber(fee, this.locale, rounding);
}
if (fee >= 100) {
return formatNumber(fee, this.locale, '1.0-0')
} else if (fee < 10) {

3
frontend/src/app/shared/shared.module.ts
View file

@ -83,6 +83,7 @@ import { IndexingProgressComponent } from '../components/indexing-progress/index
import { SvgImagesComponent } from '../components/svg-images/svg-images.component';
import { ChangeComponent } from '../components/change/change.component';
import { SatsComponent } from './components/sats/sats.component';
import { FeeRateComponent } from './components/fee-rate/fee-rate.component';
import { TruncateComponent } from './components/truncate/truncate.component';
import { SearchResultsComponent } from '../components/search-form/search-results/search-results.component';
import { TimestampComponent } from './components/timestamp/timestamp.component';
@ -173,6 +174,7 @@ import { ClockComponent } from '../components/clock/clock.component';
SvgImagesComponent,
ChangeComponent,
SatsComponent,
FeeRateComponent,
TruncateComponent,
SearchResultsComponent,
TimestampComponent,
@ -287,6 +289,7 @@ import { ClockComponent } from '../components/clock/clock.component';
SvgImagesComponent,
ChangeComponent,
SatsComponent,
FeeRateComponent,
TruncateComponent,
SearchResultsComponent,
TimestampComponent,

2
frontend/src/styles.scss
View file

@ -221,7 +221,7 @@ main {
}
.block-size, .blocks-container {
span {
.symbol {
font-size: 16px;
color: #fff !important;
}