From 669a5e429df77d4e22deda27abcfe403f7bd2bb3 Mon Sep 17 00:00:00 2001 From: softsimon Date: Mon, 2 Mar 2020 17:29:00 +0700 Subject: [PATCH] Added fiat balance to address and made fiat balance into a component. --- frontend/src/app/app.module.ts | 2 ++ .../components/address/address.component.html | 2 +- .../components/address/address.component.ts | 1 + .../app/components/block/block.component.html | 2 +- .../app/components/block/block.component.ts | 7 ------ .../transaction/transaction.component.html | 4 +-- .../transaction/transaction.component.ts | 4 --- frontend/src/app/fiat/fiat.component.html | 1 + frontend/src/app/fiat/fiat.component.scss | 3 +++ frontend/src/app/fiat/fiat.component.spec.ts | 25 +++++++++++++++++++ frontend/src/app/fiat/fiat.component.ts | 24 ++++++++++++++++++ 11 files changed, 60 insertions(+), 15 deletions(-) create mode 100644 frontend/src/app/fiat/fiat.component.html create mode 100644 frontend/src/app/fiat/fiat.component.scss create mode 100644 frontend/src/app/fiat/fiat.component.spec.ts create mode 100644 frontend/src/app/fiat/fiat.component.ts diff --git a/frontend/src/app/app.module.ts b/frontend/src/app/app.module.ts index f2e41ac2b..1cf560ecb 100644 --- a/frontend/src/app/app.module.ts +++ b/frontend/src/app/app.module.ts @@ -41,6 +41,7 @@ import { BlockchainComponent } from './components/blockchain/blockchain.componen import { FooterComponent } from './components/footer/footer.component'; import { ExplorerComponent } from './components/explorer/explorer.component'; import { AudioService } from './services/audio.service'; +import { FiatComponent } from './fiat/fiat.component'; @NgModule({ declarations: [ @@ -73,6 +74,7 @@ import { AudioService } from './services/audio.service'; ExplorerComponent, ChartistComponent, FooterComponent, + FiatComponent, ], imports: [ BrowserModule, diff --git a/frontend/src/app/components/address/address.component.html b/frontend/src/app/components/address/address.component.html index 5f4e8c85d..498891f47 100644 --- a/frontend/src/app/components/address/address.component.html +++ b/frontend/src/app/components/address/address.component.html @@ -23,7 +23,7 @@ Balance - {{ (receieved - sent) / 100000000 | number: '1.2-8' }} BTC + {{ (receieved - sent) / 100000000 | number: '1.2-8' }} BTC () diff --git a/frontend/src/app/components/address/address.component.ts b/frontend/src/app/components/address/address.component.ts index fc4a6d0cd..bedbe08ce 100644 --- a/frontend/src/app/components/address/address.component.ts +++ b/frontend/src/app/components/address/address.component.ts @@ -49,6 +49,7 @@ export class AddressComponent implements OnInit, OnDestroy { this.error = undefined; this.isLoadingAddress = true; this.loadedConfirmedTxCount = 0; + this.address = null; this.isLoadingTransactions = true; this.transactions = null; document.body.scrollTo(0, 0); diff --git a/frontend/src/app/components/block/block.component.html b/frontend/src/app/components/block/block.component.html index 241ff58f0..b2819e136 100644 --- a/frontend/src/app/components/block/block.component.html +++ b/frontend/src/app/components/block/block.component.html @@ -47,7 +47,7 @@ Block subsidy - {{ blockSubsidy | number: '1.2-2' }} BTC ({{ conversions.USD * blockSubsidy | currency:'USD':'symbol':'1.0-0' }}) + {{ blockSubsidy | number: '1.2-2' }} BTC () Status diff --git a/frontend/src/app/components/block/block.component.ts b/frontend/src/app/components/block/block.component.ts index 9055fba2d..65f5363a0 100644 --- a/frontend/src/app/components/block/block.component.ts +++ b/frontend/src/app/components/block/block.component.ts @@ -22,7 +22,6 @@ export class BlockComponent implements OnInit { isLoadingTransactions = true; error: any; blockSubsidy = 50; - conversions: any; constructor( private route: ActivatedRoute, @@ -69,12 +68,6 @@ export class BlockComponent implements OnInit { this.stateService.blocks$ .subscribe((block) => this.latestBlock = block); - - this.stateService.conversions$ - .subscribe((conversions) => { - this.conversions = conversions; - }); - } setBlockSubsidy() { diff --git a/frontend/src/app/components/transaction/transaction.component.html b/frontend/src/app/components/transaction/transaction.component.html index 149e71d98..3f7118d2b 100644 --- a/frontend/src/app/components/transaction/transaction.component.html +++ b/frontend/src/app/components/transaction/transaction.component.html @@ -32,7 +32,7 @@ Fees - {{ tx.fee | number }} sats ({{ conversions.USD * tx.fee / 100000000 | currency:'USD':'symbol':'1.2-2' }}) + {{ tx.fee | number }} sats () Fees per vByte @@ -67,7 +67,7 @@ Fees - {{ tx.fee | number }} sats ({{ conversions.USD * tx.fee / 100000000 | currency:'USD':'symbol':'1.2-2' }}) + {{ tx.fee | number }} sats () Fees per vByte diff --git a/frontend/src/app/components/transaction/transaction.component.ts b/frontend/src/app/components/transaction/transaction.component.ts index 1ebad8f9d..d195d96db 100644 --- a/frontend/src/app/components/transaction/transaction.component.ts +++ b/frontend/src/app/components/transaction/transaction.component.ts @@ -18,7 +18,6 @@ export class TransactionComponent implements OnInit, OnDestroy { tx: Transaction; txId: string; isLoadingTx = true; - conversions: any; error: any = undefined; latestBlock: Block; transactionTime = -1; @@ -66,9 +65,6 @@ export class TransactionComponent implements OnInit, OnDestroy { this.isLoadingTx = false; }); - this.stateService.conversions$ - .subscribe((conversions) => this.conversions = conversions); - this.stateService.blocks$ .subscribe((block) => this.latestBlock = block); diff --git a/frontend/src/app/fiat/fiat.component.html b/frontend/src/app/fiat/fiat.component.html new file mode 100644 index 000000000..8ec9b4bdf --- /dev/null +++ b/frontend/src/app/fiat/fiat.component.html @@ -0,0 +1 @@ +{{ (conversions$ | async)?.USD * value / 100000000 | currency:'USD':'symbol':'1.2-2' }} \ No newline at end of file diff --git a/frontend/src/app/fiat/fiat.component.scss b/frontend/src/app/fiat/fiat.component.scss new file mode 100644 index 000000000..843bd58b6 --- /dev/null +++ b/frontend/src/app/fiat/fiat.component.scss @@ -0,0 +1,3 @@ +.green-color { + color: #3bcc49; +} diff --git a/frontend/src/app/fiat/fiat.component.spec.ts b/frontend/src/app/fiat/fiat.component.spec.ts new file mode 100644 index 000000000..a7f4821dc --- /dev/null +++ b/frontend/src/app/fiat/fiat.component.spec.ts @@ -0,0 +1,25 @@ +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; + +import { FiatComponent } from './fiat.component'; + +describe('FiatComponent', () => { + let component: FiatComponent; + let fixture: ComponentFixture; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ FiatComponent ] + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(FiatComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/frontend/src/app/fiat/fiat.component.ts b/frontend/src/app/fiat/fiat.component.ts new file mode 100644 index 000000000..54b3ad909 --- /dev/null +++ b/frontend/src/app/fiat/fiat.component.ts @@ -0,0 +1,24 @@ +import { Component, OnInit, ChangeDetectionStrategy, Input } from '@angular/core'; +import { Observable } from 'rxjs'; +import { StateService } from '../services/state.service'; + +@Component({ + selector: 'app-fiat', + templateUrl: './fiat.component.html', + styleUrls: ['./fiat.component.scss'], + changeDetection: ChangeDetectionStrategy.OnPush, +}) +export class FiatComponent implements OnInit { + conversions$: Observable; + + @Input() value: number; + + constructor( + private stateService: StateService, + ) { } + + ngOnInit(): void { + this.conversions$ = this.stateService.conversions$.asObservable(); + } + +}