diff --git a/frontend/src/app/app.module.ts b/frontend/src/app/app.module.ts index 9e8fea464..e7fe30c1d 100644 --- a/frontend/src/app/app.module.ts +++ b/frontend/src/app/app.module.ts @@ -73,6 +73,7 @@ import { MiningDashboardComponent } from './components/mining-dashboard/mining-d import { DifficultyChartComponent } from './components/difficulty-chart/difficulty-chart.component'; import { HashrateChartComponent } from './components/hashrate-chart/hashrate-chart.component'; import { MiningStartComponent } from './components/mining-start/mining-start.component'; +import { AmountShortenerPipe } from './shared/pipes/amount-shortener.pipe'; @NgModule({ declarations: [ @@ -128,6 +129,7 @@ import { MiningStartComponent } from './components/mining-start/mining-start.com DifficultyChartComponent, HashrateChartComponent, MiningStartComponent, + AmountShortenerPipe, ], imports: [ BrowserModule.withServerTransition({ appId: 'serverApp' }), diff --git a/frontend/src/app/components/asset-circulation/asset-circulation.component.html b/frontend/src/app/components/asset-circulation/asset-circulation.component.html index 1c6337721..98d672c55 100644 --- a/frontend/src/app/components/asset-circulation/asset-circulation.component.html +++ b/frontend/src/app/components/asset-circulation/asset-circulation.component.html @@ -1,3 +1,6 @@ - {{ circulating.amount }} {{ circulating.ticker }} + Confidential + + {{ circulating.amount | amountShortener }} + {{ circulating.amount | number: '1.2-2' }} {{ circulating.ticker }} \ No newline at end of file diff --git a/frontend/src/app/components/asset-circulation/asset-circulation.component.ts b/frontend/src/app/components/asset-circulation/asset-circulation.component.ts index d1a56abb0..4d65417e6 100644 --- a/frontend/src/app/components/asset-circulation/asset-circulation.component.ts +++ b/frontend/src/app/components/asset-circulation/asset-circulation.component.ts @@ -16,7 +16,7 @@ import { environment } from 'src/environments/environment'; export class AssetCirculationComponent implements OnInit { @Input() assetId: string; - circulatingAmount$: Observable<{ amount: string, ticker: string}>; + circulatingAmount$: Observable<{ amount: number, ticker: string}>; constructor( private electrsApiService: ElectrsApiService, @@ -35,20 +35,18 @@ export class AssetCirculationComponent implements OnInit { if (!asset.chain_stats.has_blinded_issuances) { if (asset.asset_id === environment.nativeAssetId) { return { - amount: formatNumber(this.formatAmount(asset.chain_stats.peg_in_amount - asset.chain_stats.burned_amount - - asset.chain_stats.peg_out_amount, assetData[3]), this.locale, '1.2-2'), + amount: this.formatAmount(asset.chain_stats.peg_in_amount - asset.chain_stats.burned_amount - asset.chain_stats.peg_out_amount, assetData[3]), ticker: assetData[1] }; } else { return { - amount: formatNumber(this.formatAmount(asset.chain_stats.issued_amount - - asset.chain_stats.burned_amount, assetData[3]), this.locale, '1.2-2'), + amount: this.formatAmount(asset.chain_stats.issued_amount - asset.chain_stats.burned_amount, assetData[3]), ticker: assetData[1] }; } } else { return { - amount: $localize`:@@shared.confidential:Confidential`, + amount: -1, ticker: '', }; } diff --git a/frontend/src/app/shared/pipes/amount-shortener.pipe.ts b/frontend/src/app/shared/pipes/amount-shortener.pipe.ts new file mode 100644 index 000000000..49b452cd9 --- /dev/null +++ b/frontend/src/app/shared/pipes/amount-shortener.pipe.ts @@ -0,0 +1,22 @@ +import { Pipe, PipeTransform } from '@angular/core'; + +@Pipe({ + name: 'amountShortener' +}) +export class AmountShortenerPipe implements PipeTransform { + transform(num: number, ...args: number[]): unknown { + const digits = args[0] || 1; + const lookup = [ + { value: 1, symbol: '' }, + { value: 1e3, symbol: 'k' }, + { value: 1e6, symbol: 'M' }, + { value: 1e9, symbol: 'G' }, + { value: 1e12, symbol: 'T' }, + { value: 1e15, symbol: 'P' }, + { value: 1e18, symbol: 'E' } + ]; + const rx = /\.0+$|(\.[0-9]*[1-9])0+$/; + var item = lookup.slice().reverse().find((item) => num >= item.value); + return item ? (num / item.value).toFixed(digits).replace(rx, '$1') + item.symbol : '0'; + } +}