diff --git a/react/src/components/addcoin/addcoin.js b/react/src/components/addcoin/addcoin.js
index 75462e6..7b750a6 100644
--- a/react/src/components/addcoin/addcoin.js
+++ b/react/src/components/addcoin/addcoin.js
@@ -8,9 +8,9 @@ import {
shepherdPostCoinList
} from '../../actions/actionCreators';
import Store from '../../store';
-import AddCoinOptionsCrypto from './addcoinOptionsCrypto';
-import AddCoinOptionsAC from './addcoinOptionsAC';
-import AddCoinOptionsACFiat from './addcoinOptionsACFiat';
+
+import CoinSelectorsRender from './coin-selectors.render';
+import AddCoinRender from './addcoin.render';
class AddCoin extends React.Component {
constructor(props) {
@@ -249,131 +249,7 @@ class AddCoin extends React.Component {
const _coin = _item.selectedCoin || '';
items.push(
-
@@ -230,7 +208,8 @@ class SendCoin extends React.Component {
const address = this.props.ActiveCoin.addresses[type][i];
let _amount = address.amount;
- if (this.props.ActiveCoin.mode === 'basilisk') {
+ if (this.props.ActiveCoin.mode === 'basilisk' &&
+ this.props.ActiveCoin.cache) {
_amount = this.props.ActiveCoin.cache[this.props.ActiveCoin.coin][address.address] && this.props.ActiveCoin.cache[this.props.ActiveCoin.coin][address.address].getbalance.data && this.props.ActiveCoin.cache[this.props.ActiveCoin.coin][address.address].getbalance.data.balance ? this.props.ActiveCoin.cache[this.props.ActiveCoin.coin][address.address].getbalance.data.balance : 'N/A';
}
@@ -257,7 +236,8 @@ class SendCoin extends React.Component {
let _amount;
if (this.state.sendFromAmount === 0 &&
- this.props.ActiveCoin.mode === 'basilisk') {
+ this.props.ActiveCoin.mode === 'basilisk' &&
+ this.props.ActiveCoin.cache) {
_amount = this.props.ActiveCoin.cache[this.props.ActiveCoin.coin][this.state.sendFrom].getbalance.data && this.props.ActiveCoin.cache[this.props.ActiveCoin.coin][this.state.sendFrom].getbalance.data.balance ? this.props.ActiveCoin.cache[this.props.ActiveCoin.coin][this.state.sendFrom].getbalance.data.balance : 'N/A';
} else {
_amount = this.state.sendFromAmount;
@@ -318,7 +298,8 @@ class SendCoin extends React.Component {
updateAddressSelection(address, type, amount) {
let _sendFromAmount = amount ? amount : this.props.ActiveCoin.addresses[type][address].amount;
- if (this.props.ActiveCoin.mode === 'basilisk') {
+ if (this.props.ActiveCoin.mode === 'basilisk' &&
+ this.props.ActiveCoin.cache) {
_sendFromAmount = this.props.ActiveCoin.cache[this.props.ActiveCoin.coin][address].getbalance.data && this.props.ActiveCoin.cache[this.props.ActiveCoin.coin][address].getbalance.data.balance ? this.props.ActiveCoin.cache[this.props.ActiveCoin.coin][address].getbalance.data.balance : 'N/A';
}
@@ -618,70 +599,7 @@ class SendCoin extends React.Component {
}
renderSendCoinResponse() {
- if (this.props.ActiveCoin.lastSendToResponse) {
- let items = [];
- const _response = this.props.ActiveCoin.lastSendToResponse;
-
- for (let key in _response) {
- if (key !== 'tag') {
- items.push(
-
- { key }
- { this.renderKey(key) }
-
- );
- }
- }
-
- return items;
- } else {
- return (
-
-
- { translate('SEND.PROCESSING_TRANSACTION') }...
- { translate('SEND.NOTE_IT_WILL_TAKE') }.
-
-
-
- );
- }
+ return SendCoinResponseRender.call(this);
}
getOAdress() {
@@ -714,251 +632,28 @@ class SendCoin extends React.Component {
renderOASendUI() {
if (Config.openAlias) {
- return (
-
-
- Fetch OpenAlias recipient address
-
-
-
-
- Get address
-
-
-
- );
- } else {
- return null;
+ return OASendUIRender.call(this);
}
+
+ return null;
}
renderSendApiTypeSelector() {
if (this.props.ActiveCoin.mode === 'basilisk') {
- return (
-
-
-
-
-
-
-
- { translate('SEND.SEND_VIA') } (sendtoaddress API)
-
-
-
- );
- } else {
- return null;
+ return SendApiTypeSelectorRender.call(this);
}
+
+ return null;
}
render() {
if (this.props.ActiveCoin &&
this.props.ActiveCoin.send &&
this.props.ActiveCoin.mode !== 'native') {
- return (
-
-
-
-
-
1
-
-
{ translate('INDEX.FILL_SEND_FORM') }
-
{ translate('INDEX.FILL_SEND_DETAILS') }
-
-
-
-
2
-
-
{ translate('INDEX.CONFIRMING') }
-
{ translate('INDEX.CONFIRM_DETAILS') }
-
-
-
-
3
-
-
{ translate('INDEX.PROCESSING_TX') }
-
{ translate('INDEX.PROCESSING_DETAILS') }
-
-
-
-
-
-
-
- { translate('INDEX.SEND') } { this.props.ActiveCoin.coin }
-
-
-
-
-
-
-
-
-
-
-
- { translate('INDEX.TO') }
-
-
{ this.state.sendTo }
-
- { this.state.amount } { this.props.ActiveCoin.coin }
-
-
{ translate('INDEX.TX_FEE_REQ') }
-
- { this.state.fee } { this.props.ActiveCoin.coin }
-
-
-
-
-
-
- { translate('INDEX.FROM') }
-
-
{ this.props.Dashboard.activeHandle[this.props.ActiveCoin.coin] }
-
- { Number(this.state.amount) - Number(this.state.fee) } { this.props.ActiveCoin.coin }
-
-
-
-
-
-
-
-
-
-
-
{ translate('INDEX.TRANSACTION_RESULT') }
-
- { translate('SEND.YOU_PICKED_OPT') }
-
-
-
-
- { translate('INDEX.KEY') }
- { translate('INDEX.INFO') }
-
-
-
- { this.renderSendCoinResponse() }
-
-
-
-
- this.changeSendCoinStep(0) }
- disabled={ this.state.utxoMethodInProgress }>{ !this.state.utxoMethodInProgress ? translate('INDEX.MAKE_ANOTHER_TX') : translate('SEND.PLEASE_WAIT') + '...' }
-
-
-
-
-
-
- );
- } else {
- return null;
+ return SendCoinRender.call(this);
}
+
+ return null;
}
}
diff --git a/react/src/components/dashboard/sendCoin.render.js b/react/src/components/dashboard/sendCoin.render.js
new file mode 100644
index 0000000..9672a90
--- /dev/null
+++ b/react/src/components/dashboard/sendCoin.render.js
@@ -0,0 +1,336 @@
+import React from 'react';
+import { translate } from '../../translate/translate';
+import {
+ secondsElapsedToString,
+ secondsToString
+} from '../../util/time';
+
+export const UTXOCacheInfoRender = function(refreshCacheData, isReadyToUpdate, waitUntilCallIsFinished, timestamp) {
+ return (
+
+
+ { translate('SEND.TOTAL_UTXO_AVAILABLE') }: { refreshCacheData ? refreshCacheData.data && refreshCacheData.data.length : translate('SEND.PRESS_UPDATE_BTN') }
+
+ { translate('SEND.LAST_UPDATED') } @ { secondsToString(refreshCacheData ? refreshCacheData.timestamp : 0, true) } | { secondsElapsedToString(timestamp || 0) } { translate('SEND.AGO') }
+
+
{ translate('SEND.NEXT_UPDATE_IN') } { secondsElapsedToString(600 - timestamp) }s
+
+
+ { translate('SEND.PROCESSING_REQ') }: { this.state.currentStackLength } / { this.state.totalStackLength }
+
+
+
+ { waitUntilCallIsFinished ? translate('SEND.LOCKED_PLEASE_WAIT') + '...' : translate('SEND.UPDATE') }
+
+
+ );
+};
+
+export const SendCoinResponseRender = function () {
+ if (this.props.ActiveCoin.lastSendToResponse) {
+ let items = [];
+ const _response = this.props.ActiveCoin.lastSendToResponse;
+
+ for (let key in _response) {
+ if (key !== 'tag') {
+ items.push(
+
+ { key }
+ { this.renderKey(key) }
+
+ );
+ }
+ }
+
+ return items;
+ } else {
+ return (
+
+
+ { translate('SEND.PROCESSING_TRANSACTION') }...
+ { translate('SEND.NOTE_IT_WILL_TAKE') }.
+
+
+
+ );
+ }
+}
+
+export const OASendUIRender = function () {
+ return (
+
+
+ Fetch OpenAlias recipient address
+
+
+
+
+ Get address
+
+
+
+ );
+};
+
+export const SendApiTypeSelectorRender = function () {
+ return (
+
+
+
+
+
+
+
+ { translate('SEND.SEND_VIA') } (sendtoaddress API)
+
+
+
+ );
+};
+
+export const SendCoinRender = function () {
+ return (
+
+
+
+
+
1
+
+
{ translate('INDEX.FILL_SEND_FORM') }
+
{ translate('INDEX.FILL_SEND_DETAILS') }
+
+
+
+
2
+
+
{ translate('INDEX.CONFIRMING') }
+
{ translate('INDEX.CONFIRM_DETAILS') }
+
+
+
+
3
+
+
{ translate('INDEX.PROCESSING_TX') }
+
{ translate('INDEX.PROCESSING_DETAILS') }
+
+
+
+
+
+
+
+ { translate('INDEX.SEND') } { this.props.ActiveCoin.coin }
+
+
+
+
+
+
+
+
+
+
+
+ { translate('INDEX.TO') }
+
+
{ this.state.sendTo }
+
+ { this.state.amount } { this.props.ActiveCoin.coin }
+
+
{ translate('INDEX.TX_FEE_REQ') }
+
+ { this.state.fee } { this.props.ActiveCoin.coin }
+
+
+
+
+
+
+ { translate('INDEX.FROM') }
+
+
{ this.props.Dashboard.activeHandle[this.props.ActiveCoin.coin] }
+
+ { Number(this.state.amount) - Number(this.state.fee) } { this.props.ActiveCoin.coin }
+
+
+
+
+
+
+
+
+
+
+
{ translate('INDEX.TRANSACTION_RESULT') }
+
+ { translate('SEND.YOU_PICKED_OPT') }
+
+
+
+
+ { translate('INDEX.KEY') }
+ { translate('INDEX.INFO') }
+
+
+
+ { this.renderSendCoinResponse() }
+
+
+
+
+ this.changeSendCoinStep(0) }
+ disabled={ this.state.utxoMethodInProgress }>{ !this.state.utxoMethodInProgress ? translate('INDEX.MAKE_ANOTHER_TX') : translate('SEND.PLEASE_WAIT') + '...' }
+
+
+
+
+
+
+ );
+};
\ No newline at end of file
diff --git a/react/src/components/dashboard/settings.js b/react/src/components/dashboard/settings.js
index 98e8f9a..93742a8 100644
--- a/react/src/components/dashboard/settings.js
+++ b/react/src/components/dashboard/settings.js
@@ -14,9 +14,11 @@ import {
shepherdCli
} from '../../actions/actionCreators';
import Store from '../../store';
-import AddCoinOptionsCrypto from '../addcoin/addcoinOptionsCrypto';
-import AddCoinOptionsAC from '../addcoin/addcoinOptionsAC';
-import AddCoinOptionsACFiat from '../addcoin/addcoinOptionsACFiat';
+
+import {
+ AppInfoTabRender,
+ SettingsRender
+} from './settings.render';
/*
TODO:
@@ -132,87 +134,10 @@ class Settings extends React.Component {
const releaseInfo = this.props.Settings.appInfo && this.props.Settings.appInfo.releaseInfo;
if (releaseInfo) {
- return (
-
this.openTab('AppInfo', 8) }>
-
-
-
-
-
-
{ translate('SETTINGS.APP_RELEASE') }
-
- { translate('SETTINGS.NAME') }: { this.props.Settings.appInfo.releaseInfo.name }
-
-
- { translate('SETTINGS.VERSION') }: { this.props.Settings.appInfo.releaseInfo.version }
-
-
- { translate('SETTINGS.APP_SESSION') }: { this.props.Settings.appInfo.appSession }
-
-
-
-
-
-
{ translate('SETTINGS.SYS_INFO') }
-
- { translate('SETTINGS.ARCH') }: { this.props.Settings.appInfo.sysInfo.arch }
-
-
- { translate('SETTINGS.OS_TYPE') }: { this.props.Settings.appInfo.sysInfo.os_type }
-
-
- { translate('SETTINGS.OS_PLATFORM') }: { this.props.Settings.appInfo.sysInfo.platform }
-
-
- { translate('SETTINGS.OS_RELEASE') }: { this.props.Settings.appInfo.sysInfo.os_release }
-
-
- { translate('SETTINGS.CPU') }: { this.props.Settings.appInfo.sysInfo.cpu }
-
-
- { translate('SETTINGS.CPU_CORES') }: { this.props.Settings.appInfo.sysInfo.cpu_cores }
-
-
- { translate('SETTINGS.MEM') }: { this.props.Settings.appInfo.sysInfo.totalmem_readable }
-
-
-
-
-
-
{ translate('SETTINGS.LOCATIONS') }
-
- { translate('SETTINGS.CACHE') }: { this.props.Settings.appInfo.dirs.cacheLocation }
-
-
- { translate('SETTINGS.CONFIG') }: { this.props.Settings.appInfo.dirs.configLocation }
-
-
- Iguana { translate('SETTINGS.BIN') }: { this.props.Settings.appInfo.dirs.iguanaBin }
-
-
- Iguana { translate('SETTINGS.DIR') }: { this.props.Settings.appInfo.dirs.iguanaDir }
-
-
- Komodo { translate('SETTINGS.BIN') }: { this.props.Settings.appInfo.dirs.komododBin }
-
-
- Komodo { translate('SETTINGS.DIR') }: { this.props.Settings.appInfo.dirs.komodoDir }
-
-
-
-
-
-
- );
- } else {
- return null;
+ return AppInfoTabRender.call(this);
}
+
+ return null;
}
renderSNPeersList() {
@@ -407,453 +332,7 @@ class Settings extends React.Component {
}
render() {
- return (
-
-
-
-
-
-
-
{ translate('INDEX.WALLET_SETTINGS') }
-
-
this.openTab('WalletInfo', 0) }>
-
-
-
-
-
-
- { translate('INDEX.KEY') }
- { translate('INDEX.VALUE') }
-
-
-
-
- pubkey
- { this.props.Main.activeHandle.pubkey }
-
-
- btcpubkey
- { this.props.Main.activeHandle.btcpubkey }
-
-
- rmd160
- { this.props.Main.activeHandle.rmd160 }
-
-
- NXT
- { this.props.Main.activeHandle.NXT }
-
-
- notary
- { this.props.Main.activeHandle.notary }
-
-
- status
- { this.props.Main.activeHandle.status }
-
-
-
-
-
-
-
-
this.openTab('AddNodeforCoin', 1) }>
-
-
-
-
-
-
-
{ translate('INDEX.USE_THIS_SECTION') }
-
-
-
-
- { translate('INDEX.SELECT_COIN') }
-
-
-
-
-
-
-
- { translate('INDEX.CHECK_NODES') }
-
-
-
- SuperNET Peers:
-
-
{ this.renderSNPeersList() }
-
- Raw Peers:
-
-
{ this.renderPeersList() }
-
-
-
-
-
-
{ translate('INDEX.USE_THIS_SECTION_PEER') }
-
-
-
-
- { translate('INDEX.SELECT_COIN') }
-
-
-
-
-
-
-
-
-
-
- { translate('INDEX.ADD_NODE') }
-
-
-
-
-
-
-
-
this.openTab('DumpWallet', 2) }>
-
-
-
Wallet Backup section to be updated soon.
-
-
-
-
this.openTab('FiatCurrencySettings', 3) }>
-
-
-
Fiat currency settings section to be updated soon.
-
-
-
-
this.openTab('ExportKeys', 4) }>
-
-
-
-
-
{ this.renderLB('INDEX.ONLY_ACTIVE_WIF_KEYS') }
-
- { translate('INDEX.PLEASE_KEEP_KEYS_SAFE') }
-
-
-
-
-
-
-
-
-
-
- { this.props.ActiveCoin.coin }
-
- { this.props.Settings.address }
-
-
-
- { this.props.ActiveCoin.coin }Wif
-
- { this.props.Settings.wifkey }
-
-
-
-
-
-
-
-
-
this.openTab('ImportKeys', 5) }>
-
-
-
-
-
{ translate('INDEX.IMPORT_KEYS_DESC_P1') }
-
{ translate('INDEX.IMPORT_KEYS_DESC_P2') }
-
{ translate('INDEX.IMPORT_KEYS_DESC_P3') }
-
- { translate('INDEX.PLEASE_KEEP_KEYS_SAFE') }
-
-
-
-
-
-
-
-
-
this.openTab('DebugLog', 6) }>
-
-
-
-
{ translate('INDEX.DEBUG_LOG_DESC') }
-
-
-
-
-
-
-
this.openTab('AppSettings', 7) }>
-
-
-
-
- { translate('SETTINGS.CONFIG_RESTART_REQUIRED') }
-
-
-
-
- { this.renderConfigEditForm() }
-
-
-
-
- { translate('SETTINGS.SAVE_APP_CONFIG') }
-
-
-
-
- { this.renderAppInfoTab() }
-
-
this.openTab('Cli', 9) }>
-
-
-
-
Select a coin and type in CLI compatible command
-
-
-
-
-
-
-
-
-
-
-
-
- );
+ return SettingsRender.call(this);
}
}
diff --git a/react/src/components/dashboard/settings.render.js b/react/src/components/dashboard/settings.render.js
new file mode 100644
index 0000000..a24fb37
--- /dev/null
+++ b/react/src/components/dashboard/settings.render.js
@@ -0,0 +1,534 @@
+import React from 'react';
+import { translate } from '../../translate/translate';
+import AddCoinOptionsCrypto from '../addcoin/addcoinOptionsCrypto';
+import AddCoinOptionsAC from '../addcoin/addcoinOptionsAC';
+import AddCoinOptionsACFiat from '../addcoin/addcoinOptionsACFiat';
+
+export const AppInfoTabRender = function() {
+ return (
+
this.openTab('AppInfo', 8) }>
+
+
+
+
+
+
{ translate('SETTINGS.APP_RELEASE') }
+
+ { translate('SETTINGS.NAME') }: { this.props.Settings.appInfo.releaseInfo.name }
+
+
+ { translate('SETTINGS.VERSION') }: { this.props.Settings.appInfo.releaseInfo.version }
+
+
+ { translate('SETTINGS.APP_SESSION') }: { this.props.Settings.appInfo.appSession }
+
+
+
+
+
+
{ translate('SETTINGS.SYS_INFO') }
+
+ { translate('SETTINGS.ARCH') }: { this.props.Settings.appInfo.sysInfo.arch }
+
+
+ { translate('SETTINGS.OS_TYPE') }: { this.props.Settings.appInfo.sysInfo.os_type }
+
+
+ { translate('SETTINGS.OS_PLATFORM') }: { this.props.Settings.appInfo.sysInfo.platform }
+
+
+ { translate('SETTINGS.OS_RELEASE') }: { this.props.Settings.appInfo.sysInfo.os_release }
+
+
+ { translate('SETTINGS.CPU') }: { this.props.Settings.appInfo.sysInfo.cpu }
+
+
+ { translate('SETTINGS.CPU_CORES') }: { this.props.Settings.appInfo.sysInfo.cpu_cores }
+
+
+ { translate('SETTINGS.MEM') }: { this.props.Settings.appInfo.sysInfo.totalmem_readable }
+
+
+
+
+
+
{ translate('SETTINGS.LOCATIONS') }
+
+ { translate('SETTINGS.CACHE') }: { this.props.Settings.appInfo.dirs.cacheLocation }
+
+
+ { translate('SETTINGS.CONFIG') }: { this.props.Settings.appInfo.dirs.configLocation }
+
+
+ Iguana { translate('SETTINGS.BIN') }: { this.props.Settings.appInfo.dirs.iguanaBin }
+
+
+ Iguana { translate('SETTINGS.DIR') }: { this.props.Settings.appInfo.dirs.iguanaDir }
+
+
+ Komodo { translate('SETTINGS.BIN') }: { this.props.Settings.appInfo.dirs.komododBin }
+
+
+ Komodo { translate('SETTINGS.DIR') }: { this.props.Settings.appInfo.dirs.komodoDir }
+
+
+
+
+
+
+ );
+};
+
+export const SettingsRender = function() {
+ return (
+
+
+
+
+
+
+
{ translate('INDEX.WALLET_SETTINGS') }
+
+
this.openTab('WalletInfo', 0) }>
+
+
+
+
+
+
+ { translate('INDEX.KEY') }
+ { translate('INDEX.VALUE') }
+
+
+
+
+ pubkey
+ { this.props.Main.activeHandle.pubkey }
+
+
+ btcpubkey
+ { this.props.Main.activeHandle.btcpubkey }
+
+
+ rmd160
+ { this.props.Main.activeHandle.rmd160 }
+
+
+ NXT
+ { this.props.Main.activeHandle.NXT }
+
+
+ notary
+ { this.props.Main.activeHandle.notary }
+
+
+ status
+ { this.props.Main.activeHandle.status }
+
+
+
+
+
+
+
+
this.openTab('AddNodeforCoin', 1) }>
+
+
+
+
+
+
+
{ translate('INDEX.USE_THIS_SECTION') }
+
+
+
+
+ { translate('INDEX.SELECT_COIN') }
+
+
+
+
+
+
+
+ { translate('INDEX.CHECK_NODES') }
+
+
+
+ SuperNET Peers:
+
+
{ this.renderSNPeersList() }
+
+ Raw Peers:
+
+
{ this.renderPeersList() }
+
+
+
+
+
+
{ translate('INDEX.USE_THIS_SECTION_PEER') }
+
+
+
+
+ { translate('INDEX.SELECT_COIN') }
+
+
+
+
+
+
+
+
+
+
+ { translate('INDEX.ADD_NODE') }
+
+
+
+
+
+
+
+
this.openTab('DumpWallet', 2) }>
+
+
+
Wallet Backup section to be updated soon.
+
+
+
+
this.openTab('FiatCurrencySettings', 3) }>
+
+
+
Fiat currency settings section to be updated soon.
+
+
+
+
this.openTab('ExportKeys', 4) }>
+
+
+
+
+
{ this.renderLB('INDEX.ONLY_ACTIVE_WIF_KEYS') }
+
+ { translate('INDEX.PLEASE_KEEP_KEYS_SAFE') }
+
+
+
+
+
+
+ { translate('INDEX.PASSPHRASE') }
+
+
+ { translate('INDEX.GET_WIF_KEYS') }
+
+
+
+
+
+
+
+
+ { this.props.ActiveCoin.coin }
+
+ { this.props.Settings.address }
+
+
+
+ { this.props.ActiveCoin.coin }Wif
+
+ { this.props.Settings.wifkey }
+
+
+
+
+
+
+
+
+
this.openTab('ImportKeys', 5) }>
+
+
+
+
+
{ translate('INDEX.IMPORT_KEYS_DESC_P1') }
+
{ translate('INDEX.IMPORT_KEYS_DESC_P2') }
+
{ translate('INDEX.IMPORT_KEYS_DESC_P3') }
+
+ { translate('INDEX.PLEASE_KEEP_KEYS_SAFE') }
+
+
+
+
+
+
+ { translate('INDEX.INPUT_PRIV_KEY') }
+
+
+ { translate('INDEX.IMPORT_PRIV_KEY') }
+
+
+
+
+
+
+
this.openTab('DebugLog', 6) }>
+
+
+
+
{ translate('INDEX.DEBUG_LOG_DESC') }
+
+
+
+
+ { translate('INDEX.DEBUG_LOG_LINES') }
+
+
+
+ Iguana
+ Komodo
+
+ { translate('INDEX.TARGET') }
+
+
+ { translate('INDEX.LOAD_DEBUG_LOG') }
+
+
+
{ this.renderDebugLogData() }
+
+
+
+
+
+
+
this.openTab('AppSettings', 7) }>
+
+
+
+
+ { translate('SETTINGS.CONFIG_RESTART_REQUIRED') }
+
+
+
+
+ { this.renderConfigEditForm() }
+
+
+
+
+ { translate('SETTINGS.SAVE_APP_CONFIG') }
+
+
+
+
+ { this.renderAppInfoTab() }
+
+
this.openTab('Cli', 9) }>
+
+
+
+
Select a coin and type in CLI compatible command
+
+
+
+
+ Select coin
+ { this.renderActiveCoinsList('native') }
+
+ Coin
+
+
+
+ Type in CLI compatible cmd
+
+
+ this.execCliCmd() }>Execute
+
+
+
+ { this.renderCliResponse() }
+
+
+
+
+
+
+
+
+
+
+
+
+
+ );
+};
\ No newline at end of file
diff --git a/react/src/components/dashboard/syncOnly.js b/react/src/components/dashboard/syncOnly.js
index 970e6f9..6afe42a 100644
--- a/react/src/components/dashboard/syncOnly.js
+++ b/react/src/components/dashboard/syncOnly.js
@@ -1,5 +1,4 @@
import React from 'react';
-import { translate } from '../../translate/translate';
import { getCoinTitle } from '../../util/coinHelper';
import {
stopInterval,
@@ -10,6 +9,12 @@ import {
} from '../../actions/actionCreators';
import Store from '../../store';
+import {
+ ProgressRender,
+ ForkItemRender,
+ SyncOnlyRender
+} from './syncOnly.render';
+
class SyncOnly extends React.Component {
constructor(props) {
super(props);
@@ -92,46 +97,7 @@ class SyncOnly extends React.Component {
}
renderProgress(fork) {
- return (
-
-
-
-
- { translate('INDEX.BUNDLES') } ({ fork.coin }) 100.00% - ( { fork.blocks } / { fork.blocks } ) ==>> RT{ fork.RTheight }
-
-
- { translate('INDEX.BUNDLES') } { fork.bundles }%
-
-
-
-
-
-
- utxo { fork.utxo }%
-
-
-
-
- { translate('INDEX.BALANCES') } { fork.balances }%
-
-
-
-
- { translate('INDEX.VALIDATED') } { fork.validated }%
-
-
-
-
- );
+ return ProgressRender.call(this, fork);
}
renderForksList() {
@@ -144,31 +110,7 @@ class SyncOnly extends React.Component {
forkInfo.registry &&
forkInfo.getinfo) {
items.push(
-
-
-
-
Full
-
{ this.renderCoinName(forkInfo.registry.coin).name } ({ forkInfo.registry.coin.toUpperCase() })
-
- this._stopIguanaFork(forkInfo.registry.pmid) }>
- { translate('INDEX.STOP') }
-
- this._restartIguanaFork(forkInfo.registry.coin.toUpperCase(), forkInfo.registry.pmid, port) }>
- { translate('INDEX.RESTART') }
-
-
-
-
- { this.renderProgress(forkInfo.getinfo) }
-
-
+ ForkItemRender.call(this, forkInfo, port)
);
}
}
@@ -185,26 +127,7 @@ class SyncOnly extends React.Component {
render() {
if (this.props &&
this.props.SyncOnly.display) {
- return (
-
-
-
-
-
- { this.renderForksList() }
-
-
- { translate('INDEX.CLOSE') }
-
-
-
-
-
-
- );
+ return SyncOnlyRender.call(this);
} else {
return null;
}
diff --git a/react/src/components/dashboard/syncOnly.render.js b/react/src/components/dashboard/syncOnly.render.js
new file mode 100644
index 0000000..5183c35
--- /dev/null
+++ b/react/src/components/dashboard/syncOnly.render.js
@@ -0,0 +1,98 @@
+import React from 'react';
+import { translate } from '../../translate/translate';
+
+export const ProgressRender = function (fork) {
+ return (
+
+
+
+
+ { translate('INDEX.BUNDLES') } ({ fork.coin }) 100.00% - ( { fork.blocks } / { fork.blocks } ) ==>> RT{ fork.RTheight }
+
+
+ { translate('INDEX.BUNDLES') } { fork.bundles }%
+
+
+
+
+
+
+ utxo { fork.utxo }%
+
+
+
+
+ { translate('INDEX.BALANCES') } { fork.balances }%
+
+
+
+
+ { translate('INDEX.VALIDATED') } { fork.validated }%
+
+
+
+
+ );
+};
+
+export const ForkItemRender = function (forkInfo, port) {
+ return (
+
+
+
+
Full
+
{ this.renderCoinName(forkInfo.registry.coin).name } ({ forkInfo.registry.coin.toUpperCase() })
+
+ this._stopIguanaFork(forkInfo.registry.pmid) }>
+ { translate('INDEX.STOP') }
+
+ this._restartIguanaFork(forkInfo.registry.coin.toUpperCase(), forkInfo.registry.pmid, port) }>
+ { translate('INDEX.RESTART') }
+
+
+
+
+ { this.renderProgress(forkInfo.getinfo) }
+
+
+ );
+};
+
+export const SyncOnlyRender = function() {
+ return (
+
+
+
+
+
+ { this.renderForksList() }
+
+
+ { translate('INDEX.CLOSE') }
+
+
+
+
+
+
+ );
+};
\ No newline at end of file
diff --git a/react/src/components/dashboard/walletsBalance.js b/react/src/components/dashboard/walletsBalance.js
index 1c48218..4603765 100755
--- a/react/src/components/dashboard/walletsBalance.js
+++ b/react/src/components/dashboard/walletsBalance.js
@@ -1,6 +1,8 @@
import React from 'react';
import { translate } from '../../translate/translate';
+import WalletsBalanceRender from './walletsBalance.render';
+
class WalletsBalance extends React.Component {
constructor(props) {
super(props);
@@ -94,87 +96,10 @@ class WalletsBalance extends React.Component {
this.props.ActiveCoin.mode !== 'native' &&
!this.props.ActiveCoin.send &&
!this.props.ActiveCoin.receive) {
- return (
-
- );
- } else {
- return null;
+ return WalletsBalanceRender.call(this);
}
+
+ return null;
}
}
diff --git a/react/src/components/dashboard/walletsBalance.render.js b/react/src/components/dashboard/walletsBalance.render.js
new file mode 100644
index 0000000..205c77c
--- /dev/null
+++ b/react/src/components/dashboard/walletsBalance.render.js
@@ -0,0 +1,85 @@
+import React from 'react';
+import { translate } from '../../translate/translate';
+
+const WalletsBalanceRender = function() {
+ return (
+
+ );
+};
+
+export default WalletsBalanceRender;
\ No newline at end of file
diff --git a/react/src/components/dashboard/walletsBasiliskConnection.js b/react/src/components/dashboard/walletsBasiliskConnection.js
index 3e9b2d8..402867d 100755
--- a/react/src/components/dashboard/walletsBasiliskConnection.js
+++ b/react/src/components/dashboard/walletsBasiliskConnection.js
@@ -1,7 +1,7 @@
import React from 'react';
-import { translate } from '../../translate/translate';
import { basiliskConnection } from '../../actions/actionCreators';
import Store from '../../store';
+import WalletsBasiliskConnectionRender from './walletsBasiliskConnection.render';
class WalletsBasiliskConnection extends React.Component {
constructor(props) {
@@ -26,75 +26,7 @@ class WalletsBasiliskConnection extends React.Component {
render() {
if (this.isBasiliskConnection()) {
- return (
-
this.handleKeydown(event) }>
-
-
-
-
-
- { translate('INDEX.REFRESHING_BASILISK_NET') }...
-
-
- ×
- { translate('INDEX.CLOSE') }
-
-
-
-
-
- { `${translate('IAPI.CON_STATUS')}... ${this.props.Dashboard.connectedNotaries.current}/${this.props.Dashboard.connectedNotaries.total}:${this.props.Dashboard.connectedNotaries.currentNodeName}` } { Math.floor(this.props.Dashboard.connectedNotaries.current * 100 / this.props.Dashboard.connectedNotaries.total) }%
-
-
-
- { this.props.Dashboard.connectedNotaries.failedToConnectNodes ? `Failed: ${this.props.Dashboard.connectedNotaries.failedToConnectNodes}` : null }
-
-
-
-
-
-
-
- );
+ return WalletsBasiliskConnectionRender.call(this);
} else {
return null;
}
diff --git a/react/src/components/dashboard/walletsBasiliskConnection.render.js b/react/src/components/dashboard/walletsBasiliskConnection.render.js
new file mode 100644
index 0000000..0e4d65a
--- /dev/null
+++ b/react/src/components/dashboard/walletsBasiliskConnection.render.js
@@ -0,0 +1,76 @@
+import React from 'react';
+import { translate } from '../../translate/translate';
+
+const WalletsBasiliskConnectionRender = function() {
+ return (
+
this.handleKeydown(event) }>
+
+
+
+
+
+ { translate('INDEX.REFRESHING_BASILISK_NET') }...
+
+
+ ×
+ { translate('INDEX.CLOSE') }
+
+
+
+
+
+ { `${translate('IAPI.CON_STATUS')}... ${this.props.Dashboard.connectedNotaries.current}/${this.props.Dashboard.connectedNotaries.total}:${this.props.Dashboard.connectedNotaries.currentNodeName}` } { Math.floor(this.props.Dashboard.connectedNotaries.current * 100 / this.props.Dashboard.connectedNotaries.total) }%
+
+
+
+ { this.props.Dashboard.connectedNotaries.failedToConnectNodes ? `Failed: ${this.props.Dashboard.connectedNotaries.failedToConnectNodes}` : null }
+
+
+
+
+
+
+
+ );
+};
+
+export default WalletsBasiliskConnectionRender;
\ No newline at end of file
diff --git a/react/src/components/dashboard/walletsBasiliskRefresh.js b/react/src/components/dashboard/walletsBasiliskRefresh.js
index d768d76..c55f903 100644
--- a/react/src/components/dashboard/walletsBasiliskRefresh.js
+++ b/react/src/components/dashboard/walletsBasiliskRefresh.js
@@ -1,5 +1,5 @@
import React from 'react';
-import { translate } from '../../translate/translate';
+import WalletsBasiliskRefreshRender from './walletsBasiliskRefresh.render';
class WalletsBasiliskRefresh extends React.Component {
isBasiliskRefresh() {
@@ -9,40 +9,10 @@ class WalletsBasiliskRefresh extends React.Component {
render() {
if (this.isBasiliskRefresh()) {
- return (
-
-
-
-
-
-
{ translate('INDEX.FETCHING_BASILISK_DATA') }
-
-
-
-
-
-
- { translate('INDEX.ADDRESS') }
- { translate('INDEX.LIST_UNSPENT') }
- { translate('INDEX.LIST_TRANSACTIONS') }
- { translate('INDEX.GET_BALANCE') }
- { translate('INDEX.REFRESH') }
-
-
-
-
-
-
-
-
-
-
- );
- } else {
- return null;
+ return WalletsBasiliskRefreshRender.call(this);
}
+
+ return null;
}
}
diff --git a/react/src/components/dashboard/walletsBasiliskRefresh.render.js b/react/src/components/dashboard/walletsBasiliskRefresh.render.js
new file mode 100644
index 0000000..2e03d19
--- /dev/null
+++ b/react/src/components/dashboard/walletsBasiliskRefresh.render.js
@@ -0,0 +1,36 @@
+import React from 'react';
+import { translate } from '../../translate/translate';
+
+const WalletsBasiliskRefreshRender = function() {
+ return (
+
+
+
+
+
+
{ translate('INDEX.FETCHING_BASILISK_DATA') }
+
+
+
+
+
+
+ { translate('INDEX.ADDRESS') }
+ { translate('INDEX.LIST_UNSPENT') }
+ { translate('INDEX.LIST_TRANSACTIONS') }
+ { translate('INDEX.GET_BALANCE') }
+ { translate('INDEX.REFRESH') }
+
+
+
+
+
+
+
+
+ );
+};
+
+export default WalletsBasiliskRefreshRender;
\ No newline at end of file
diff --git a/react/src/components/dashboard/walletsCacheData.js b/react/src/components/dashboard/walletsCacheData.js
index 98ca732..8088771 100644
--- a/react/src/components/dashboard/walletsCacheData.js
+++ b/react/src/components/dashboard/walletsCacheData.js
@@ -1,10 +1,9 @@
import React from 'react';
-import { translate } from '../../translate/translate';
import { secondsToString } from '../../util/time';
import { toggleViewCacheModal } from '../../actions/actionCreators';
import Store from '../../store';
-import Tree, { TreeNode } from 'rc-tree';
-import { animation } from '../../util/rc-tree-animate';
+import { TreeNode } from 'rc-tree';
+import WalletsCacheDataRender from './walletsCacheData.render';
// TODO: refresh data render
@@ -160,37 +159,7 @@ class WalletsCacheData extends React.Component {
this.props.ActiveCoin.mode === 'basilisk' &&
this.props.Dashboard.displayViewCacheModal) {
- return (
-
-
-
-
-
-
-
-
-
- { this.renderNotariesFetching() }
-
- { this.renderCoinRootNodes() }
-
-
-
-
-
-
-
- { translate('INDEX.CLOSE') }
-
-
-
-
-
-
- );
+ return WalletsCacheDataRender.call(this);
} else {
return null;
}
diff --git a/react/src/components/dashboard/walletsCacheData.render.js b/react/src/components/dashboard/walletsCacheData.render.js
new file mode 100644
index 0000000..e912448
--- /dev/null
+++ b/react/src/components/dashboard/walletsCacheData.render.js
@@ -0,0 +1,40 @@
+import React from 'react';
+import { translate } from '../../translate/translate';
+import { animation } from '../../util/rc-tree-animate';
+import { TreeNode } from 'rc-tree';
+
+const WalletsCacheDataRender = function() {
+ return (
+
+
+
+
+
+
+
+
+
+ { this.renderNotariesFetching() }
+
+ { this.renderCoinRootNodes() }
+
+
+
+
+
+
+
+ { translate('INDEX.CLOSE') }
+
+
+
+
+
+
+ );
+};
+
+export default WalletsCacheDataRender;
\ No newline at end of file
diff --git a/react/src/components/dashboard/walletsData.js b/react/src/components/dashboard/walletsData.js
index e775326..5274360 100644
--- a/react/src/components/dashboard/walletsData.js
+++ b/react/src/components/dashboard/walletsData.js
@@ -1,7 +1,6 @@
import React from 'react';
import Config from '../../config';
import { translate } from '../../translate/translate';
-import { secondsToString } from '../../util/time';
import { sortByDate } from '../../util/sort';
import {
basiliskRefresh,
@@ -20,11 +19,15 @@ import {
fetchUtxoCache
} from '../../actions/actionCreators';
import Store from '../../store';
-
-import WalletsBasiliskRefresh from './walletsBasiliskRefresh';
-import WalletsBasiliskConnection from './walletsBasiliskConnection';
-import WalletsNotariesList from './walletsNotariesList';
-import WalletsCacheData from './walletsCacheData';
+import {
+ PaginationItemRender,
+ PaginationItemsPerPageSelectorRender,
+ PaginationRender,
+ TxHistoryListRender,
+ UseCacheToggleRender,
+ AddressListRender,
+ WalletsDataRender
+} from './walletsData.render';
import { SocketProvider } from 'socket.io-react';
import io from 'socket.io-client';
@@ -249,13 +252,7 @@ class WalletsData extends React.Component {
for (let i=0; i < Math.ceil(this.props.ActiveCoin.txhistory.length / this.state.itemsPerPage); i++) {
items.push(
-
- this.updateCurrentPage(i + 1) : null }>{ i + 1 }
-
+ PaginationItemRender.call(this, i)
);
}
@@ -266,23 +263,7 @@ class WalletsData extends React.Component {
if (this.props.ActiveCoin.txhistory &&
this.state.itemsList !== 'loading' &&
this.props.ActiveCoin.txhistory.length > 10) {
- return (
-
-
- { translate('INDEX.SHOW') }
-
- 10
- 25
- 50
- 100
-
- { translate('INDEX.ENTRIES_SM') }
-
-
- );
+ return PaginationItemsPerPageSelectorRender.call(this);
} else {
return null;
}
@@ -295,26 +276,7 @@ class WalletsData extends React.Component {
const _paginationFrom = ((this.state.activePage - 1) * this.state.itemsPerPage) + 1;
const _paginationTo = this.state.activePage * this.state.itemsPerPage;
- return (
-
-
-
{ translate('INDEX.SHOWING') } { _paginationFrom } { translate('INDEX.TO_ALT') } { _paginationTo } { translate('INDEX.OF') } { this.props.ActiveCoin.txhistory.length } { translate('INDEX.ENTRIES_SM') }
-
-
-
- );
+ return PaginationRender.call(this, _paginationFrom, _paginationTo);
} else {
return null;
}
@@ -374,21 +336,7 @@ class WalletsData extends React.Component {
this.state.itemsList.length &&
this.state.itemsList !== 'no data') {
return this.state.itemsList.map((tx, index) =>
-
- { this.renderTxType(tx.category || tx.type) }
- { tx.confirmations }
- { tx.amount || translate('DASHBOARD.UNKNOWN') }
- { secondsToString(tx.blocktime || tx.timestamp) }
- { tx.address }
-
- this.toggleTxInfoModal(!this.props.ActiveCoin.showTransactionInfo, index) }>
-
-
-
-
+ TxHistoryListRender.call(this, tx, index)
);
}
}
@@ -451,17 +399,10 @@ class WalletsData extends React.Component {
// deprecated
renderUseCacheToggle() {
if (this.props.ActiveCoin.mode === 'basilisk') {
- return (
-
- );
- } else {
- return null;
+ return UseCacheToggleRender.call(this);
}
+
+ return null;
}
renderAddressByType(type) {
@@ -535,28 +476,7 @@ class WalletsData extends React.Component {
this.props.Dashboard.activeHandle &&
this.props.Dashboard.activeHandle[this.props.ActiveCoin.coin] &&
this.props.ActiveCoin.mode === 'basilisk') {
- return (
-
-
- { this.renderSelectorCurrentLabel() }
-
-
-
-
-
-
- );
+ return AddressListRender.call(this);
} else {
return null;
}
@@ -569,130 +489,7 @@ class WalletsData extends React.Component {
this.props.ActiveCoin.mode !== 'native' &&
!this.props.ActiveCoin.send &&
!this.props.ActiveCoin.receive) {
- return (
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- { translate('SEND.PROCESSING_REQ') }: { this.state.currentStackLength } / { this.state.totalStackLength }
-
-
-
-
- { translate('INDEX.TRANSACTION_HISTORY') }
-
-
-
-
- { this.renderAddressList() }
-
- { this.renderUseCacheToggle }
-
-
-
- { this.renderPaginationItemsPerPageSelector() }
-
-
-
-
- { translate('INDEX.SEARCH') }:
-
-
-
-
-
-
-
-
- { translate('INDEX.DIRECTION') }
- { translate('INDEX.CONFIRMATIONS') }
- { translate('INDEX.AMOUNT') }
- { translate('INDEX.TIME') }
- { translate('INDEX.DEST_ADDRESS') }
- { translate('INDEX.TX_DETAIL') }
-
-
-
- { this.renderTxHistoryList() }
-
-
-
- { translate('INDEX.DIRECTION') }
- { translate('INDEX.CONFIRMATIONS') }
- { translate('INDEX.AMOUNT') }
- { translate('INDEX.TIME') }
- { translate('INDEX.DEST_ADDRESS') }
- { translate('INDEX.TX_DETAIL') }
-
-
-
-
- { this.renderPagination() }
-
-
-
-
-
-
-
-
- );
+ return WalletsDataRender.call(this);
} else {
return null;
}
diff --git a/react/src/components/dashboard/walletsData.render.js b/react/src/components/dashboard/walletsData.render.js
new file mode 100644
index 0000000..0a8a7c4
--- /dev/null
+++ b/react/src/components/dashboard/walletsData.render.js
@@ -0,0 +1,245 @@
+import React from 'react';
+import { translate } from '../../translate/translate';
+import WalletsBasiliskRefresh from './walletsBasiliskRefresh';
+import WalletsBasiliskConnection from './walletsBasiliskConnection';
+import WalletsNotariesList from './walletsNotariesList';
+import WalletsCacheData from './walletsCacheData';
+import { secondsToString } from '../../util/time';
+
+export const PaginationItemRender = function(i) {
+ return (
+
+ this.updateCurrentPage(i + 1) : null }>{ i + 1 }
+
+ );
+};
+
+export const PaginationItemsPerPageSelectorRender = function() {
+ return (
+
+
+ { translate('INDEX.SHOW') }
+
+ 10
+ 25
+ 50
+ 100
+
+ { translate('INDEX.ENTRIES_SM') }
+
+
+ );
+};
+
+export const PaginationRender = function(paginationFrom, paginationTo) {
+ return (
+
+
+
{ translate('INDEX.SHOWING') } { paginationFrom } { translate('INDEX.TO_ALT') } { paginationTo } { translate('INDEX.OF') } { this.props.ActiveCoin.txhistory.length } { translate('INDEX.ENTRIES_SM') }
+
+
+
+ );
+};
+
+export const TxHistoryListRender = function(tx, index) {
+ return (
+
+ { this.renderTxType(tx.category || tx.type) }
+ { tx.confirmations }
+ { tx.amount || translate('DASHBOARD.UNKNOWN') }
+ { secondsToString(tx.blocktime || tx.timestamp) }
+ { tx.address }
+
+ this.toggleTxInfoModal(!this.props.ActiveCoin.showTransactionInfo, index) }>
+
+
+
+
+ );
+};
+
+export const UseCacheToggleRender = function() {
+ return (
+
+ );
+};
+
+export const AddressListRender = function() {
+ return (
+
+
+ { this.renderSelectorCurrentLabel() }
+
+
+
+
+
+
+ );
+};
+
+export const WalletsDataRender = function() {
+ return (
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ { translate('SEND.PROCESSING_REQ') }: { this.state.currentStackLength } / { this.state.totalStackLength }
+
+
+
+
+ { translate('INDEX.TRANSACTION_HISTORY') }
+
+
+
+
+ { this.renderAddressList() }
+
+ { this.renderUseCacheToggle }
+
+
+
+ { this.renderPaginationItemsPerPageSelector() }
+
+
+
+
+ { translate('INDEX.SEARCH') }:
+
+
+
+
+
+
+
+
+ { translate('INDEX.DIRECTION') }
+ { translate('INDEX.CONFIRMATIONS') }
+ { translate('INDEX.AMOUNT') }
+ { translate('INDEX.TIME') }
+ { translate('INDEX.DEST_ADDRESS') }
+ { translate('INDEX.TX_DETAIL') }
+
+
+
+ { this.renderTxHistoryList() }
+
+
+
+ { translate('INDEX.DIRECTION') }
+ { translate('INDEX.CONFIRMATIONS') }
+ { translate('INDEX.AMOUNT') }
+ { translate('INDEX.TIME') }
+ { translate('INDEX.DEST_ADDRESS') }
+ { translate('INDEX.TX_DETAIL') }
+
+
+
+
+ { this.renderPagination() }
+
+
+
+
+
+
+
+
+ );
+};
\ No newline at end of file
diff --git a/react/src/components/dashboard/walletsHeader.js b/react/src/components/dashboard/walletsHeader.js
index ad1b176..372f426 100644
--- a/react/src/components/dashboard/walletsHeader.js
+++ b/react/src/components/dashboard/walletsHeader.js
@@ -1,5 +1,5 @@
import React from 'react';
-import { translate } from '../../translate/translate';
+import WalletsHeaderRender from './walletsHeader.render';
class WalletsHeader extends React.Component {
hasActiveSection() {
@@ -13,113 +13,7 @@ class WalletsHeader extends React.Component {
render() {
if (this.hasActiveSection()) {
- return (
-
- );
+ return WalletsHeaderRender.call(this);
} else {
return null;
}
diff --git a/react/src/components/dashboard/walletsHeader.render.js b/react/src/components/dashboard/walletsHeader.render.js
new file mode 100644
index 0000000..0de50dc
--- /dev/null
+++ b/react/src/components/dashboard/walletsHeader.render.js
@@ -0,0 +1,114 @@
+import React from 'react';
+import { translate } from '../../translate/translate';
+
+const WalletsHeaderRender = function() {
+ return (
+
+ );
+};
+
+export default WalletsHeaderRender;
\ No newline at end of file
diff --git a/react/src/components/dashboard/walletsNative.js b/react/src/components/dashboard/walletsNative.js
index 889165a..b6f5853 100644
--- a/react/src/components/dashboard/walletsNative.js
+++ b/react/src/components/dashboard/walletsNative.js
@@ -1,12 +1,5 @@
import React from 'react';
-import { translate } from '../../translate/translate';
-import WalletsNativeAlert from './walletsNativeAlert';
-import WalletsNativeBalance from './walletsNativeBalance';
-import WalletsNativeInfo from './walletsNativeInfo';
-import WalletsNativeReceive from './walletsNativeReceive';
-import WalletsNativeSend from './walletsNativeSend';
-import WalletsNativeSyncProgress from './walletsNativeSyncProgress';
-import WalletsNativeTxHistory from './walletsNativeTxHistory';
+import WalletsNativeRender from './walletsNative.render';
class WalletsNative extends React.Component {
constructor(props) {
@@ -30,29 +23,7 @@ class WalletsNative extends React.Component {
//
render() {
if (this.isActiveCoinModeNative()) {
- return (
-
- );
+ return WalletsNativeRender.call(this);
} else {
return null;
}
diff --git a/react/src/components/dashboard/walletsNative.render.js b/react/src/components/dashboard/walletsNative.render.js
new file mode 100644
index 0000000..8cc220a
--- /dev/null
+++ b/react/src/components/dashboard/walletsNative.render.js
@@ -0,0 +1,35 @@
+import React from 'react';
+import WalletsNativeBalance from './walletsNativeBalance';
+import WalletsNativeInfo from './walletsNativeInfo';
+import WalletsNativeReceive from './walletsNativeReceive';
+import WalletsNativeSend from './walletsNativeSend';
+import WalletsNativeSyncProgress from './walletsNativeSyncProgress';
+import WalletsNativeTxHistory from './walletsNativeTxHistory';
+
+const WalletsNativeRender = function() {
+ return (
+
+ );
+};
+
+export default WalletsNativeRender;
\ No newline at end of file
diff --git a/react/src/components/dashboard/walletsNativeAlert.js b/react/src/components/dashboard/walletsNativeAlert.js
index e4676f2..79b137c 100644
--- a/react/src/components/dashboard/walletsNativeAlert.js
+++ b/react/src/components/dashboard/walletsNativeAlert.js
@@ -1,5 +1,5 @@
import React from 'react';
-import { translate } from '../../translate/translate';
+import WalletsNativeAlertRender from './walletsNativeAlert.render';
class WalletsNativeAlert extends React.Component {
hasNoProgress() {
@@ -10,24 +10,10 @@ class WalletsNativeAlert extends React.Component {
render() {
if (this.hasNoProgress()) {
- return (
-
-
- ×
-
-
{ translate('INDEX.OOPS_ERROR') }
-
- { translate('INDEX.OOPS_ERROR_DESC') }
- server=1
- rpcport=
- rpcuser=
- rpcpassword=
-
-
- );
- } else {
- return null;
+ return WalletsNativeAlertRender.call(this);
}
+
+ return null;
}
}
diff --git a/react/src/components/dashboard/walletsNativeAlert.render.js b/react/src/components/dashboard/walletsNativeAlert.render.js
new file mode 100644
index 0000000..1a5dd27
--- /dev/null
+++ b/react/src/components/dashboard/walletsNativeAlert.render.js
@@ -0,0 +1,22 @@
+import React from 'react';
+import { translate } from '../../translate/translate';
+
+const WalletsNativeAlertRender = function() {
+ return (
+
+
+ ×
+
+
{ translate('INDEX.OOPS_ERROR') }
+
+ { translate('INDEX.OOPS_ERROR_DESC') }
+ server=1
+ rpcport=
+ rpcuser=
+ rpcpassword=
+
+
+ );
+};
+
+export default WalletsNativeAlertRender;
\ No newline at end of file
diff --git a/react/src/components/dashboard/walletsNativeBalance.js b/react/src/components/dashboard/walletsNativeBalance.js
index 30d10f2..d7e0f33 100644
--- a/react/src/components/dashboard/walletsNativeBalance.js
+++ b/react/src/components/dashboard/walletsNativeBalance.js
@@ -1,76 +1,14 @@
import React from 'react';
-import { translate } from '../../translate/translate';
+import WalletsNativeBalanceRender from './walletsNativeBalance.render';
class WalletsNativeBalance extends React.Component {
render() {
if (this.props &&
this.props.ActiveCoin.nativeActiveSection === 'default') {
- return (
-
-
-
-
-
-
-
- { translate('INDEX.TRANSPARENT_BALANCE') }
-
-
{ this.props.ActiveCoin.balance.transparent ? this.props.ActiveCoin.balance.transparent : '-' }
-
-
-
-
-
-
-
-
-
-
-
-
- { translate('INDEX.Z_BALANCE') }
-
-
{ this.props.ActiveCoin.balance.private ? this.props.ActiveCoin.balance.private : '-' }
-
-
-
-
-
-
-
-
-
-
-
-
- { translate('INDEX.INTEREST_EARNED') }
-
-
{ this.props.Dashboard.progress && this.props.Dashboard.progress.interest ? this.props.Dashboard.progress.interest : '-' }
-
-
-
-
-
-
-
-
-
-
-
-
- { translate('INDEX.ZT_BALANCE') }
-
-
{ this.props.ActiveCoin.balance.total ? this.props.ActiveCoin.balance.total : '-' }
-
-
-
-
-
-
- );
- } else {
- return null;
+ return WalletsNativeBalanceRender.call(this);
}
+
+ return null;
}
}
diff --git a/react/src/components/dashboard/walletsNativeBalance.render.js b/react/src/components/dashboard/walletsNativeBalance.render.js
new file mode 100644
index 0000000..6e3344a
--- /dev/null
+++ b/react/src/components/dashboard/walletsNativeBalance.render.js
@@ -0,0 +1,70 @@
+import React from 'react';
+import { translate } from '../../translate/translate';
+
+const WalletsNativeBalanceRender = function() {
+ return (
+
+
+
+
+
+
+
+ { translate('INDEX.TRANSPARENT_BALANCE') }
+
+
{ this.props.ActiveCoin.balance.transparent ? this.props.ActiveCoin.balance.transparent : '-' }
+
+
+
+
+
+
+
+
+
+
+
+
+ { translate('INDEX.Z_BALANCE') }
+
+
{ this.props.ActiveCoin.balance.private ? this.props.ActiveCoin.balance.private : '-' }
+
+
+
+
+
+
+
+
+
+
+
+
+ { translate('INDEX.INTEREST_EARNED') }
+
+
{ this.props.Dashboard.progress && this.props.Dashboard.progress.interest ? this.props.Dashboard.progress.interest : '-' }
+
+
+
+
+
+
+
+
+
+
+
+
+ { translate('INDEX.ZT_BALANCE') }
+
+
{ this.props.ActiveCoin.balance.total ? this.props.ActiveCoin.balance.total : '-' }
+
+
+
+
+
+
+ );
+};
+
+export default WalletsNativeBalanceRender;
\ No newline at end of file
diff --git a/react/src/components/dashboard/walletsNativeInfo.js b/react/src/components/dashboard/walletsNativeInfo.js
index 42528fe..6e025e1 100644
--- a/react/src/components/dashboard/walletsNativeInfo.js
+++ b/react/src/components/dashboard/walletsNativeInfo.js
@@ -1,5 +1,5 @@
import React from 'react';
-import { translate } from '../../translate/translate';
+import WalletsNativeInfoRender from './walletsNativeInfo.render';
class WalletsNativeInfo extends React.Component {
constructor(props) {
@@ -11,145 +11,10 @@ class WalletsNativeInfo extends React.Component {
this.props.Dashboard &&
this.props.Dashboard.progress &&
this.props.ActiveCoin.nativeActiveSection === 'settings') {
- return (
-
-
-
-
-
{ translate('INDEX.WALLET_INFO') }
-
-
-
-
-
- { translate('INDEX.WALLET_VERSION') }
-
- { this.props.Dashboard.progress.walletversion }
-
-
-
- { translate('INDEX.BALANCE') }
-
- { this.props.Dashboard.progress.balance }
-
-
-
- { translate('INDEX.UNCONFIRMED_BALANCE') }
-
-
-
- { translate('INDEX.IMMATURE_BALANCE') }
-
-
-
- { translate('INDEX.TOTAL_TX_COUNT') }
-
-
-
-
-
-
-
-
-
-
-
-
- Komodo { translate('INDEX.INFO') }
-
-
-
-
-
-
- { translate('INDEX.VERSION') }
-
- { this.props.Dashboard.progress.KMDversion }
-
-
-
- { translate('INDEX.PROTOCOL_VERSION') }
-
- { this.props.Dashboard.progress.protocolversion }
-
-
-
- { translate('INDEX.NOTARIZED') }
-
- { this.props.Dashboard.progress.notarized }
-
-
-
-
- { translate('INDEX.NOTARIZED') } Hash
-
-
- { this.props.Dashboard.progress.notarizedhash ?
- this.props.Dashboard.progress.notarizedhash.substring(0, Math.floor(this.props.Dashboard.progress.notarizedhash.length / 2)) +
- '\t' +
- this.props.Dashboard.progress.notarizedhash.substring(Math.floor(this.props.Dashboard.progress.notarizedhash.length / 2), this.props.Dashboard.progress.notarizedhash.length)
- : ''
- }
-
-
-
-
- { translate('INDEX.NOTARIZED') } BTC
-
-
-
-
- { translate('INDEX.BLOCKS') }
-
- { this.props.Dashboard.progress.blocks }
-
-
-
- { translate('INDEX.CONNECTIONS') }
-
- { this.props.Dashboard.progress.connections }
-
-
-
- { translate('INDEX.DIFFICULTY') }
-
- { this.props.Dashboard.progress.difficulty }
-
-
-
- Testnet
-
- { this.props.Dashboard.progress.testnet }
-
-
-
- { translate('INDEX.PAY_TX_FEE') }
-
- { this.props.Dashboard.progress.paytxfee }
-
-
-
- { translate('INDEX.RELAY_FEE') }
-
- { this.props.Dashboard.progress.relayfee }
-
-
-
- { translate('INDEX.ERRORS') }
-
- { this.props.Dashboard.progress.errors }
-
-
-
-
-
-
-
-
- );
- } else {
- return null;
+ return WalletsNativeInfoRender.call(this);
}
+
+ return null;
}
}
diff --git a/react/src/components/dashboard/walletsNativeInfo.render.js b/react/src/components/dashboard/walletsNativeInfo.render.js
new file mode 100644
index 0000000..bf9f26d
--- /dev/null
+++ b/react/src/components/dashboard/walletsNativeInfo.render.js
@@ -0,0 +1,143 @@
+import React from 'react';
+import { translate } from '../../translate/translate';
+
+const WalletsNativeInfoRender = function() {
+ return (
+
+
+
+
+
{ translate('INDEX.WALLET_INFO') }
+
+
+
+
+
+ { translate('INDEX.WALLET_VERSION') }
+
+ { this.props.Dashboard.progress.walletversion }
+
+
+
+ { translate('INDEX.BALANCE') }
+
+ { this.props.Dashboard.progress.balance }
+
+
+
+ { translate('INDEX.UNCONFIRMED_BALANCE') }
+
+
+
+ { translate('INDEX.IMMATURE_BALANCE') }
+
+
+
+ { translate('INDEX.TOTAL_TX_COUNT') }
+
+
+
+
+
+
+
+
+
+
+
+
+ Komodo { translate('INDEX.INFO') }
+
+
+
+
+
+
+ { translate('INDEX.VERSION') }
+
+ { this.props.Dashboard.progress.KMDversion }
+
+
+
+ { translate('INDEX.PROTOCOL_VERSION') }
+
+ { this.props.Dashboard.progress.protocolversion }
+
+
+
+ { translate('INDEX.NOTARIZED') }
+
+ { this.props.Dashboard.progress.notarized }
+
+
+
+
+ { translate('INDEX.NOTARIZED') } Hash
+
+
+ { this.props.Dashboard.progress.notarizedhash ?
+ this.props.Dashboard.progress.notarizedhash.substring(0, Math.floor(this.props.Dashboard.progress.notarizedhash.length / 2)) +
+ '\t' +
+ this.props.Dashboard.progress.notarizedhash.substring(Math.floor(this.props.Dashboard.progress.notarizedhash.length / 2), this.props.Dashboard.progress.notarizedhash.length)
+ : ''
+ }
+
+
+
+
+ { translate('INDEX.NOTARIZED') } BTC
+
+
+
+
+ { translate('INDEX.BLOCKS') }
+
+ { this.props.Dashboard.progress.blocks }
+
+
+
+ { translate('INDEX.CONNECTIONS') }
+
+ { this.props.Dashboard.progress.connections }
+
+
+
+ { translate('INDEX.DIFFICULTY') }
+
+ { this.props.Dashboard.progress.difficulty }
+
+
+
+ Testnet
+
+ { this.props.Dashboard.progress.testnet }
+
+
+
+ { translate('INDEX.PAY_TX_FEE') }
+
+ { this.props.Dashboard.progress.paytxfee }
+
+
+
+ { translate('INDEX.RELAY_FEE') }
+
+ { this.props.Dashboard.progress.relayfee }
+
+
+
+ { translate('INDEX.ERRORS') }
+
+ { this.props.Dashboard.progress.errors }
+
+
+
+
+
+
+
+
+ );
+};
+
+export default WalletsNativeInfoRender;
\ No newline at end of file
diff --git a/react/src/components/dashboard/walletsNativeReceive.js b/react/src/components/dashboard/walletsNativeReceive.js
index 60d4036..7cc7b4f 100644
--- a/react/src/components/dashboard/walletsNativeReceive.js
+++ b/react/src/components/dashboard/walletsNativeReceive.js
@@ -1,10 +1,13 @@
import React from 'react';
-import { translate } from '../../translate/translate';
import {
copyCoinAddress,
getNewKMDAddresses
} from '../../actions/actionCreators';
import Store from '../../store';
+import {
+ AddressListRender,
+ WalletsNativeReceiveRender
+} from './walletsNativeReceive.render';
class WalletsNativeReceive extends React.Component {
constructor(props) {
@@ -48,23 +51,11 @@ class WalletsNativeReceive extends React.Component {
this.props.ActiveCoin.addresses[type] &&
this.props.ActiveCoin.addresses[type].length) {
return this.props.ActiveCoin.addresses[type].map((address) =>
-
-
-
- { type === 'public' ? translate('IAPI.PUBLIC_SM') : translate('KMD_NATIVE.PRIVATE') }
-
- this.copyZAddress(address.address) }> { translate('INDEX.COPY') }
-
- { type === 'public' ? address.address : address.address.substring(0, 34) + '...' }
- { address.amount }
-
-
+ AddressListRender.call(this, address, type)
);
- } else {
- return null;
}
+
+ return null;
}
getNewAddress(type) {
@@ -75,68 +66,10 @@ class WalletsNativeReceive extends React.Component {
if (this.props &&
this.props.ActiveCoin &&
this.props.ActiveCoin.nativeActiveSection === 'receive') {
- return (
-
-
-
-
-
-
-
-
- { translate('INDEX.RECEIVING_ADDRESS') }
-
-
-
-
-
- { translate('INDEX.TYPE') }
- { translate('INDEX.ADDRESS') }
- { translate('INDEX.AMOUNT') }
-
-
-
- { this.renderAddressList('public') }
- { this.renderAddressList('private') }
-
-
-
- { translate('INDEX.TYPE') }
- { translate('INDEX.ADDRESS') }
- { translate('INDEX.AMOUNT') }
-
-
-
-
-
-
-
-
-
-
- );
- } else {
- return null;
+ WalletsNativeReceiveRender.call(this);
}
+
+ return null;
}
}
diff --git a/react/src/components/dashboard/walletsNativeReceive.render.js b/react/src/components/dashboard/walletsNativeReceive.render.js
new file mode 100644
index 0000000..f172524
--- /dev/null
+++ b/react/src/components/dashboard/walletsNativeReceive.render.js
@@ -0,0 +1,82 @@
+import React from 'react';
+import { translate } from '../../translate/translate';
+
+export const AddressListRender = function(address, type) {
+ return (
+
+
+
+ { type === 'public' ? translate('IAPI.PUBLIC_SM') : translate('KMD_NATIVE.PRIVATE') }
+
+ this.copyZAddress(address.address) }> { translate('INDEX.COPY') }
+
+ { type === 'public' ? address.address : address.address.substring(0, 34) + '...' }
+ { address.amount }
+
+
+ );
+};
+
+export const WalletsNativeReceiveRender = function() {
+ return (
+
+
+
+
+
+
+
+
+ { translate('INDEX.RECEIVING_ADDRESS') }
+
+
+
+
+
+ { translate('INDEX.TYPE') }
+ { translate('INDEX.ADDRESS') }
+ { translate('INDEX.AMOUNT') }
+
+
+
+ { this.renderAddressList('public') }
+ { this.renderAddressList('private') }
+
+
+
+ { translate('INDEX.TYPE') }
+ { translate('INDEX.ADDRESS') }
+ { translate('INDEX.AMOUNT') }
+
+
+
+
+
+
+
+
+
+
+ );
+};
\ No newline at end of file
diff --git a/react/src/components/dashboard/walletsNativeSend.js b/react/src/components/dashboard/walletsNativeSend.js
index 666881e..cd8e1b5 100644
--- a/react/src/components/dashboard/walletsNativeSend.js
+++ b/react/src/components/dashboard/walletsNativeSend.js
@@ -9,6 +9,11 @@ import {
getKMDOPID
} from '../../actions/actionCreators';
import Store from '../../store';
+import {
+ AddressListRender,
+ OASendUIRender,
+ WalletsNativeSendRender
+} from './walletsNativeSend.render';
class WalletsNativeSend extends React.Component {
constructor(props) {
@@ -77,29 +82,7 @@ class WalletsNativeSend extends React.Component {
}
renderAddressList() {
- return (
-
-
- { this.renderSelectorCurrentLabel() }
-
-
-
-
-
-
- );
+ return AddressListRender.call(this);
}
renderOPIDLabel(opid) {
@@ -245,163 +228,20 @@ class WalletsNativeSend extends React.Component {
renderOASendUI() {
if (Config.openAlias) {
- return (
-
-
- { translate('INDEX.SEND_TO') } via Openalias address
-
-
-
-
- Get address
-
-
-
- );
- } else {
- return null;
+ return OASendUIRender.call(this);
}
+
+ return null;
}
render() {
if (this.props &&
this.props.ActiveCoin &&
this.props.ActiveCoin.nativeActiveSection === 'send') {
- return (
-
-
-
-
-
- { translate('INDEX.SEND') } { this.props.ActiveCoin.coin }
-
-
-
-
-
-
- { translate('INDEX.SEND_FROM') }
- { this.renderAddressList() }
-
-
- { this.renderOASendUI() }
-
-
- { translate('INDEX.SEND_TO') }
-
-
-
-
- { this.props.ActiveCoin.coin }
-
-
-
-
- { translate('INDEX.FEE') }
-
-
-
-
- { translate('INDEX.TOTAL') }: { this.state.amount } - { this.state.fee }/kb = { Number(this.state.amount) - Number(this.state.fee) } { this.props.ActiveCoin.coin }
-
-
-
-
- { translate('INDEX.SEND') } { this.state.amount } { this.props.ActiveCoin.coin }
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- { translate('INDEX.OPERATIONS_STATUSES') }
-
-
-
-
-
- { translate('INDEX.STATUS') }
- ID
- { translate('INDEX.TIME') }
- { translate('INDEX.RESULT') }
-
-
-
- { this.renderOPIDList() }
-
-
-
- { translate('INDEX.STATUS') }
- ID
- { translate('INDEX.TIME') }
- { translate('INDEX.RESULT') }
-
-
-
-
-
-
-
-
-
-
-
- );
- } else {
- return null;
+ return WalletsNativeSendRender.call(this);
}
+
+ return null;
}
}
diff --git a/react/src/components/dashboard/walletsNativeSend.render.js b/react/src/components/dashboard/walletsNativeSend.render.js
new file mode 100644
index 0000000..71400f6
--- /dev/null
+++ b/react/src/components/dashboard/walletsNativeSend.render.js
@@ -0,0 +1,179 @@
+import React from 'react';
+import { translate } from '../../translate/translate';
+
+export const AddressListRender = function() {
+ return (
+
+
+ { this.renderSelectorCurrentLabel() }
+
+
+
+
+
+
+ );
+};
+
+export const OASendUIRender = function() {
+ return (
+
+
+ { translate('INDEX.SEND_TO') } via Openalias address
+
+
+
+
+ Get address
+
+
+
+ );
+};
+
+export const WalletsNativeSendRender = function() {
+ return (
+
+
+
+
+
+ { translate('INDEX.SEND') } { this.props.ActiveCoin.coin }
+
+
+
+
+
+
+ { translate('INDEX.SEND_FROM') }
+ { this.renderAddressList() }
+
+
+ { this.renderOASendUI() }
+
+
+ { translate('INDEX.SEND_TO') }
+
+
+
+
+ { this.props.ActiveCoin.coin }
+
+
+
+
+ { translate('INDEX.FEE') }
+
+
+
+
+ { translate('INDEX.TOTAL') }: { this.state.amount } - { this.state.fee }/kb = { Number(this.state.amount) - Number(this.state.fee) } { this.props.ActiveCoin.coin }
+
+
+
+
+ { translate('INDEX.SEND') } { this.state.amount } { this.props.ActiveCoin.coin }
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ { translate('INDEX.OPERATIONS_STATUSES') }
+
+
+
+
+
+ { translate('INDEX.STATUS') }
+ ID
+ { translate('INDEX.TIME') }
+ { translate('INDEX.RESULT') }
+
+
+
+ { this.renderOPIDList() }
+
+
+
+ { translate('INDEX.STATUS') }
+ ID
+ { translate('INDEX.TIME') }
+ { translate('INDEX.RESULT') }
+
+
+
+
+
+
+
+
+
+
+
+ );
+};
\ No newline at end of file
diff --git a/react/src/components/dashboard/walletsNativeSyncProgress.js b/react/src/components/dashboard/walletsNativeSyncProgress.js
index 0a052c0..46f65c3 100644
--- a/react/src/components/dashboard/walletsNativeSyncProgress.js
+++ b/react/src/components/dashboard/walletsNativeSyncProgress.js
@@ -1,5 +1,9 @@
import React from 'react';
import { translate } from '../../translate/translate';
+import {
+ ChainActivationNotificationRender,
+ WalletsNativeSyncProgressRender
+} from './walletsNativeSyncProgress.render';
class WalletsNativeSyncProgress extends React.Component {
renderSyncPercentagePlaceholder() {
@@ -79,41 +83,20 @@ class WalletsNativeSyncProgress extends React.Component {
renderChainActivationNotification() {
if ((!this.props.Dashboard.progress.blocks && !this.props.Dashboard.progress.longestchain) ||
(this.props.Dashboard.progress.blocks < this.props.Dashboard.progress.longestchain)) {
- return (
-
-
- ×
-
-
- { translate('INDEX.ACTIVATING_CHAIN') }{ this.renderActivatingBestChainProgress() }
-
-
{ this.renderLB('INDEX.KMD_STARTED') }
-
- );
- } else {
- return null;
+ return ChainActivationNotificationRender.call(this);
}
+
+ return null;
}
render() {
if (this.props &&
this.props.Dashboard &&
this.props.Dashboard.progress) {
- return (
-
- { this.renderChainActivationNotification() }
-
-
-
- { this.renderSyncPercentagePlaceholder() }
-
-
-
-
- );
- } else {
- return null;
+ return WalletsNativeSyncProgressRender.call(this);
}
+
+ return null;
}
}
diff --git a/react/src/components/dashboard/walletsNativeSyncProgress.render.js b/react/src/components/dashboard/walletsNativeSyncProgress.render.js
new file mode 100644
index 0000000..149e0c9
--- /dev/null
+++ b/react/src/components/dashboard/walletsNativeSyncProgress.render.js
@@ -0,0 +1,31 @@
+import React from 'react';
+import { translate } from '../../translate/translate';
+
+export const ChainActivationNotificationRender = function() {
+ return (
+
+
+ ×
+
+
+ { translate('INDEX.ACTIVATING_CHAIN') }{ this.renderActivatingBestChainProgress() }
+
+
{ this.renderLB('INDEX.KMD_STARTED') }
+
+ );
+};
+
+export const WalletsNativeSyncProgressRender = function() {
+ return (
+
+ { this.renderChainActivationNotification() }
+
+
+
+ { this.renderSyncPercentagePlaceholder() }
+
+
+
+
+ );
+};
\ No newline at end of file
diff --git a/react/src/components/dashboard/walletsNativeTxHistory.js b/react/src/components/dashboard/walletsNativeTxHistory.js
index 39162f5..2090ace 100644
--- a/react/src/components/dashboard/walletsNativeTxHistory.js
+++ b/react/src/components/dashboard/walletsNativeTxHistory.js
@@ -1,9 +1,14 @@
import React from 'react';
import { translate } from '../../translate/translate';
-import { secondsToString } from '../../util/time';
import { sortByDate } from '../../util/sort';
import { toggleDashboardTxInfoModal } from '../../actions/actionCreators';
import Store from '../../store';
+import {
+ PaginationItemsPerPageSelectorRender,
+ PaginationRender,
+ TxHistoryListRender,
+ WalletsNativeTxHistoryRender
+} from './walletsNativeTxHistory.render';
class WalletsNativeTxHistory extends React.Component {
constructor(props) {
@@ -138,23 +143,7 @@ class WalletsNativeTxHistory extends React.Component {
if (this.props.ActiveCoin.txhistory &&
this.props.ActiveCoin.txhistory !== 'loading' &&
this.props.ActiveCoin.txhistory.length > 10) {
- return (
-
-
- { translate('INDEX.SHOW') }
-
- 10
- 25
- 50
- 100
-
- { translate('INDEX.ENTRIES_SM') }
-
-
- );
+ return PaginationItemsPerPageSelectorRender.call(this);
} else {
return null;
}
@@ -168,29 +157,10 @@ class WalletsNativeTxHistory extends React.Component {
const _paginationEnd = this.state.activePage * this.state.itemsPerPage;
const _paginationNextState = this.state.activePage > Math.floor(this.props.ActiveCoin.txhistory.length / this.state.itemsPerPage);
- return (
-
-
-
{ translate('INDEX.SHOWING') } { _paginationStart } { translate('INDEX.TO') } { _paginationEnd } { translate('INDEX.OF') } { this.props.ActiveCoin.txhistory.length } { translate('INDEX.ENTRIES_SM') }
-
-
-
- );
- } else {
- return null;
+ return PaginationRender.call(this, _paginationStart, _paginationEnd, _paginationNextState);
}
+
+ return null;
}
renderTxHistoryList() {
@@ -211,101 +181,20 @@ class WalletsNativeTxHistory extends React.Component {
if (this.state.itemsList &&
this.state.itemsList.length &&
this.props.ActiveCoin.nativeActiveSection === 'default') {
- return this.state.itemsList.map((tx, index) =>
-
-
-
- { translate('IAPI.PUBLIC_SM') }
-
-
- { this.renderTxType(tx.category) }
- { tx.confirmations }
- { tx.amount }
- { secondsToString(tx.time) }
- { this.renderAddress(tx) }
-
- this.toggleTxInfoModal(!this.props.ActiveCoin.showTransactionInfo, index) }>
-
-
- );
- } else {
- return null;
+ return TxHistoryListRender.call(this);
}
+
+ return null;
}
}
render() {
if (this.props &&
this.props.ActiveCoin.nativeActiveSection === 'default') {
- return (
-
-
-
-
-
-
-
-
- { translate('INDEX.TRANSACTION_HISTORY') }
-
-
-
-
- { this.renderPaginationItemsPerPageSelector() }
-
-
-
-
- { translate('INDEX.SEARCH') }:
-
-
-
-
-
-
-
-
- { translate('INDEX.TYPE') }
- { translate('INDEX.DIRECTION') }
- { translate('INDEX.CONFIRMATIONS') }
- { translate('INDEX.AMOUNT') }
- { translate('INDEX.TIME') }
- { translate('INDEX.DEST_ADDRESS') }
- { translate('INDEX.TX_DETAIL') }
-
-
-
- { this.renderTxHistoryList() }
-
-
-
- { translate('INDEX.TYPE') }
- { translate('INDEX.DIRECTION') }
- { translate('INDEX.CONFIRMATIONS') }
- { translate('INDEX.AMOUNT') }
- { translate('INDEX.TIME') }
- { translate('INDEX.DEST_ADDRESS') }
- { translate('INDEX.TX_DETAIL') }
-
-
-
-
- { this.renderPagination() }
-
-
-
-
-
-
-
-
- );
- } else {
- return null;
+ return WalletsNativeTxHistoryRender.call(this);
}
+
+ return null;
}
}
diff --git a/react/src/components/dashboard/walletsNativeTxHistory.render.js b/react/src/components/dashboard/walletsNativeTxHistory.render.js
new file mode 100644
index 0000000..7e37d9c
--- /dev/null
+++ b/react/src/components/dashboard/walletsNativeTxHistory.render.js
@@ -0,0 +1,137 @@
+import React from 'react';
+import { translate } from '../../translate/translate';
+import { secondsToString } from '../../util/time';
+
+export const PaginationItemsPerPageSelectorRender = function() {
+ return (
+
+
+ { translate('INDEX.SHOW') }
+
+ 10
+ 25
+ 50
+ 100
+
+ { translate('INDEX.ENTRIES_SM') }
+
+
+ );
+};
+
+export const PaginationRender = function(paginationStart, paginationEnd, paginationNextState) {
+ return (
+
+
+
{ translate('INDEX.SHOWING') } { paginationStart } { translate('INDEX.TO') } { paginationEnd } { translate('INDEX.OF') } { this.props.ActiveCoin.txhistory.length } { translate('INDEX.ENTRIES_SM') }
+
+
+
+ );
+};
+
+export const TxHistoryListRender = function() {
+ return this.state.itemsList.map((tx, index) =>
+
+
+
+ { translate('IAPI.PUBLIC_SM') }
+
+
+ { this.renderTxType(tx.category) }
+ { tx.confirmations }
+ { tx.amount }
+ { secondsToString(tx.time) }
+ { this.renderAddress(tx) }
+
+ this.toggleTxInfoModal(!this.props.ActiveCoin.showTransactionInfo, index) }>
+
+
+ );
+};
+
+export const WalletsNativeTxHistoryRender = function() {
+ return (
+
+
+
+
+
+
+
+
+ { translate('INDEX.TRANSACTION_HISTORY') }
+
+
+
+
+ { this.renderPaginationItemsPerPageSelector() }
+
+
+
+
+ { translate('INDEX.SEARCH') }:
+
+
+
+
+
+
+
+
+ { translate('INDEX.TYPE') }
+ { translate('INDEX.DIRECTION') }
+ { translate('INDEX.CONFIRMATIONS') }
+ { translate('INDEX.AMOUNT') }
+ { translate('INDEX.TIME') }
+ { translate('INDEX.DEST_ADDRESS') }
+ { translate('INDEX.TX_DETAIL') }
+
+
+
+ { this.renderTxHistoryList() }
+
+
+
+ { translate('INDEX.TYPE') }
+ { translate('INDEX.DIRECTION') }
+ { translate('INDEX.CONFIRMATIONS') }
+ { translate('INDEX.AMOUNT') }
+ { translate('INDEX.TIME') }
+ { translate('INDEX.DEST_ADDRESS') }
+ { translate('INDEX.TX_DETAIL') }
+
+
+
+
+ { this.renderPagination() }
+
+
+
+
+
+
+
+
+ );
+};
\ No newline at end of file
diff --git a/react/src/components/dashboard/walletsNativeTxInfo.js b/react/src/components/dashboard/walletsNativeTxInfo.js
index 9378453..e498e77 100644
--- a/react/src/components/dashboard/walletsNativeTxInfo.js
+++ b/react/src/components/dashboard/walletsNativeTxInfo.js
@@ -1,6 +1,4 @@
import React from 'react';
-import { translate } from '../../translate/translate';
-import { secondsToString } from '../../util/time';
import { toggleDashboardTxInfoModal } from '../../actions/actionCreators';
import Store from '../../store';
@@ -36,152 +34,7 @@ class WalletsNativeTxInfo extends React.Component {
this.props.ActiveCoin.mode === 'native') {
const txInfo = this.props.ActiveCoin.txhistory[this.props.ActiveCoin.showTransactionInfoTxIndex];
- return (
-
this.handleKeydown(event) }>
-
-
-
-
-
-
-
-
-
-
-
-
- amount
-
- { txInfo.amount }
-
-
-
- fee
-
- { txInfo.fee }
-
-
-
- confirmations
-
- { txInfo.confirmations }
-
-
-
- blockhash
-
- { txInfo.blockhash }
-
-
-
- blockindex
-
- {txInfo.blockindex}
-
-
-
- blocktime
-
- { secondsToString(txInfo.blocktime) }
-
-
-
- txid
-
- { txInfo.txid }
-
-
-
- walletconflicts
-
- { txInfo.walletconflicts.length }
-
-
-
- time
-
- { secondsToString(txInfo.time) }
-
-
-
- timereceived
-
- { secondsToString(txInfo.timereceived) }
-
-
-
-
-
-
-
-
-
- vjoinsplit
-
- { txInfo.vjoinsplit }
-
-
-
- details
-
- { txInfo.details }
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- { translate('INDEX.CLOSE') }
-
-
-
-
-
-
- );
+ return WalletsNativeTxInfoRender.call(this, txInfo);
} else {
return null;
}
diff --git a/react/src/components/dashboard/walletsNativeTxInfo.render.js b/react/src/components/dashboard/walletsNativeTxInfo.render.js
new file mode 100644
index 0000000..0f5a2cb
--- /dev/null
+++ b/react/src/components/dashboard/walletsNativeTxInfo.render.js
@@ -0,0 +1,154 @@
+import React from 'react';
+import { translate } from '../../translate/translate';
+import { secondsToString } from '../../util/time';
+
+const WalletsNativeTxInfoRender = function(txInfo) {
+ return (
+
this.handleKeydown(event) }>
+
+
+
+
+
+
+
+
+
+
+
+
+ amount
+
+ { txInfo.amount }
+
+
+
+ fee
+
+ { txInfo.fee }
+
+
+
+ confirmations
+
+ { txInfo.confirmations }
+
+
+
+ blockhash
+
+ { txInfo.blockhash }
+
+
+
+ blockindex
+
+ {txInfo.blockindex}
+
+
+
+ blocktime
+
+ { secondsToString(txInfo.blocktime) }
+
+
+
+ txid
+
+ { txInfo.txid }
+
+
+
+ walletconflicts
+
+ { txInfo.walletconflicts.length }
+
+
+
+ time
+
+ { secondsToString(txInfo.time) }
+
+
+
+ timereceived
+
+ { secondsToString(txInfo.timereceived) }
+
+
+
+
+
+
+
+
+
+ vjoinsplit
+
+ { txInfo.vjoinsplit }
+
+
+
+ details
+
+ { txInfo.details }
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ { translate('INDEX.CLOSE') }
+
+
+
+
+
+
+ );
+};
+
+export default WalletsNativeTxInfoRender;
\ No newline at end of file
diff --git a/react/src/components/dashboard/walletsNav.js b/react/src/components/dashboard/walletsNav.js
index 59ff523..2860a48 100644
--- a/react/src/components/dashboard/walletsNav.js
+++ b/react/src/components/dashboard/walletsNav.js
@@ -1,5 +1,4 @@
import React from 'react';
-import { translate } from '../../translate/translate';
import {
copyCoinAddress,
iguanaEdexBalance,
@@ -9,6 +8,10 @@ import {
toggleDashboardActiveSection
} from '../../actions/actionCreators';
import Store from '../../store';
+import {
+ WalletsNavNoWalletRender,
+ WalletsNavWithWalletRender
+} from './walletsNav.render';
class WalletsNav extends React.Component {
constructor(props) {
@@ -52,56 +55,10 @@ class WalletsNav extends React.Component {
if (this.props &&
this.props.ActiveCoin &&
!this.props.ActiveCoin.coin) {
- return (
-
-
-
-
-
- { translate('INDEX.NO_WALLET_CAPS') }
-
-
- { translate('INDEX.PLEASE_SELECT_A_WALLET') }.
-
-
-
- );
- } else {
- return (
-
-
-
- );
+ return WalletsNavNoWalletRender.call(this);
}
+
+ return WalletsNavWithWalletRender.call(this);
}
}
diff --git a/react/src/components/dashboard/walletsNav.render.js b/react/src/components/dashboard/walletsNav.render.js
new file mode 100644
index 0000000..57db2c9
--- /dev/null
+++ b/react/src/components/dashboard/walletsNav.render.js
@@ -0,0 +1,56 @@
+import React from 'react';
+import { translate } from '../../translate/translate';
+
+export const WalletsNavNoWalletRender = function () {
+ return (
+
+
+
+
+
+ { translate('INDEX.NO_WALLET_CAPS') }
+
+
+ { translate('INDEX.PLEASE_SELECT_A_WALLET') }.
+
+
+
+ );
+};
+
+export const WalletsNavWithWalletRender = function () {
+ return (
+
+
+
+ );
+};
\ No newline at end of file
diff --git a/react/src/components/dashboard/walletsNotariesList.js b/react/src/components/dashboard/walletsNotariesList.js
index bc6326a..24f16e5 100644
--- a/react/src/components/dashboard/walletsNotariesList.js
+++ b/react/src/components/dashboard/walletsNotariesList.js
@@ -2,8 +2,11 @@ import React from 'react';
import { translate } from '../../translate/translate';
import { displayNotariesModal } from '../../actions/actionCreators';
import Store from '../../store';
-import Tree, { TreeNode } from 'rc-tree';
-import { animation } from '../../util/rc-tree-animate';
+import { TreeNode } from 'rc-tree';
+import {
+ NotariesListRender,
+ WalletsNotariesListRender
+} from './walletsNotariesList.render';
class WalletsNotariesList extends React.Component {
constructor(props) {
@@ -38,11 +41,7 @@ class WalletsNotariesList extends React.Component {
this.props.ActiveCoin.notaries.notaries &&
this.props.ActiveCoin.notaries.notaries.length) {
return this.props.ActiveCoin.notaries.notaries.map((node, index) =>
-
-
-
-
-
+ NotariesListRender.call(this, node, index)
);
} else {
return null;
@@ -53,42 +52,10 @@ class WalletsNotariesList extends React.Component {
if (this.props &&
this.props.ActiveCoin.mode === 'basilisk' &&
this.props.ActiveCoin.displayNotariesModal) {
- const notariesData = this.props.ActiveCoin.notaries ? this.props.ActiveCoin.notaries.notaries : null;
-
- return (
-
this.handleKeydown(event) }>
-
-
-
-
-
-
-
-
- { this.renderNotariesFetching() }
-
- { this.renderNotariesList() }
-
-
-
-
-
-
-
- { translate('INDEX.CLOSE') }
-
-
-
-
-
-
- );
- } else {
- return null;
+ return WalletsNotariesListRender.call(this);
}
+
+ return null;
}
}
diff --git a/react/src/components/dashboard/walletsNotariesList.render.js b/react/src/components/dashboard/walletsNotariesList.render.js
new file mode 100644
index 0000000..f1db6c5
--- /dev/null
+++ b/react/src/components/dashboard/walletsNotariesList.render.js
@@ -0,0 +1,46 @@
+import React from 'react';
+import { translate } from '../../translate/translate';
+import Tree, { TreeNode } from 'rc-tree';
+import { animation } from '../../util/rc-tree-animate';
+
+export const NotariesListRender = function (node, index) {
+
+
+
+
+
+};
+
+export const WalletsNotariesListRender = function () {
+ return (
+
this.handleKeydown(event) }>
+
+
+
+
+
+
+
+
+ { this.renderNotariesFetching() }
+
+ { this.renderNotariesList() }
+
+
+
+
+
+
+
+ { translate('INDEX.CLOSE') }
+
+
+
+
+
+
+ );
+};
\ No newline at end of file
diff --git a/react/src/components/dashboard/walletsProgress.js b/react/src/components/dashboard/walletsProgress.js
index a33d5c2..f2200bf 100644
--- a/react/src/components/dashboard/walletsProgress.js
+++ b/react/src/components/dashboard/walletsProgress.js
@@ -1,5 +1,6 @@
import React from 'react';
import { translate } from '../../translate/translate';
+import WalletsProgressRender from './walletsProgress.render';
class WalletsProgress extends React.Component {
constructor(props) {
@@ -28,52 +29,12 @@ class WalletsProgress extends React.Component {
return (
{ translate('INDEX.COIN_IS_BUSY') }
);
- } else {
- return (
-
- );
}
- } else {
- return null;
+
+ return WalletsProgressRender.call(this);
}
+
+ return null;
}
}
diff --git a/react/src/components/dashboard/walletsProgress.render.js b/react/src/components/dashboard/walletsProgress.render.js
new file mode 100644
index 0000000..3591ffd
--- /dev/null
+++ b/react/src/components/dashboard/walletsProgress.render.js
@@ -0,0 +1,48 @@
+import React from 'react';
+import { translate } from '../../translate/translate';
+
+const WalletsProgressRender = function () {
+ return (
+
+ );
+};
+
+export default WalletsProgressRender;
\ No newline at end of file
diff --git a/react/src/components/dashboard/walletsTxInfo.js b/react/src/components/dashboard/walletsTxInfo.js
index 2f4363e..f90f554 100644
--- a/react/src/components/dashboard/walletsTxInfo.js
+++ b/react/src/components/dashboard/walletsTxInfo.js
@@ -1,8 +1,7 @@
import React from 'react';
-import { translate } from '../../translate/translate';
-import { secondsToString } from '../../util/time';
import { toggleDashboardTxInfoModal } from '../../actions/actionCreators';
import Store from '../../store';
+import WalletsTxInfoRender from './walletsTxInfo.render';
class WalletsTxInfo extends React.Component {
constructor(props) {
@@ -34,102 +33,10 @@ class WalletsTxInfo extends React.Component {
this.props.ActiveCoin.showTransactionInfo &&
this.props.ActiveCoin.mode !== 'native') {
const txInfo = this.props.ActiveCoin.txhistory[this.props.ActiveCoin.showTransactionInfoTxIndex];
-
- return (
-
this.handleKeydown(event) }>
-
-
-
-
-
-
-
-
-
-
-
-
- { translate('TX_INFO.ADDRESS') }
-
- { txInfo.address }
-
-
-
- { translate('TX_INFO.AMOUNT') }
-
- { txInfo.amount }
-
-
-
- { translate('TX_INFO.CATEGORY') }
-
- { txInfo.category || txInfo.type }
-
-
-
- { translate('TX_INFO.CONFIRMATIONS') }
-
- { txInfo.confirmations }
-
-
-
- blockhash
-
- { txInfo.blockhash }
-
-
-
- blocktime
-
- { secondsToString(txInfo.blocktime || txInfo.timestamp) }
-
-
-
- txid
-
- { txInfo.txid }
-
-
-
-
-
-
-
-
-
-
-
-
-
- { translate('INDEX.CLOSE') }
-
-
-
-
-
-
- );
- } else {
- return null;
+ return WalletsTxInfoRender.call(this, txInfo);
}
+
+ return null;
}
}
diff --git a/react/src/components/dashboard/walletsTxInfo.render.js b/react/src/components/dashboard/walletsTxInfo.render.js
new file mode 100644
index 0000000..d27daa3
--- /dev/null
+++ b/react/src/components/dashboard/walletsTxInfo.render.js
@@ -0,0 +1,100 @@
+import React from 'react';
+import { translate } from '../../translate/translate';
+import { secondsToString } from '../../util/time';
+
+const WalletsTxInfoRender = function(txInfo) {
+ return (
+
this.handleKeydown(event) }>
+
+
+
+
+
+
+
+
+
+
+
+
+ { translate('TX_INFO.ADDRESS') }
+
+ { txInfo.address }
+
+
+
+ { translate('TX_INFO.AMOUNT') }
+
+ { txInfo.amount }
+
+
+
+ { translate('TX_INFO.CATEGORY') }
+
+ { txInfo.category || txInfo.type }
+
+
+
+ { translate('TX_INFO.CONFIRMATIONS') }
+
+ { txInfo.confirmations }
+
+
+
+ blockhash
+
+ { txInfo.blockhash }
+
+
+
+ blocktime
+
+ { secondsToString(txInfo.blocktime || txInfo.timestamp) }
+
+
+
+ txid
+
+ { txInfo.txid }
+
+
+
+
+
+
+
+
+
+
+
+
+
+ { translate('INDEX.CLOSE') }
+
+
+
+
+
+
+ );
+};
+
+export default WalletsTxInfoRender;
\ No newline at end of file
diff --git a/react/src/components/login/login.js b/react/src/components/login/login.js
index 1a32c55..fcadff9 100644
--- a/react/src/components/login/login.js
+++ b/react/src/components/login/login.js
@@ -14,6 +14,9 @@ import {
import Store from '../../store';
import { PassPhraseGenerator } from '../../util/crypto/passphrasegenerator';
+import SwallModalRender from './swall-modal.render';
+import LoginRender from './login.render';
+
const IGUNA_ACTIVE_HANDLE_TIMEOUT = 3000;
const IGUNA_ACTIVE_COINS_TIMEOUT = 10000;
@@ -165,195 +168,18 @@ class Login extends React.Component {
renderSwallModal() {
if (this.state.displaySeedBackupModal) {
- return (
-
-
-
-
!
-
{ translate('LOGIN.SAVED_WALLET_SEED') }
-
{ translate('LOGIN.SEED_MAKE_SURE_BACKUP') }
-
-
{ translate('LOGIN.YES_I_BACKUP') }
-
{ translate('LOGIN.CANCEL') }
-
-
- );
- } else {
- return null;
+ return SwallModalRender.call(this);
}
+
+ return null;
}
render() {
if ((this.state && this.state.display) || !this.props.Main) {
- return (
-
- { this.renderSwallModal() }
-
-
-
-
-
-
-
-
- { translate('LOGIN.DISPLAY_SYNC_ONLY') }
-
-
-
-
-
-
-
{ translate('INDEX.UNSUPPORTED_BROWSER') }
-
-
-
- ×
- { translate('INDEX.CLOSE') }
-
- { translate('INDEX.IE_UNSUPPORTED') }
-
-
-
- { translate('INDEX.PLEASE_USE') } Google Chrome { translate('INDEX.OR') } Mozilla FireFox { translate('INDEX.TO_USE') } EasyDEX-GUI. { translate('INDEX.PLEASE_CLICK_ON') }.
-
-
-
-
-
-
-
-
-
-
-
-
-
{translate('INDEX.WELCOME_LOGIN')}
-
-
- this.handleKeydown(event) } />
-
- { translate('INDEX.WALLET_SEED') }
-
-
{ translate('INDEX.SIGN_IN') }
-
- this.updateActiveLoginSection('signup') }>{ translate('INDEX.CREATE_WALLET') }
- { translate('INDEX.LOGIN_ANOTHER_WALLET') }
-
- { translate('ADD_COIN.ADD_ANOTHER_COIN') }
-
-
-
-
-
-
-
{ translate('INDEX.WELCOME_PLEASE_ADD') }
-
-
- { translate('INDEX.ACTIVATE_COIN') }
-
-
-
-
-
-
-
- { translate('INDEX.SELECT_SEED_TYPE') }:
-
-
-
-
- { translate('INDEX.WALLET_SEED') }
-
-
-
- { translate('LOGIN.ENTER_VALUE_AGAIN') }.
- { translate('INDEX.CONFIRM_SEED') }
-
-
{ translate('INDEX.REGISTER') }
-
- this.updateActiveLoginSection('login') }>{ translate('INDEX.BACK_TO_LOGIN') }
-
-
-
-
-
-
- );
- } else {
- return null;
+ return LoginRender.call(this);
}
+
+ return null;
}
}
diff --git a/react/src/components/login/login.render.js b/react/src/components/login/login.render.js
new file mode 100644
index 0000000..61b40ce
--- /dev/null
+++ b/react/src/components/login/login.render.js
@@ -0,0 +1,168 @@
+import React from 'react';
+import { translate } from '../../translate/translate';
+
+const LoginRender = function () {
+ return (
+
+ { this.renderSwallModal() }
+
+
+
+
+
+
+
+
+ { translate('LOGIN.DISPLAY_SYNC_ONLY') }
+
+
+
+
+
+
+
{ translate('INDEX.UNSUPPORTED_BROWSER') }
+
+
+
+ ×
+ { translate('INDEX.CLOSE') }
+
+ { translate('INDEX.IE_UNSUPPORTED') }
+
+
+
+ { translate('INDEX.PLEASE_USE') } Google Chrome { translate('INDEX.OR') } Mozilla FireFox { translate('INDEX.TO_USE') } EasyDEX-GUI. { translate('INDEX.PLEASE_CLICK_ON') }.
+
+
+
+
+
+
+
+
+
+
+
+
+
{translate('INDEX.WELCOME_LOGIN')}
+
+
+ this.handleKeydown(event) } />
+
+ { translate('INDEX.WALLET_SEED') }
+
+
{ translate('INDEX.SIGN_IN') }
+
+ this.updateActiveLoginSection('signup') }>{ translate('INDEX.CREATE_WALLET') }
+ { translate('INDEX.LOGIN_ANOTHER_WALLET') }
+
+ { translate('ADD_COIN.ADD_ANOTHER_COIN') }
+
+
+
+
+
+
+
{ translate('INDEX.WELCOME_PLEASE_ADD') }
+
+
+ { translate('INDEX.ACTIVATE_COIN') }
+
+
+
+
+
+
+
+ { translate('INDEX.SELECT_SEED_TYPE') }:
+
+
+
+
+ { translate('INDEX.WALLET_SEED') }
+
+
+
+ { translate('LOGIN.ENTER_VALUE_AGAIN') }.
+ { translate('INDEX.CONFIRM_SEED') }
+
+
{ translate('INDEX.REGISTER') }
+
+ this.updateActiveLoginSection('login') }>{ translate('INDEX.BACK_TO_LOGIN') }
+
+
+
+
+
+
+ );
+};
+
+export default LoginRender;
\ No newline at end of file
diff --git a/react/src/components/login/swall-modal.render.js b/react/src/components/login/swall-modal.render.js
new file mode 100644
index 0000000..9f5a7b1
--- /dev/null
+++ b/react/src/components/login/swall-modal.render.js
@@ -0,0 +1,24 @@
+import React from 'react';
+import { translate } from '../../translate/translate';
+
+const SwallModalRender = function () {
+ return (
+
+
+
+
!
+
{ translate('LOGIN.SAVED_WALLET_SEED') }
+
{ translate('LOGIN.SEED_MAKE_SURE_BACKUP') }
+
+
{ translate('LOGIN.YES_I_BACKUP') }
+
{ translate('LOGIN.CANCEL') }
+
+
+ );
+};
+
+export default SwallModalRender;
\ No newline at end of file