lukechilds
/
EasyDEX-GUI
mirror of https://github.com/lukechilds/EasyDEX-GUI.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity
Browse Source

loading placeholder in tx history

all-modes
pbca26 8 years ago
parent
ddd789d29b
commit
ab4c8ee489
2 changed files with 57 additions and 48 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 53
      react/src/components/dashboard/walletsData.js
  2. 52
      react/src/components/dashboard/walletsNativeTxHistory.js

53
react/src/components/dashboard/walletsData.js
View File

@ -173,7 +173,7 @@ class WalletsData extends React.Component {
}
componentWillReceiveProps(props) {
if (this.props.ActiveCoin.txhistory && this.props.ActiveCoin.txhistory.length) {
if (this.props.ActiveCoin.txhistory && this.props.ActiveCoin.txhistory !== 'loading' && this.props.ActiveCoin.txhistory.length) {
if (!this.state.itemsList || (this.state.itemsList && !this.state.itemsList.length) || (props.ActiveCoin.txhistory !== this.props.ActiveCoin.txhistory)) {
let historyToSplit = sortByDate(this.props.ActiveCoin.txhistory);
historyToSplit = historyToSplit.slice((this.state.activePage - 1) * this.state.itemsPerPage, this.state.activePage * this.state.itemsPerPage);
@ -188,6 +188,10 @@ class WalletsData extends React.Component {
this.setState(Object.assign({}, this.state, {
itemsList: 'no data',
}));
} else if (this.props.ActiveCoin.txhistory && this.props.ActiveCoin.txhistory === 'loading') {
this.setState(Object.assign({}, this.state, {
itemsList: 'loading',
}));
}
}
@ -216,7 +220,7 @@ class WalletsData extends React.Component {
}
renderPaginationItemsPerPageSelector() {
if (this.props.ActiveCoin.txhistory && this.props.ActiveCoin.txhistory.length > 10) {
if (this.props.ActiveCoin.txhistory && this.state.itemsList !== 'loading' && this.props.ActiveCoin.txhistory.length > 10) {
return (
<div className="dataTables_length" id="kmd-tx-history-tbl_length">
<label>
@ -237,7 +241,7 @@ class WalletsData extends React.Component {
}
renderPagination() {
if (this.props.ActiveCoin.txhistory && this.props.ActiveCoin.txhistory.length > 10) {
if (this.props.ActiveCoin.txhistory && this.state.itemsList !== 'loading' && this.props.ActiveCoin.txhistory.length > 10) {
return (
<div className="row unselectable">
<div className="col-sm-5">
@ -302,29 +306,25 @@ class WalletsData extends React.Component {
}
renderTxHistoryList() {
if (this.state.itemsList && this.state.itemsList.length && this.state.itemsList !== 'no data') {
return this.state.itemsList.map((tx, index) =>
<tr key={tx.txid + tx.amount}>
<td>{this.renderTxType(tx.category || tx.type)}</td>
<td>{tx.confirmations}</td>
<td>{tx.amount || translate('DASHBOARD.UNKNOWN')}</td>
<td>{secondsToString(tx.blocktime || tx.timestamp)}</td>
<td>{tx.address}</td>
<td>
<button type="button" className="btn btn-xs white btn-info waves-effect waves-light btn-kmdtxid" onClick={() => this.toggleTxInfoModal(!this.props.ActiveCoin.showTransactionInfo, index)}><i className="icon fa-search"></i></button>
</td>
</tr>
);
}
if (this.state.itemsList === 'no data') {
if (this.state.itemsList === 'loading') {
return (
<span>No data</span>
<div>Loading history...</div>
);
}
if (!this.state.itemsList) {
return null;
} else {
if (this.state.itemsList && this.state.itemsList.length && this.state.itemsList !== 'no data') {
return this.state.itemsList.map((tx, index) =>
<tr key={tx.txid + tx.amount}>
<td>{this.renderTxType(tx.category || tx.type)}</td>
<td>{tx.confirmations}</td>
<td>{tx.amount || translate('DASHBOARD.UNKNOWN')}</td>
<td>{secondsToString(tx.blocktime || tx.timestamp)}</td>
<td>{tx.address}</td>
<td>
<button type="button" className="btn btn-xs white btn-info waves-effect waves-light btn-kmdtxid" onClick={() => this.toggleTxInfoModal(!this.props.ActiveCoin.showTransactionInfo, index)}><i className="icon fa-search"></i></button>
</td>
</tr>
);
}
}
}
@ -405,7 +405,10 @@ class WalletsData extends React.Component {
}
renderAddressList() {
if (this.props.Dashboard && this.props.Dashboard.activeHandle && this.props.Dashboard.activeHandle[this.props.ActiveCoin.coin] && this.props.ActiveCoin.mode === 'basilisk') {
if (this.props.Dashboard &&
this.props.Dashboard.activeHandle &&
this.props.Dashboard.activeHandle[this.props.ActiveCoin.coin] &&
this.props.ActiveCoin.mode === 'basilisk') {
return (
<div className={'btn-group bootstrap-select form-control form-material showkmdwalletaddrs show-tick ' + (this.state.addressSelectorOpen ? 'open' : '')}>
<button type="button" className="btn dropdown-toggle btn-info" data-toggle="dropdown" data-id="kmd_wallet_send_from" title="- Select Transparent or Private Address -" aria-expanded="true" onClick={this.openDropMenu}>

52
react/src/components/dashboard/walletsNativeTxHistory.js
View File

@ -81,7 +81,7 @@ class WalletsNativeTxHistory extends React.Component {
componentWillReceiveProps(props) {
if (!this.state.itemsList || (this.state.itemsList && !this.state.itemsList.length) || (props.ActiveCoin.txhistory !== this.props.ActiveCoin.txhistory)) {
if (this.props.ActiveCoin.txhistory) {
if (this.props.ActiveCoin.txhistory && this.props.ActiveCoin.txhistory !== 'loading') {
let historyToSplit = sortByDate(this.props.ActiveCoin.txhistory);
historyToSplit = historyToSplit.slice((this.state.activePage - 1) * this.state.itemsPerPage, this.state.activePage * this.state.itemsPerPage);
@ -117,7 +117,7 @@ class WalletsNativeTxHistory extends React.Component {
}
renderPaginationItemsPerPageSelector() {
if (this.props.ActiveCoin.txhistory && this.props.ActiveCoin.txhistory.length > 10) {
if (this.props.ActiveCoin.txhistory && this.props.ActiveCoin.txhistory !== 'loading' && this.props.ActiveCoin.txhistory.length > 10) {
return (
<div className="dataTables_length" id="kmd-tx-history-tbl_length">
<label>
@ -138,7 +138,7 @@ class WalletsNativeTxHistory extends React.Component {
}
renderPagination() {
if (this.props.ActiveCoin.txhistory && this.props.ActiveCoin.txhistory.length > 10) {
if (this.props.ActiveCoin.txhistory && this.props.ActiveCoin.txhistory !== 'loading' && this.props.ActiveCoin.txhistory.length > 10) {
return (
<div className="row unselectable">
<div className="col-sm-5">
@ -165,26 +165,32 @@ class WalletsNativeTxHistory extends React.Component {
}
renderTxHistoryList() {
if (this.state.itemsList && this.state.itemsList.length && this.props.ActiveCoin.nativeActiveSection === 'default') {
return this.state.itemsList.map((tx, index) =>
<tr key={tx.txid + tx.amount}>
<td>
<span className="label label-default">
<i className="icon fa-eye"></i> {translate('IAPI.PUBLIC_SM')}
</span>
</td>
<td>{this.renderTxType(tx.category)}</td>
<td>{tx.confirmations}</td>
<td>{tx.amount}</td>
<td>{secondsToString(tx.time)}</td>
<td>{this.renderAddress(tx)}</td>
<td>
<button type="button" className="btn btn-xs white btn-info waves-effect waves-light btn-kmdtxid" onClick={() => this.toggleTxInfoModal(!this.props.ActiveCoin.showTransactionInfo, index)}><i className="icon fa-search"></i></button>
</td>
</tr>
);
} else {
return null;
if (this.props.ActiveCoin.txhistory && this.props.ActiveCoin.txhistory === 'no data') {
return 'no data';
} else if (this.props.ActiveCoin.txhistory && this.props.ActiveCoin.txhistory === 'loading') {
return 'loading history...';
} else if (this.props.ActiveCoin.txhistory && (this.props.ActiveCoin.txhistory !== 'loading' && this.props.ActiveCoin.txhistory !== 'no data')) {
if (this.state.itemsList && this.state.itemsList.length && this.props.ActiveCoin.nativeActiveSection === 'default') {
return this.state.itemsList.map((tx, index) =>
<tr key={tx.txid + tx.amount}>
<td>
<span className="label label-default">
<i className="icon fa-eye"></i> {translate('IAPI.PUBLIC_SM')}
</span>
</td>
<td>{this.renderTxType(tx.category)}</td>
<td>{tx.confirmations}</td>
<td>{tx.amount}</td>
<td>{secondsToString(tx.time)}</td>
<td>{this.renderAddress(tx)}</td>
<td>
<button type="button" className="btn btn-xs white btn-info waves-effect waves-light btn-kmdtxid" onClick={() => this.toggleTxInfoModal(!this.props.ActiveCoin.showTransactionInfo, index)}><i className="icon fa-search"></i></button>
</td>
</tr>
);
} else {
return null;
}
}
}

Write Preview
Loading…
Cancel
Save