Merge branch 'master' into nymkappa/feature/align-dashboards

This commit is contained in:
wiz
2023-02-24 17:10:57 +09:00
committed by GitHub
29 changed files with 257 additions and 137 deletions

View File

@@ -145,6 +145,13 @@
}
}
.project-translators .wrapper {
a img {
width: 72px;
height: 72px;
}
}
.copyright {
text-align: left;
max-width: 620px;

View File

@@ -3,7 +3,7 @@
{{ addPlus && satoshis >= 0 ? '+' : '' }}
{{
(
(blockConversion.price[currency] > 0 ? blockConversion.price[currency] : null) ??
(blockConversion.price[currency] >= 0 ? blockConversion.price[currency] : null) ??
(blockConversion.price['USD'] * blockConversion.exchangeRates['USD' + currency]) ?? 0
) * satoshis / 100000000 | fiatCurrency : digitsInfo : currency
}}

View File

@@ -1,19 +1,17 @@
import { ChangeDetectionStrategy, Component, Inject, Input, LOCALE_ID, OnInit } from '@angular/core';
import { EChartsOption, graphic } from 'echarts';
import { Observable, Subscription } from 'rxjs';
import { Observable } from 'rxjs';
import { map, share, startWith, switchMap, tap } from 'rxjs/operators';
import { ApiService } from '../../services/api.service';
import { SeoService } from '../../services/seo.service';
import { formatNumber } from '@angular/common';
import { UntypedFormBuilder, UntypedFormGroup } from '@angular/forms';
import { download, formatterXAxis } from '../../shared/graphs.utils';
import { StateService } from '../../services/state.service';
import { StorageService } from '../../services/storage.service';
import { MiningService } from '../../services/mining.service';
import { ActivatedRoute } from '@angular/router';
import { FiatShortenerPipe } from '../../shared/pipes/fiat-shortener.pipe';
import { FiatCurrencyPipe } from '../../shared/pipes/fiat-currency.pipe';
import { fiatCurrencies } from '../../app.constants';
@Component({
selector: 'app-block-fees-graph',
@@ -47,7 +45,6 @@ export class BlockFeesGraphComponent implements OnInit {
timespan = '';
chartInstance: any = undefined;
currencySubscription: Subscription;
currency: string;
constructor(
@@ -57,21 +54,13 @@ export class BlockFeesGraphComponent implements OnInit {
private formBuilder: UntypedFormBuilder,
private storageService: StorageService,
private miningService: MiningService,
private stateService: StateService,
private route: ActivatedRoute,
private fiatShortenerPipe: FiatShortenerPipe,
private fiatCurrencyPipe: FiatCurrencyPipe,
) {
this.radioGroupForm = this.formBuilder.group({ dateSpan: '1y' });
this.radioGroupForm.controls.dateSpan.setValue('1y');
this.currencySubscription = this.stateService.fiatCurrency$.subscribe((fiat) => {
if (fiat && fiatCurrencies[fiat]?.indexed) {
this.currency = fiat;
} else {
this.currency = 'USD';
}
});
this.currency = 'USD';
}
ngOnInit(): void {

View File

@@ -10,5 +10,6 @@
[cursorPosition]="tooltipPosition"
[clickable]="!!selectedTx"
[auditEnabled]="auditHighlighting"
[blockConversion]="blockConversion"
></app-block-overview-tooltip>
</div>

View File

@@ -5,6 +5,7 @@ import BlockScene from './block-scene';
import TxSprite from './tx-sprite';
import TxView from './tx-view';
import { Position } from './sprite-types';
import { Price } from 'src/app/services/price.service';
@Component({
selector: 'app-block-overview-graph',
@@ -21,6 +22,7 @@ export class BlockOverviewGraphComponent implements AfterViewInit, OnDestroy, On
@Input() mirrorTxid: string | void;
@Input() unavailable: boolean = false;
@Input() auditHighlighting: boolean = false;
@Input() blockConversion: Price;
@Output() txClickEvent = new EventEmitter<TransactionStripped>();
@Output() txHoverEvent = new EventEmitter<string>();
@Output() readyEvent = new EventEmitter();

View File

@@ -16,11 +16,11 @@
</tr>
<tr>
<td class="td-width" i18n="dashboard.latest-transactions.amount">Amount</td>
<td><app-amount [satoshis]="value"></app-amount></td>
<td><app-amount [blockConversion]="blockConversion" [satoshis]="value"></app-amount></td>
</tr>
<tr>
<td class="td-width" i18n="transaction.fee|Transaction fee">Fee</td>
<td>{{ fee | number }} <span class="symbol" i18n="shared.sat|sat">sat</span> &nbsp; <span class="fiat"><app-fiat [value]="fee"></app-fiat></span></td>
<td>{{ fee | number }} <span class="symbol" i18n="shared.sat|sat">sat</span> &nbsp; <span class="fiat"><app-fiat [blockConversion]="blockConversion" [value]="fee"></app-fiat></span></td>
</tr>
<tr>
<td class="td-width" i18n="transaction.fee-rate|Transaction fee rate">Fee rate</td>

View File

@@ -1,6 +1,7 @@
import { Component, ElementRef, ViewChild, Input, OnChanges, ChangeDetectionStrategy } from '@angular/core';
import { TransactionStripped } from '../../interfaces/websocket.interface';
import { Position } from '../../components/block-overview-graph/sprite-types.js';
import { Price } from 'src/app/services/price.service';
@Component({
selector: 'app-block-overview-tooltip',
@@ -12,6 +13,7 @@ export class BlockOverviewTooltipComponent implements OnChanges {
@Input() cursorPosition: Position;
@Input() clickable: boolean;
@Input() auditEnabled: boolean = false;
@Input() blockConversion: Price;
txid = '';
fee = 0;

View File

@@ -1,19 +1,17 @@
import { ChangeDetectionStrategy, Component, Inject, Input, LOCALE_ID, OnInit } from '@angular/core';
import { EChartsOption, graphic } from 'echarts';
import { Observable, Subscription } from 'rxjs';
import { Observable } from 'rxjs';
import { map, share, startWith, switchMap, tap } from 'rxjs/operators';
import { ApiService } from '../../services/api.service';
import { SeoService } from '../../services/seo.service';
import { formatNumber } from '@angular/common';
import { UntypedFormBuilder, UntypedFormGroup } from '@angular/forms';
import { download, formatterXAxis, formatterXAxisLabel, formatterXAxisTimeCategory } from '../../shared/graphs.utils';
import { download, formatterXAxis } from '../../shared/graphs.utils';
import { MiningService } from '../../services/mining.service';
import { StateService } from '../../services/state.service';
import { StorageService } from '../../services/storage.service';
import { ActivatedRoute } from '@angular/router';
import { FiatShortenerPipe } from '../../shared/pipes/fiat-shortener.pipe';
import { FiatCurrencyPipe } from '../../shared/pipes/fiat-currency.pipe';
import { fiatCurrencies } from '../../app.constants';
@Component({
selector: 'app-block-rewards-graph',
@@ -47,7 +45,6 @@ export class BlockRewardsGraphComponent implements OnInit {
timespan = '';
chartInstance: any = undefined;
currencySubscription: Subscription;
currency: string;
constructor(
@@ -56,19 +53,12 @@ export class BlockRewardsGraphComponent implements OnInit {
private apiService: ApiService,
private formBuilder: UntypedFormBuilder,
private miningService: MiningService,
private stateService: StateService,
private storageService: StorageService,
private route: ActivatedRoute,
private fiatShortenerPipe: FiatShortenerPipe,
private fiatCurrencyPipe: FiatCurrencyPipe,
) {
this.currencySubscription = this.stateService.fiatCurrency$.subscribe((fiat) => {
if (fiat && fiatCurrencies[fiat]?.indexed) {
this.currency = fiat;
} else {
this.currency = 'USD';
}
});
this.currency = 'USD';
}
ngOnInit(): void {

View File

@@ -108,6 +108,7 @@
[blockLimit]="stateService.blockVSize"
[orientation]="'top'"
[flip]="false"
[blockConversion]="blockConversion"
(txClickEvent)="onTxClick($event)"
></app-block-overview-graph>
<ng-container *ngTemplateOutlet="emptyBlockInfo"></ng-container>

View File

@@ -443,9 +443,9 @@ export class BlockComponent implements OnInit, OnDestroy {
}
this.priceSubscription = block$.pipe(
switchMap((block) => {
return this.priceService.getPrices().pipe(
tap(() => {
this.blockConversion = this.priceService.getPriceForTimestamp(block.timestamp);
return this.priceService.getBlockPrice$(block.timestamp).pipe(
tap((price) => {
this.blockConversion = price;
})
);
})
@@ -471,6 +471,7 @@ export class BlockComponent implements OnInit, OnDestroy {
this.auditSubscription?.unsubscribe();
this.unsubscribeNextBlockSubscriptions();
this.childChangeSubscription?.unsubscribe();
this.priceSubscription?.unsubscribe();
}
unsubscribeNextBlockSubscriptions() {

View File

@@ -1,4 +1,4 @@
<div class="holder" [ngStyle]="{'width': size, 'height': size}">
<img *ngIf="imageUrl" [src]="imageUrl">
<canvas #canvas></canvas>
<canvas #canvas [style]="{'border': border + 'px solid white'}"></canvas>
</div>

View File

@@ -12,6 +12,7 @@ export class QrcodeComponent implements AfterViewInit {
@Input() data: string;
@Input() size = 125;
@Input() imageUrl: string;
@Input() border = 0;
@ViewChild('canvas') canvas: ElementRef;
qrcodeObject: any;

View File

@@ -123,7 +123,7 @@ export class StartComponent implements OnInit, OnDestroy {
this.minScrollWidth = this.firstPageWidth + (this.pageWidth * 2);
if (firstVisibleBlock != null) {
this.scrollToBlock(firstVisibleBlock, offset);
this.scrollToBlock(firstVisibleBlock, offset + (this.isMobile ? this.blockWidth : 0));
} else {
this.updatePages();
}
@@ -178,8 +178,10 @@ export class StartComponent implements OnInit, OnDestroy {
setTimeout(() => { this.scrollToBlock(height, blockOffset); }, 50);
return;
}
const targetHeight = this.isMobile ? height - 1 : height;
const viewingPageIndex = this.getPageIndexOf(targetHeight);
if (this.isMobile) {
blockOffset -= this.blockWidth;
}
const viewingPageIndex = this.getPageIndexOf(height);
const pages = [];
this.pageIndex = Math.max(viewingPageIndex - 1, 0);
let viewingPage = this.getPageAt(viewingPageIndex);
@@ -189,7 +191,7 @@ export class StartComponent implements OnInit, OnDestroy {
viewingPage = this.getPageAt(viewingPageIndex);
}
const left = viewingPage.offset - this.getConvertedScrollOffset();
const blockIndex = viewingPage.height - targetHeight;
const blockIndex = viewingPage.height - height;
const targetOffset = (this.blockWidth * blockIndex) + left;
let deltaOffset = targetOffset - blockOffset;

View File

@@ -327,9 +327,9 @@ export class TransactionComponent implements OnInit, AfterViewInit, OnDestroy {
this.fetchRbfHistory$.next(this.tx.txid);
}
this.priceService.getPrices().pipe(
tap(() => {
this.blockConversion = this.priceService.getPriceForTimestamp(tx.status.block_time);
this.priceService.getBlockPrice$(tx.status.block_time, true).pipe(
tap((price) => {
this.blockConversion = price;
})
).subscribe();

View File

@@ -6,7 +6,7 @@ import { Outspend, Transaction, Vin, Vout } from '../../interfaces/electrs.inter
import { ElectrsApiService } from '../../services/electrs-api.service';
import { environment } from '../../../environments/environment';
import { AssetsService } from '../../services/assets.service';
import { filter, map, tap, switchMap } from 'rxjs/operators';
import { filter, map, tap, switchMap, shareReplay } from 'rxjs/operators';
import { BlockExtended } from '../../interfaces/node-api.interface';
import { ApiService } from '../../services/api.service';
import { PriceService } from 'src/app/services/price.service';
@@ -150,10 +150,8 @@ export class TransactionsListComponent implements OnInit, OnChanges {
tx['addressValue'] = addressIn - addressOut;
}
this.priceService.getPrices().pipe(
tap(() => {
tx['price'] = this.priceService.getPriceForTimestamp(tx.status.block_time);
})
this.priceService.getBlockPrice$(tx.status.block_time).pipe(
tap((price) => tx['price'] = price)
).subscribe();
});
const txIds = this.transactions.filter((tx) => !tx._outspends).map((tx) => tx.txid);

View File

@@ -56,7 +56,7 @@
</ng-container>
</ng-container>
<p *ngIf="line.value == null && line.confidential" i18n="shared.confidential">Confidential</p>
<p *ngIf="line.value != null"><app-amount [satoshis]="line.value"></app-amount></p>
<p *ngIf="line.value != null"><app-amount [blockConversion]="blockConversion" [satoshis]="line.value"></app-amount></p>
<p *ngIf="line.type !== 'fee' && line.address" class="address">
<app-truncate [text]="line.address"></app-truncate>
</p>

View File

@@ -1,5 +1,6 @@
import { Component, ElementRef, ViewChild, Input, OnChanges, ChangeDetectionStrategy } from '@angular/core';
import { TransactionStripped } from '../../interfaces/websocket.interface';
import { Component, ElementRef, ViewChild, Input, OnChanges, OnInit } from '@angular/core';
import { tap } from 'rxjs';
import { Price, PriceService } from 'src/app/services/price.service';
interface Xput {
type: 'input' | 'output' | 'fee';
@@ -14,6 +15,7 @@ interface Xput {
pegin?: boolean;
pegout?: string;
confidential?: boolean;
timestamp?: number;
}
@Component({
@@ -27,12 +29,21 @@ export class TxBowtieGraphTooltipComponent implements OnChanges {
@Input() isConnector: boolean = false;
tooltipPosition = { x: 0, y: 0 };
blockConversion: Price;
@ViewChild('tooltip') tooltipElement: ElementRef<HTMLCanvasElement>;
constructor() {}
constructor(private priceService: PriceService) {}
ngOnChanges(changes): void {
if (changes.line?.currentValue) {
this.priceService.getBlockPrice$(changes.line?.currentValue.timestamp, true).pipe(
tap((price) => {
this.blockConversion = price;
})
).subscribe();
}
if (changes.cursorPosition && changes.cursorPosition.currentValue) {
let x = Math.max(10, changes.cursorPosition.currentValue.x - 50);
let y = changes.cursorPosition.currentValue.y + 20;

View File

@@ -29,6 +29,7 @@ interface Xput {
pegin?: boolean;
pegout?: string;
confidential?: boolean;
timestamp?: number;
}
@Component({
@@ -152,6 +153,7 @@ export class TxBowtieGraphComponent implements OnInit, OnChanges {
index: i,
pegout: v?.pegout?.scriptpubkey_address,
confidential: (this.isLiquid && v?.value === undefined),
timestamp: this.tx.status.block_time
} as Xput;
});
@@ -171,6 +173,7 @@ export class TxBowtieGraphComponent implements OnInit, OnChanges {
coinbase: v?.is_coinbase,
pegin: v?.is_pegin,
confidential: (this.isLiquid && v?.prevout?.value === undefined),
timestamp: this.tx.status.block_time
} as Xput;
});