Skip to content

Commit 1d4102a

Browse files
rastajparastajpa
committed
improvements for address view
1 parent 1c9066a commit 1d4102a

File tree

6 files changed

+88
-36
lines changed

6 files changed

+88
-36
lines changed

‎packages/insight-previous/src/components/coin-list/coin-list.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
<div *ngIf="!loading">
44
<ion-grid>
55
<ion-row *ngFor="let tx of txs; let i = index">
6-
<ion-col col-12 *ngIf="i < limit">
6+
<ion-col col-12 *ngIf="i < limit && (tx.spentTxid !== '' || tx.mintTxid)">
77
<coin [coin]="tx" [chainNetwork]="chainNetwork"></coin>
88
</ion-col>
99
</ion-row>

‎packages/insight-previous/src/components/coin-list/coin-list.ts

Lines changed: 6 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -35,7 +35,7 @@ export class CoinListComponent implements OnInit {
3535
this.addrProvider.getAddressActivity(this.addrStr).subscribe(
3636
data => {
3737
const formattedData = data.map(this.txsProvider.toAppCoin);
38-
this.txs = this.orderByHeight(formattedData);
38+
this.txs = this.processData(formattedData);
3939
this.showTransactions = true;
4040
this.loading = false;
4141
this.events.publish('CoinList', { length: data.length });
@@ -48,24 +48,14 @@ export class CoinListComponent implements OnInit {
4848
}
4949
}
5050

51-
orderByHeight(data) {
52-
const unconfirmedTxs = [];
53-
let confirmedTxs = [];
54-
51+
processData(data) {
52+
const txs = [];
5553
data.forEach(tx => {
5654
const { mintHeight, mintTxid, value, spentHeight, spentTxid } = tx;
57-
58-
mintHeight < 0
59-
? unconfirmedTxs.push({ height: mintHeight, mintTxid, value })
60-
: confirmedTxs.push({ height: mintHeight, mintTxid, value });
61-
62-
spentHeight < 0
63-
? unconfirmedTxs.push({ height: spentHeight, spentTxid, value })
64-
: confirmedTxs.push({ height: spentHeight, spentTxid, value });
55+
txs.push({ height: spentHeight, spentTxid, value });
56+
txs.push({ height: mintHeight, mintTxid, value });
6557
});
66-
67-
confirmedTxs = _.orderBy(confirmedTxs, ['height'], ['desc']);
68-
return unconfirmedTxs.concat(confirmedTxs);
58+
return txs;
6959
}
7060

7161
public loadMore(infiniteScroll) {

‎packages/insight-previous/src/components/coin/coin.html

Lines changed: 44 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
<ion-row *ngIf="coin?.mintTxid">
33
<ion-col col-7>
44
<div class="ellipsis">
5-
<span *ngIf="coin.height >= 0">
5+
<span *ngIf="coin.height >= -1">
66
<a (click)="goToTx(coin.mintTxid)">{{ coin.mintTxid }}</a>
77
</span>
88
<span ion-text color="danger" *ngIf="coin.height === -3">
@@ -11,15 +11,31 @@
1111
</div>
1212
</ion-col>
1313
<ion-col col-5 text-right>
14-
<span ion-text>
15-
<ion-icon name="md-add-circle" color="dark"></ion-icon>
16-
{{ currencyProvider.getConvertedNumber(coin.value) | number:'1.0-8' }}
17-
{{ currencyProvider.currencySymbol }}
18-
</span>
14+
<ion-chip item-end color="warning" *ngIf="confirmations === -1">
15+
<ion-label>
16+
Unconfirmed
17+
</ion-label>
18+
</ion-chip>
19+
<ion-chip item-end color="primary" *ngIf="confirmations === 1">
20+
<ion-label>
21+
1 Confirmation
22+
</ion-label>
23+
</ion-chip>
24+
<ion-chip item-end color="primary" *ngIf="confirmations > 1">
25+
<ion-label>
26+
{{ confirmations }} Confirmations
27+
</ion-label>
28+
</ion-chip>
29+
<ion-chip item-end color="default" class="size-fixed">
30+
<ion-label>
31+
{{ currencyProvider.getConvertedNumber(coin.value) | number:'1.0-8' }}
32+
{{ currencyProvider.currencySymbol }}
33+
</ion-label>
34+
</ion-chip>
1935
</ion-col>
2036
</ion-row>
2137

22-
<ion-row *ngIf="coin?.spentTxid || coin?.spentTxid == ''">
38+
<ion-row *ngIf="coin?.spentTxid">
2339
<ion-col col-7>
2440
<div class="ellipsis">
2541
<span *ngIf="coin.height >= -1">
@@ -37,12 +53,27 @@
3753
</div>
3854
</ion-col>
3955
<ion-col col-5 text-right>
40-
<span ion-text [color]="!coin.spentTxid ? 'default':'dark-light'">
41-
<ion-icon name="md-remove-circle" [color]="!coin.spentTxid ? 'default':'dark-light'" *ngIf="coin.height >= 0">
42-
</ion-icon>
43-
{{ currencyProvider.getConvertedNumber(coin.value) | number:'1.0-8' }}
44-
{{ currencyProvider.currencySymbol }}
45-
</span>
56+
<ion-chip item-end color="warning" *ngIf="confirmations === -1">
57+
<ion-label>
58+
Unconfirmed
59+
</ion-label>
60+
</ion-chip>
61+
<ion-chip item-end color="primary" *ngIf="confirmations === 1">
62+
<ion-label>
63+
1 Confirmation
64+
</ion-label>
65+
</ion-chip>
66+
<ion-chip item-end color="primary" *ngIf="confirmations > 1">
67+
<ion-label>
68+
{{ confirmations }} Confirmations
69+
</ion-label>
70+
</ion-chip>
71+
<ion-chip item-end class="size-fixed">
72+
<ion-label color="danger">
73+
- {{ currencyProvider.getConvertedNumber(coin.value) | number:'1.0-8' }}
74+
{{ currencyProvider.currencySymbol }}
75+
</ion-label>
76+
</ion-chip>
4677
</ion-col>
4778
</ion-row>
4879
</ion-grid>

‎packages/insight-previous/src/components/coin/coin.scss

Lines changed: 15 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,14 @@
11
coin {
2+
.grid{
3+
padding: 0;
4+
}
25
ion-grid {
36
background-color: #f7f7f7;
47
border: 1px solid #f3f3f3;
58
border-radius: 3px;
6-
9+
710
ion-row {
11+
align-items: center;
812

913
&.small {
1014
font-size: 1.1rem;
@@ -16,4 +20,14 @@ coin {
1620

1721
}
1822
}
23+
24+
.chip {
25+
padding-left: 1em;
26+
padding-right: 1em;
27+
border-radius: 3px;
28+
-webkit-font-smoothing: subpixel-antialiased;
29+
&.size-fixed{
30+
width: 150px;
31+
}
32+
}
1933
}

‎packages/insight-previous/src/components/coin/coin.ts

Lines changed: 20 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -2,23 +2,40 @@ import { Component, Input } from '@angular/core';
22
import { ApiProvider, ChainNetwork } from '../../providers/api/api';
33
import { CurrencyProvider } from '../../providers/currency/currency';
44
import { RedirProvider } from '../../providers/redir/redir';
5-
import { AppCoin } from '../../providers/transactions/transactions';
5+
import { TxsProvider } from '../../providers/transactions/transactions';
6+
67
@Component({
78
selector: 'coin',
89
templateUrl: 'coin.html'
910
})
1011
export class CoinComponent {
1112
@Input()
12-
public coin: AppCoin | {} = {};
13+
public coin;
1314
@Input()
1415
public chainNetwork: ChainNetwork;
1516

17+
public confirmations: number;
18+
1619
constructor(
1720
public apiProvider: ApiProvider,
1821
public currencyProvider: CurrencyProvider,
19-
public redirProvider: RedirProvider
22+
public redirProvider: RedirProvider,
23+
public txProvider: TxsProvider
2024
) {}
2125

26+
// tslint:disable-next-line:use-life-cycle-interface
27+
ngAfterViewInit() {
28+
this.getConfirmations();
29+
}
30+
31+
public getConfirmations() {
32+
this.txProvider
33+
.getConfirmations(this.coin.height, this.chainNetwork)
34+
.subscribe(confirmations => {
35+
this.confirmations = confirmations;
36+
});
37+
}
38+
2239
public goToTx(txId: string): void {
2340
this.redirProvider.redir('transaction', {
2441
txId,

‎packages/insight-previous/src/components/transaction/transaction.html

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -36,7 +36,7 @@
3636
Unconfirmed
3737
</ion-label>
3838
</ion-chip>
39-
<ion-chip item-end color="brand" *ngIf="confirmations === 1">
39+
<ion-chip item-end color="primary" *ngIf="confirmations === 1">
4040
<ion-label>
4141
1 Confirmation
4242
</ion-label>
@@ -160,7 +160,7 @@
160160
<ion-chip color="warning" *ngIf="confirmations === -1">
161161
<ion-label>Unconfirmed</ion-label>
162162
</ion-chip>
163-
<ion-chip color="brand" *ngIf="confirmations === 1">
163+
<ion-chip color="primary" *ngIf="confirmations === 1">
164164
<ion-label>1 Confirmation</ion-label>
165165
</ion-chip>
166166
<ion-chip color="primary" *ngIf="confirmations > 1">

0 commit comments

Comments
 (0)