After Width: | Height: | Size: 1.2 KiB |
After Width: | Height: | Size: 1.2 KiB |
After Width: | Height: | Size: 2.5 KiB |
After Width: | Height: | Size: 4.7 KiB |
After Width: | Height: | Size: 3.4 KiB |
After Width: | Height: | Size: 3.6 KiB |
After Width: | Height: | Size: 2.5 KiB |
@ -1,61 +0,0 @@ |
|||||
import { LOG_GUI_HTTP } from '../storeType'; |
|
||||
import { triggerToaster } from '../actionCreators'; |
|
||||
import Config from '../../config'; |
|
||||
|
|
||||
export function logGuiHttp(payload) { |
|
||||
return dispatch => { |
|
||||
dispatch(guiLogState(payload)); |
|
||||
|
|
||||
// disabled for now
|
|
||||
/*return fetch(`http://127.0.0.1:${Config.agamaPort}/shepherd/guilog`, {
|
|
||||
method: 'POST', |
|
||||
headers: { |
|
||||
'Content-Type': 'application/json', |
|
||||
}, |
|
||||
body: JSON.stringify(payload), |
|
||||
}) |
|
||||
.catch(function(error) { |
|
||||
console.log(error); |
|
||||
dispatch(triggerToaster('logGuiHttp', 'Error', 'error')); |
|
||||
}) |
|
||||
.then(response => response.json())*/ |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
export function getAgamaLog(type) { |
|
||||
return dispatch => { |
|
||||
return fetch(`http://127.0.0.1:${Config.agamaPort}/shepherd/getlog?type=${type}`, { |
|
||||
method: 'GET', |
|
||||
headers: { |
|
||||
'Content-Type': 'application/json', |
|
||||
}, |
|
||||
}) |
|
||||
.catch(function(error) { |
|
||||
console.log(error); |
|
||||
dispatch( |
|
||||
triggerToaster( |
|
||||
'getAgamaLog', |
|
||||
'Error', |
|
||||
'error' |
|
||||
) |
|
||||
); |
|
||||
}) |
|
||||
.then(response => response.json()) |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
export function guiLogState(logData) { |
|
||||
return { |
|
||||
type: LOG_GUI_HTTP, |
|
||||
timestamp: logData.timestamp, |
|
||||
log: { |
|
||||
timestamp: logData.timestamp, |
|
||||
function: logData.function, |
|
||||
httpMethod: logData.type, |
|
||||
url: logData.url, |
|
||||
payload: logData.payload, |
|
||||
status: logData.status, |
|
||||
response: logData.response, |
|
||||
} |
|
||||
} |
|
||||
} |
|
@ -0,0 +1,67 @@ |
|||||
|
import { |
||||
|
triggerToaster, |
||||
|
} from '../actionCreators'; |
||||
|
import Config from '../../config'; |
||||
|
import { DASHBOARD_UPDATE } from '../storeType'; |
||||
|
|
||||
|
export function getDashboardUpdate(coin, activeCoinProps) { |
||||
|
return dispatch => { |
||||
|
const _fetchConfig = { |
||||
|
method: 'POST', |
||||
|
headers: { |
||||
|
'Content-Type': 'application/json', |
||||
|
}, |
||||
|
body: JSON.stringify({ coin: coin }), |
||||
|
}; |
||||
|
|
||||
|
return fetch( |
||||
|
`http://127.0.0.1:${Config.agamaPort}/shepherd/native/dashboard/update`, |
||||
|
_fetchConfig |
||||
|
) |
||||
|
.catch(function(error) { |
||||
|
console.log(error); |
||||
|
dispatch( |
||||
|
triggerToaster( |
||||
|
'getDashboardUpdate', |
||||
|
'Error', |
||||
|
'error' |
||||
|
) |
||||
|
); |
||||
|
}) |
||||
|
.then(response => response.json()) |
||||
|
.then(json => { |
||||
|
dispatch(getDashboardUpdateState(json, coin)); |
||||
|
|
||||
|
// dirty hack to trigger dashboard render
|
||||
|
if (!activeCoinProps.balance && |
||||
|
!activeCoinProps.addresses) { |
||||
|
setTimeout(() => { |
||||
|
dispatch(getDashboardUpdateState(json, coin)); |
||||
|
}, 100); |
||||
|
} |
||||
|
}) |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
export function getDashboardUpdateState(json, coin) { |
||||
|
let _listtransactions = json.result['listtransactions']; |
||||
|
|
||||
|
if (_listtransactions && |
||||
|
_listtransactions.error) { |
||||
|
_listtransactions = null; |
||||
|
} else if (_listtransactions && _listtransactions.result && _listtransactions.result.length) { |
||||
|
_listtransactions = _listtransactions.result; |
||||
|
} else if (!_listtransactions || (!_listtransactions.result || !_listtransactions.result.length)) { |
||||
|
_listtransactions = 'no data'; |
||||
|
} |
||||
|
|
||||
|
return { |
||||
|
type: DASHBOARD_UPDATE, |
||||
|
progress: json.result['getinfo'].result, |
||||
|
opids: json.result['z_getoperationstatus'].result, |
||||
|
txhistory: _listtransactions, |
||||
|
balance: json.result['z_gettotalbalance'].result, |
||||
|
addresses: json.result['addresses'], |
||||
|
coin: coin, |
||||
|
}; |
||||
|
} |
@ -1,223 +0,0 @@ |
|||||
import { |
|
||||
DASHBOARD_CONNECT_NOTARIES, |
|
||||
DASHBOARD_GET_NOTARIES_LIST |
|
||||
} from '../storeType'; |
|
||||
import { translate } from '../../translate/translate'; |
|
||||
import { triggerToaster } from '../actionCreators'; |
|
||||
import Config from '../../config'; |
|
||||
import { |
|
||||
logGuiHttp, |
|
||||
guiLogState |
|
||||
} from './log'; |
|
||||
|
|
||||
function initNotaryNodesConSequence(nodes) { |
|
||||
return dispatch => { |
|
||||
Promise.all(nodes.map((node, index) => { |
|
||||
const payload = { |
|
||||
userpass: `tmpIgRPCUser@${sessionStorage.getItem('IguanaRPCAuth')}`, |
|
||||
agent: 'dex', |
|
||||
method: 'getinfo', |
|
||||
symbol: node, |
|
||||
timeout: 10000, |
|
||||
}; |
|
||||
|
|
||||
return new Promise((resolve, reject) => { |
|
||||
const _timestamp = Date.now(); |
|
||||
if (Config.debug) { |
|
||||
dispatch(logGuiHttp({ |
|
||||
timestamp: _timestamp, |
|
||||
function: `initNotaryNodesConSequence+${node}`, |
|
||||
type: 'post', |
|
||||
url: `http://127.0.0.1:${Config.iguanaCorePort}`, |
|
||||
payload: payload, |
|
||||
status: 'pending', |
|
||||
})); |
|
||||
} |
|
||||
|
|
||||
fetch(`http://127.0.0.1:${(Config.useBasiliskInstance ? Config.iguanaCorePort + 1 : Config.iguanaCorePort)}/api/dex/getinfo?userpass=${('tmpIgRPCUser@' + sessionStorage.getItem('IguanaRPCAuth'))}&symbol=${node}`, { |
|
||||
method: 'GET', |
|
||||
}) |
|
||||
.catch(function(error) { |
|
||||
console.log(error); |
|
||||
if (Config.debug) { |
|
||||
dispatch(logGuiHttp({ |
|
||||
timestamp: _timestamp, |
|
||||
status: 'error', |
|
||||
response: error, |
|
||||
})); |
|
||||
} |
|
||||
dispatch( |
|
||||
triggerToaster( |
|
||||
`getInfoDexNode+${node}`, |
|
||||
'Error', |
|
||||
'error' |
|
||||
) |
|
||||
); |
|
||||
}) |
|
||||
.then(response => response.json()) |
|
||||
.then(json => { |
|
||||
if (Config.debug) { |
|
||||
dispatch(logGuiHttp({ |
|
||||
timestamp: _timestamp, |
|
||||
status: 'success', |
|
||||
response: json, |
|
||||
})); |
|
||||
} |
|
||||
dispatch( |
|
||||
updateNotaryNodeConState( |
|
||||
json, |
|
||||
nodes.length, |
|
||||
index, |
|
||||
node |
|
||||
) |
|
||||
); |
|
||||
}) |
|
||||
}); |
|
||||
})); |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
function updateNotaryNodeConState(json, totalNodes, currentNodeIndex, currentNodeName) { |
|
||||
if (currentNodeIndex === totalNodes - 1) { |
|
||||
return dispatch => { |
|
||||
dispatch(basiliskConnectionState(false)); |
|
||||
}; |
|
||||
} else { |
|
||||
if (json && |
|
||||
json.error === 'less than required responses') { |
|
||||
return { |
|
||||
type: DASHBOARD_CONNECT_NOTARIES, |
|
||||
total: totalNodes - 1, |
|
||||
current: currentNodeIndex, |
|
||||
name: currentNodeName, |
|
||||
failedNode: currentNodeName, |
|
||||
} |
|
||||
} else { |
|
||||
return { |
|
||||
type: DASHBOARD_CONNECT_NOTARIES, |
|
||||
total: totalNodes - 1, |
|
||||
current: currentNodeIndex, |
|
||||
name: currentNodeName, |
|
||||
} |
|
||||
} |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
function connectAllNotaryNodes(json, dispatch) { |
|
||||
if (json && |
|
||||
json.length) { |
|
||||
dispatch(initNotaryNodesConSequence(json)); |
|
||||
|
|
||||
return { |
|
||||
type: DASHBOARD_CONNECT_NOTARIES, |
|
||||
total: json.length - 1, |
|
||||
current: 0, |
|
||||
name: json[0], |
|
||||
} |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
export function connectNotaries() { |
|
||||
const payload = { |
|
||||
userpass: `tmpIgRPCUser@${sessionStorage.getItem('IguanaRPCAuth')}`, |
|
||||
agent: 'dpow', |
|
||||
method: 'notarychains', |
|
||||
}; |
|
||||
|
|
||||
return dispatch => { |
|
||||
return fetch(`http://127.0.0.1:${Config.iguanaCorePort}`, { |
|
||||
method: 'POST', |
|
||||
body: JSON.stringify(payload), |
|
||||
}) |
|
||||
.catch(function(error) { |
|
||||
console.log(error); |
|
||||
dispatch( |
|
||||
triggerToaster( |
|
||||
'connectNotaries', |
|
||||
'Error', |
|
||||
'error' |
|
||||
) |
|
||||
); |
|
||||
}) |
|
||||
.then(response => response.json()) |
|
||||
.then( |
|
||||
json => dispatch( |
|
||||
connectAllNotaryNodes(json, dispatch) |
|
||||
) |
|
||||
) |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
function getDexNotariesState(json) { |
|
||||
if (json.error === 'less than required responses') { |
|
||||
return dispatch => { |
|
||||
dispatch( |
|
||||
triggerToaster( |
|
||||
translate('TOASTR.LESS_RESPONSES_REQ'), |
|
||||
translate('TOASTR.BASILISK_NOTIFICATION'), |
|
||||
'error' |
|
||||
) |
|
||||
); |
|
||||
} |
|
||||
} else { |
|
||||
return { |
|
||||
type: DASHBOARD_GET_NOTARIES_LIST, |
|
||||
notaries: json, |
|
||||
} |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
export function getDexNotaries(coin) { |
|
||||
const payload = { |
|
||||
userpass: `tmpIgRPCUser@${sessionStorage.getItem('IguanaRPCAuth')}`, |
|
||||
agent: 'dex', |
|
||||
method: 'getnotaries', |
|
||||
symbol: coin, |
|
||||
}; |
|
||||
|
|
||||
return dispatch => { |
|
||||
const _timestamp = Date.now(); |
|
||||
if (Config.debug) { |
|
||||
dispatch(logGuiHttp({ |
|
||||
timestamp: _timestamp, |
|
||||
function: 'getDexNotaries', |
|
||||
type: 'post', |
|
||||
url: `http://127.0.0.1:${Config.useBasiliskInstance ? Config.iguanaCorePort + 1 : Config.iguanaCorePort}`, |
|
||||
payload: payload, |
|
||||
status: 'pending', |
|
||||
})); |
|
||||
} |
|
||||
return fetch(`http://127.0.0.1:${Config.useBasiliskInstance ? Config.iguanaCorePort + 1 : Config.iguanaCorePort}`, { |
|
||||
method: 'POST', |
|
||||
body: JSON.stringify(payload), |
|
||||
}) |
|
||||
.catch(function(error) { |
|
||||
console.log(error); |
|
||||
if (Config.debug) { |
|
||||
dispatch(logGuiHttp({ |
|
||||
timestamp: _timestamp, |
|
||||
status: 'error', |
|
||||
response: error, |
|
||||
})); |
|
||||
} |
|
||||
dispatch( |
|
||||
triggerToaster( |
|
||||
'getDexNotaries', |
|
||||
'Error', |
|
||||
'error' |
|
||||
) |
|
||||
); |
|
||||
}) |
|
||||
.then(response => response.json()) |
|
||||
.then(json => { |
|
||||
if (Config.debug) { |
|
||||
dispatch(logGuiHttp({ |
|
||||
timestamp: _timestamp, |
|
||||
status: 'success', |
|
||||
response: json, |
|
||||
})); |
|
||||
} |
|
||||
dispatch(getDexNotariesState(json)); |
|
||||
}) |
|
||||
} |
|
||||
} |
|
@ -0,0 +1,47 @@ |
|||||
|
.modal-claim-interest { |
||||
|
.modal-dialog { |
||||
|
width: 70%; |
||||
|
|
||||
|
.table > tbody > tr > td, |
||||
|
.table > tbody > tr > th, |
||||
|
.table > tfoot > tr > td, |
||||
|
.table > tfoot > tr > th, |
||||
|
.table > thead > tr > td, |
||||
|
.table > thead > tr > th { |
||||
|
padding: 8px 30px 8px 0; |
||||
|
} |
||||
|
|
||||
|
.claim-btn { |
||||
|
float: right; |
||||
|
margin-bottom: 30px; |
||||
|
} |
||||
|
.table-scroll { |
||||
|
height: 366px; |
||||
|
overflow-y: auto; |
||||
|
overflow-x: hidden; |
||||
|
width: 100%; |
||||
|
} |
||||
|
.bold { |
||||
|
font-weight: bold; |
||||
|
} |
||||
|
.green { |
||||
|
color: #66bb6a; |
||||
|
} |
||||
|
.red { |
||||
|
color: #f96868; |
||||
|
} |
||||
|
.locktime { |
||||
|
i { |
||||
|
font-size: 20px; |
||||
|
line-height: 1.1; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.refresh-icon { |
||||
|
position: absolute; |
||||
|
right: 20px; |
||||
|
font-size: 20px; |
||||
|
z-index: 100; |
||||
|
} |
||||
|
} |
||||
|
} |
@ -0,0 +1,24 @@ |
|||||
|
.coind-down-modal { |
||||
|
.modal-body { |
||||
|
height: 60vh; |
||||
|
|
||||
|
> div { |
||||
|
height: 100%; |
||||
|
} |
||||
|
.form-group { |
||||
|
&.form-material { |
||||
|
&.floating { |
||||
|
height: 80%; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
.page-content { |
||||
|
width: 90%; |
||||
|
height: 100%; |
||||
|
|
||||
|
textarea { |
||||
|
height: 100%; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
@ -0,0 +1,89 @@ |
|||||
|
.jumblr { |
||||
|
p { |
||||
|
width: calc(100% - 100px); |
||||
|
} |
||||
|
.breadcrumb { |
||||
|
padding: 8px 30px; |
||||
|
position: relative; |
||||
|
top: 0; |
||||
|
} |
||||
|
.img-responsive { |
||||
|
position: absolute; |
||||
|
top: -28px; |
||||
|
right: 18px; |
||||
|
|
||||
|
.coin { |
||||
|
font-size: 30px; |
||||
|
position: relative; |
||||
|
left: -18px; |
||||
|
top: 4px; |
||||
|
} |
||||
|
.image { |
||||
|
width: 60px; |
||||
|
} |
||||
|
} |
||||
|
.header-easydex-section { |
||||
|
img { |
||||
|
max-width: inherit; |
||||
|
} |
||||
|
} |
||||
|
.copy-string-btn { |
||||
|
position: absolute; |
||||
|
right: 36px; |
||||
|
margin-top: -68px; |
||||
|
} |
||||
|
.btn-next { |
||||
|
position: absolute; |
||||
|
top: 60px; |
||||
|
right: 32px; |
||||
|
} |
||||
|
input.labelauty+label, |
||||
|
input.labelauty+label { |
||||
|
background: #d6d5d5; |
||||
|
color: #504e4e; |
||||
|
} |
||||
|
input.labelauty:checked+label { |
||||
|
color: #fff; |
||||
|
background-color: #3949ab; |
||||
|
} |
||||
|
input.labelauty + label:hover .labelauty-unchecked, |
||||
|
input.labelauty + label .labelauty-unchecked { |
||||
|
color: #504e4e; |
||||
|
} |
||||
|
.nofloat { |
||||
|
float: none; |
||||
|
display: inline-block; |
||||
|
padding-left: 0; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.jumblr-mode-selector { |
||||
|
.nav-tabs { |
||||
|
li { |
||||
|
cursor: pointer; |
||||
|
|
||||
|
&.active { |
||||
|
> a { |
||||
|
cursor: pointer; |
||||
|
color: #fff; |
||||
|
background-color: #62a8ea; |
||||
|
border-color: transparent; |
||||
|
border-bottom-color: #62a8ea; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.panel-heading { |
||||
|
background: #f3f3f3; |
||||
|
cursor: pointer; |
||||
|
} |
||||
|
.panel-title { |
||||
|
color: #676767; |
||||
|
} |
||||
|
.jumblr-addresses-list { |
||||
|
.col-xs-3 { |
||||
|
padding: 0; |
||||
|
} |
||||
|
} |
||||
|
} |
@ -1,122 +0,0 @@ |
|||||
import React from 'react'; |
|
||||
import { connect } from 'react-redux'; |
|
||||
import { sortByDate } from '../../../util/sort'; |
|
||||
import Config from '../../../config'; |
|
||||
import { |
|
||||
NotificationsByTypeRender, |
|
||||
NotificationsModalRender, |
|
||||
NotificationsRender |
|
||||
} from './notifications.render'; |
|
||||
|
|
||||
class Notifications extends React.Component { |
|
||||
constructor() { |
|
||||
super(); |
|
||||
this.state = { |
|
||||
displayModal: false, |
|
||||
calls: { |
|
||||
total: 0, |
|
||||
error: 0, |
|
||||
success: 0, |
|
||||
pending: 0, |
|
||||
}, |
|
||||
activeTab: 2, |
|
||||
guiLog: null, |
|
||||
debug: Config.debug, |
|
||||
}; |
|
||||
this.toggleNotificationsModal = this.toggleNotificationsModal.bind(this); |
|
||||
} |
|
||||
|
|
||||
openTab(tab) { |
|
||||
this.setState(Object.assign({}, this.state, { |
|
||||
activeTab: tab, |
|
||||
})); |
|
||||
} |
|
||||
|
|
||||
componentWillReceiveProps(props) { |
|
||||
// get total number of calls per type
|
|
||||
if (this.props.Dashboard && |
|
||||
this.props.Dashboard.guiLog) { |
|
||||
const _guiLog = this.props.Dashboard.guiLog; |
|
||||
let _callsLength = { |
|
||||
total: Object.keys(_guiLog).length, |
|
||||
error: 0, |
|
||||
success: 0, |
|
||||
pending: 0, |
|
||||
} |
|
||||
let guiLogToArray = []; |
|
||||
|
|
||||
for (let timestamp in _guiLog) { |
|
||||
guiLogToArray.push(_guiLog[timestamp]); |
|
||||
_callsLength[_guiLog[timestamp].status]++; |
|
||||
} |
|
||||
|
|
||||
this.setState(Object.assign({}, this.state, { |
|
||||
calls: { |
|
||||
total: _callsLength.total, |
|
||||
error: _callsLength.error, |
|
||||
success: _callsLength.success, |
|
||||
pending: _callsLength.pending, |
|
||||
}, |
|
||||
guiLog: guiLogToArray, |
|
||||
})); |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
renderNotificationsByType(type) { |
|
||||
// get total number of calls per type
|
|
||||
if (this.state.guiLog && |
|
||||
this.state.guiLog.length) { |
|
||||
let _guiLog = this.state.guiLog; |
|
||||
let items = []; |
|
||||
_guiLog = sortByDate(_guiLog); |
|
||||
|
|
||||
for (let i = 0; i < _guiLog.length; i++) { |
|
||||
if (_guiLog[i].status === type) { |
|
||||
const _logItem = _guiLog[i]; |
|
||||
|
|
||||
items.push( |
|
||||
NotificationsByTypeRender.call( |
|
||||
this, |
|
||||
_logItem, |
|
||||
type, |
|
||||
i |
|
||||
) |
|
||||
); |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
return items; |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
renderNotificationsModal() { |
|
||||
if (this.state.displayModal) { |
|
||||
return NotificationsModalRender.call(this); |
|
||||
} |
|
||||
|
|
||||
return null; |
|
||||
} |
|
||||
|
|
||||
toggleNotificationsModal() { |
|
||||
this.setState(Object.assign({}, this.state, { |
|
||||
displayModal: !this.state.displayModal, |
|
||||
})); |
|
||||
} |
|
||||
|
|
||||
render() { |
|
||||
return NotificationsRender.call(this); |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
const mapStateToProps = (state) => { |
|
||||
return { |
|
||||
Dashboard: { |
|
||||
guiLog: state.Dashboard.guiLog, |
|
||||
activeHandle: state.Dashboard.activeHandle, |
|
||||
} |
|
||||
}; |
|
||||
|
|
||||
}; |
|
||||
|
|
||||
export default connect(mapStateToProps)(Notifications); |
|
||||
|
|
@ -1,116 +0,0 @@ |
|||||
import React from 'react'; |
|
||||
import { |
|
||||
secondsToString |
|
||||
} from '../../../util/time'; |
|
||||
import { translate } from '../../../translate/translate'; |
|
||||
|
|
||||
export const NotificationsByTypeRender = function(logItem, type, index) { |
|
||||
return ( |
|
||||
<div key={ logItem.timestamp }> |
|
||||
<div>{ index + 1 }.</div> |
|
||||
<div> |
|
||||
<strong>Time:</strong> { secondsToString(logItem.timestamp, true, true) } |
|
||||
</div> |
|
||||
<div> |
|
||||
<strong>GUI Function:</strong> { logItem.function } |
|
||||
</div> |
|
||||
<div> |
|
||||
<strong>HTTP:</strong> { logItem.httpMethod.toUpperCase() } |
|
||||
</div> |
|
||||
<div> |
|
||||
<strong>URL:</strong> { logItem.url } |
|
||||
</div> |
|
||||
<div> |
|
||||
<strong>Payload:</strong> { JSON.stringify(logItem.payload, null, '\t') } |
|
||||
</div> |
|
||||
<div className={ type !== 'pending' ? '' : 'hide' }> |
|
||||
<strong>Response:</strong> { JSON.stringify(logItem.response, null, '\t') } |
|
||||
</div> |
|
||||
<hr /> |
|
||||
</div> |
|
||||
); |
|
||||
} |
|
||||
|
|
||||
export const NotificationsModalRender = function() { |
|
||||
return ( |
|
||||
<div onKeyDown={ (event) => this.handleKeydown(event) }> |
|
||||
<div className="modal show notifications-modal"> |
|
||||
<div className="modal-dialog modal-center modal-lg"> |
|
||||
<div className="modal-content"> |
|
||||
<div className="modal-body modal-body-container"> |
|
||||
<div className="panel nav-tabs-horizontal"> |
|
||||
<ul className="nav nav-tabs nav-tabs-line"> |
|
||||
<li className={ this.state.activeTab === 0 ? 'active' : 'pointer' }> |
|
||||
<a onClick={ () => this.openTab(0) }> |
|
||||
<i className="icon fa fa-thumbs-o-up"></i> Success ({ this.state.calls.success }) |
|
||||
</a> |
|
||||
</li> |
|
||||
<li className={ this.state.activeTab === 1 ? 'active' : 'pointer' }> |
|
||||
<a onClick={ () => this.openTab(1) }> |
|
||||
<i className="icon fa fa-exclamation-triangle"></i> Error ({ this.state.calls.error }) |
|
||||
</a> |
|
||||
</li> |
|
||||
<li className={ this.state.activeTab === 2 ? 'active' : 'pointer' }> |
|
||||
<a onClick={ () => this.openTab(2) }> |
|
||||
<i className="icon fa fa-clock-o"></i> Pending ({ this.state.calls.pending }) |
|
||||
</a> |
|
||||
</li> |
|
||||
</ul> |
|
||||
<div className="panel-body panel-body-container"> |
|
||||
<div className="tab-content"> |
|
||||
<div className={ 'tab-pane' + (this.state.activeTab === 0 ? ' active' : '') }> |
|
||||
{ this.renderNotificationsByType('success') } |
|
||||
</div> |
|
||||
<div className={ 'tab-pane' + (this.state.activeTab === 1 ? ' active' : '') }> |
|
||||
{ this.renderNotificationsByType('error') } |
|
||||
</div> |
|
||||
<div className={ 'tab-pane' + (this.state.activeTab === 2 ? ' active' : '') }> |
|
||||
{ this.renderNotificationsByType('pending') } |
|
||||
</div> |
|
||||
</div> |
|
||||
</div> |
|
||||
</div> |
|
||||
</div> |
|
||||
<div className="modal-footer"> |
|
||||
<button |
|
||||
type="button" |
|
||||
className="btn btn-default" |
|
||||
onClick={ this.toggleNotificationsModal }> |
|
||||
{ translate('INDEX.CLOSE') } |
|
||||
</button> |
|
||||
</div> |
|
||||
</div> |
|
||||
</div> |
|
||||
</div> |
|
||||
<div className="modal-backdrop show in"></div> |
|
||||
</div> |
|
||||
); |
|
||||
}; |
|
||||
|
|
||||
export const NotificationsRender = function() { |
|
||||
return ( |
|
||||
<div> |
|
||||
<div |
|
||||
className={ 'notifications-badge' + (this.props.Dashboard.activeHandle && this.props.Dashboard.activeHandle.status === 'unlocked' ? ' stick-to-top' : '') } |
|
||||
onClick={ this.state.debug ? this.toggleNotificationsModal : null }> |
|
||||
<span className={ this.state.debug ? 'badge success' : 'hide' }> |
|
||||
{ this.state.calls.success } |
|
||||
</span> |
|
||||
<span className={ this.state.debug ? 'badge error' : 'hide' }> |
|
||||
{ this.state.calls.error } |
|
||||
</span> |
|
||||
<span className={ this.state.debug ? 'badge pending' : 'hide' }> |
|
||||
{ this.state.calls.pending } |
|
||||
</span> |
|
||||
<div className={ 'spinner' + (this.state.calls.pending === 0 ? ' spinner-hide' : '') }> |
|
||||
<div className="rect1"></div> |
|
||||
<div className="rect2"></div> |
|
||||
<div className="rect3"></div> |
|
||||
<div className="rect4"></div> |
|
||||
<div className="rect5"></div> |
|
||||
</div> |
|
||||
</div> |
|
||||
{ this.renderNotificationsModal() } |
|
||||
</div> |
|
||||
); |
|
||||
}; |
|
@ -0,0 +1,11 @@ |
|||||
|
.qr-modal-send-block { |
||||
|
position: absolute; |
||||
|
top: 15px; |
||||
|
right: 30px; |
||||
|
} |
||||
|
|
||||
|
.webcam-frame { |
||||
|
width: 100%; |
||||
|
text-align: center; |
||||
|
font-size: 16px; |
||||
|
} |
@ -0,0 +1,115 @@ |
|||||
|
.support-box { |
||||
|
padding: 15px 20px; |
||||
|
width: 220px; |
||||
|
display: inline-block; |
||||
|
cursor: pointer; |
||||
|
|
||||
|
&-title { |
||||
|
font-weight: bold; |
||||
|
padding-top: 12px; |
||||
|
padding-bottom: 3px; |
||||
|
} |
||||
|
img { |
||||
|
height: 50px; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.support-box-wrapper { |
||||
|
display: inline-block; |
||||
|
margin-right: 50px; |
||||
|
|
||||
|
&:last-child, { |
||||
|
margin-right: 0; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.support-box:hover { |
||||
|
.support-box-link { |
||||
|
color: #5683ad; |
||||
|
font-weight: 500; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.login-settings-modal { |
||||
|
#AppUpdate { |
||||
|
.col-sm-4 { |
||||
|
width: 100%; |
||||
|
} |
||||
|
} |
||||
|
.modal-dialog { |
||||
|
width: 80%; |
||||
|
} |
||||
|
.modal-body { |
||||
|
background: #f3f4f5; |
||||
|
border-radius: 4px; |
||||
|
} |
||||
|
.modal-footer { |
||||
|
margin-top: 15px; |
||||
|
} |
||||
|
.page-content { |
||||
|
padding-top: 0; |
||||
|
} |
||||
|
.support-box-wrapper { |
||||
|
.support-box { |
||||
|
margin: 0; |
||||
|
margin-bottom: 20px; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.settings-help { |
||||
|
font-size: 20px; |
||||
|
position: relative; |
||||
|
top: 2px; |
||||
|
left: 10px; |
||||
|
color: #5683ad; |
||||
|
} |
||||
|
|
||||
|
#SettingsAccordion { |
||||
|
.toggle { |
||||
|
position: relative; |
||||
|
top: 4px; |
||||
|
} |
||||
|
table { |
||||
|
width: 100%; |
||||
|
|
||||
|
td { |
||||
|
&:first-child { |
||||
|
width: 40%; |
||||
|
} |
||||
|
&:last-child { |
||||
|
width: 60%; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
#SettingsAccordion { |
||||
|
.panel { |
||||
|
.panel-collapse { |
||||
|
transition: all .3s; |
||||
|
|
||||
|
&.collapse { |
||||
|
height: 0; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
#section-iguana-wallet-settings { |
||||
|
background: #f3f4f5; |
||||
|
|
||||
|
.panel-title { |
||||
|
cursor: pointer; |
||||
|
cursor: hand; |
||||
|
|
||||
|
&:before { |
||||
|
content: '\F273'; |
||||
|
} |
||||
|
&.collapsed { |
||||
|
&:before { |
||||
|
content: '\F278'; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
@ -0,0 +1,37 @@ |
|||||
|
.sync-only-forks { |
||||
|
color: #757575; |
||||
|
|
||||
|
.modal-body { |
||||
|
overflow-y: auto; |
||||
|
} |
||||
|
.badge{ |
||||
|
&.up { |
||||
|
position: absolute; |
||||
|
top: 40px; |
||||
|
left: 65px; |
||||
|
margin: 0 5px; |
||||
|
} |
||||
|
} |
||||
|
.avatar { |
||||
|
width: 20%; |
||||
|
display: inline-block; |
||||
|
text-align: center; |
||||
|
vertical-align: top; |
||||
|
|
||||
|
img { |
||||
|
width: 55px; |
||||
|
display: inherit; |
||||
|
} |
||||
|
} |
||||
|
.progress-bars { |
||||
|
padding-left: 40px; |
||||
|
display: inline-block; |
||||
|
width: 80%; |
||||
|
margin: 0 auto; |
||||
|
} |
||||
|
.padding-bottom-60 { |
||||
|
&:last-child { |
||||
|
padding-bottom: 0 !important; |
||||
|
} |
||||
|
} |
||||
|
} |
@ -1,46 +0,0 @@ |
|||||
import React from 'react'; |
|
||||
import { connect } from 'react-redux'; |
|
||||
import { basiliskConnection } from '../../../actions/actionCreators'; |
|
||||
import Store from '../../../store'; |
|
||||
import WalletsBasiliskConnectionRender from './walletsBasiliskConnection.render'; |
|
||||
|
|
||||
class WalletsBasiliskConnection extends React.Component { |
|
||||
constructor() { |
|
||||
super(); |
|
||||
this.basiliskConnectionAction = this.basiliskConnectionAction.bind(this); |
|
||||
} |
|
||||
|
|
||||
basiliskConnectionAction() { |
|
||||
Store.dispatch(basiliskConnection(false)); |
|
||||
} |
|
||||
|
|
||||
handleKeydown(e) { |
|
||||
if (e.key === 'Escape') { |
|
||||
this.basiliskConnectionAction(); |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
isBasiliskConnection() { |
|
||||
return this.props && |
|
||||
this.props.Dashboard.basiliskConnection; |
|
||||
} |
|
||||
|
|
||||
render() { |
|
||||
if (this.isBasiliskConnection()) { |
|
||||
return WalletsBasiliskConnectionRender.call(this); |
|
||||
} else { |
|
||||
return null; |
|
||||
} |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
const mapStateToProps = (state) => { |
|
||||
return { |
|
||||
Dashboard: { |
|
||||
basiliskConnection: state.Dashboard.basiliskConnection, |
|
||||
connectedNotaries: state.Dashboard.connectedNotaries, |
|
||||
} |
|
||||
}; |
|
||||
}; |
|
||||
|
|
||||
export default connect(mapStateToProps)(WalletsBasiliskConnection); |
|
@ -1,83 +0,0 @@ |
|||||
import React from 'react'; |
|
||||
import { translate } from '../../../translate/translate'; |
|
||||
|
|
||||
const WalletsBasiliskConnectionRender = function() { |
|
||||
return ( |
|
||||
<div onKeyDown={ (event) => this.handleKeydown(event) }> |
|
||||
<div |
|
||||
className="modal show" |
|
||||
id="RefreshBasiliskConnectionsMdl"> |
|
||||
<div className="modal-dialog modal-center modal-md"> |
|
||||
<div className="modal-content"> |
|
||||
<div className="modal-header bg-orange-a400 wallet-send-header"> |
|
||||
<h4 className="modal-title white"> |
|
||||
<span className="icon fa-refresh no-margin"></span> { translate('INDEX.REFRESHING_BASILISK_NET') }... |
|
||||
</h4> |
|
||||
<button |
|
||||
type="button" |
|
||||
className="close btn-close" |
|
||||
onClick={ this.basiliskConnectionAction }> |
|
||||
<span>×</span> |
|
||||
<span className="sr-only">{ translate('INDEX.CLOSE') }</span> |
|
||||
</button> |
|
||||
</div> |
|
||||
<div className="modal-body text-align-center"> |
|
||||
<div className="loader-wrapper active"> |
|
||||
<div className="loader-layer loader-blue"> |
|
||||
<div className="loader-circle-left"> |
|
||||
<div className="circle"></div> |
|
||||
</div> |
|
||||
<div className="loader-circle-gap"></div> |
|
||||
<div className="loader-circle-right"> |
|
||||
<div className="circle"></div> |
|
||||
</div> |
|
||||
</div> |
|
||||
<div className="loader-layer loader-red"> |
|
||||
<div className="loader-circle-left"> |
|
||||
<div className="circle"></div> |
|
||||
</div> |
|
||||
<div className="loader-circle-gap"></div> |
|
||||
<div className="loader-circle-right"> |
|
||||
<div className="circle"></div> |
|
||||
</div> |
|
||||
</div> |
|
||||
<div className="loader-layer loader-green"> |
|
||||
<div className="loader-circle-left"> |
|
||||
<div className="circle"></div> |
|
||||
</div> |
|
||||
<div className="loader-circle-gap"></div> |
|
||||
<div className="loader-circle-right"> |
|
||||
<div className="circle"></div> |
|
||||
</div> |
|
||||
</div> |
|
||||
<div className="loader-layer loader-yellow"> |
|
||||
<div className="loader-circle-left"> |
|
||||
<div className="circle"></div> |
|
||||
</div> |
|
||||
<div className="loader-circle-gap"></div> |
|
||||
<div className="loader-circle-right"> |
|
||||
<div className="circle"></div> |
|
||||
</div> |
|
||||
</div> |
|
||||
</div> |
|
||||
<h5 className="text-left"> |
|
||||
{ `${translate('IAPI.CON_STATUS')}... ${this.props.Dashboard.connectedNotaries.current} / ${this.props.Dashboard.connectedNotaries.total}:${this.props.Dashboard.connectedNotaries.currentNodeName}` } <span className="pull-right" id="basilisk-connections-refresh-percent">{ Math.floor(this.props.Dashboard.connectedNotaries.current * 100 / this.props.Dashboard.connectedNotaries.total) }%</span> |
|
||||
</h5> |
|
||||
<div className="progress progress-sm"> |
|
||||
<div |
|
||||
className="progress-bar progress-bar-info progress-bar-striped active font-size-80-percent" |
|
||||
style={{ width: Math.floor(this.props.Dashboard.connectedNotaries.current * 100 / this.props.Dashboard.connectedNotaries.total) + '%' }}></div> |
|
||||
</div> |
|
||||
<pre id="no-padding"> |
|
||||
{ this.props.Dashboard.connectedNotaries.failedToConnectNodes ? `Failed: ${this.props.Dashboard.connectedNotaries.failedToConnectNodes}` : null } |
|
||||
</pre> |
|
||||
</div> |
|
||||
</div> |
|
||||
</div> |
|
||||
</div> |
|
||||
<div className="modal-backdrop show in"></div> |
|
||||
</div> |
|
||||
); |
|
||||
}; |
|
||||
|
|
||||
export default WalletsBasiliskConnectionRender; |
|
@ -1,26 +0,0 @@ |
|||||
import React from 'react'; |
|
||||
import { connect } from 'react-redux'; |
|
||||
import WalletsBasiliskRefreshRender from './walletsBasiliskRefresh.render'; |
|
||||
|
|
||||
class WalletsBasiliskRefresh extends React.Component { |
|
||||
isBasiliskRefresh() { |
|
||||
return this.props && |
|
||||
this.props.Dashboard.basiliskRefresh; |
|
||||
} |
|
||||
|
|
||||
render() { |
|
||||
if (this.isBasiliskRefresh()) { |
|
||||
return WalletsBasiliskRefreshRender.call(this); |
|
||||
} |
|
||||
|
|
||||
return null; |
|
||||
} |
|
||||
} |
|
||||
const mapStateToProps = (state) => { |
|
||||
return { |
|
||||
Dashboard: { |
|
||||
basiliskRefresh: state.Dashboard.basiliskRefresh, |
|
||||
} |
|
||||
}; |
|
||||
}; |
|
||||
export default connect(mapStateToProps)(WalletsBasiliskRefresh); |
|
@ -1,36 +0,0 @@ |
|||||
import React from 'react'; |
|
||||
import { translate } from '../../../translate/translate'; |
|
||||
|
|
||||
const WalletsBasiliskRefreshRender = function() { |
|
||||
return ( |
|
||||
<div id="edexcoin_dashboard_basilisk_refresh_status"> |
|
||||
<div className="col-xs-12 margin-top-20"> |
|
||||
<div className="col-xs-12"> |
|
||||
<div className="panel"> |
|
||||
<div className="panel-heading"> |
|
||||
<h3 className="panel-title">{ translate('INDEX.FETCHING_BASILISK_DATA') }</h3> |
|
||||
<div className="panel-actions"> |
|
||||
<a className="panel-action icon md-refresh-alt"></a> |
|
||||
</div> |
|
||||
</div> |
|
||||
<div className="table-responsive"> |
|
||||
<table className="table table-hover table-striped"> |
|
||||
<thead> |
|
||||
<tr> |
|
||||
<th>{ translate('INDEX.ADDRESS') }</th> |
|
||||
<th>{ translate('INDEX.LIST_UNSPENT') }</th> |
|
||||
<th>{ translate('INDEX.LIST_TRANSACTIONS') }</th> |
|
||||
<th>{ translate('INDEX.GET_BALANCE') }</th> |
|
||||
<th>{ translate('INDEX.REFRESH') }</th> |
|
||||
</tr> |
|
||||
</thead> |
|
||||
</table> |
|
||||
</div> |
|
||||
</div> |
|
||||
</div> |
|
||||
</div> |
|
||||
</div> |
|
||||
); |
|
||||
}; |
|
||||
|
|
||||
export default WalletsBasiliskRefreshRender; |
|
@ -0,0 +1,92 @@ |
|||||
|
.search-box { |
||||
|
float: right; |
||||
|
padding-right: 0; |
||||
|
} |
||||
|
.basilisk-progress-bar { |
||||
|
position: absolute; |
||||
|
width: 100%; |
||||
|
} |
||||
|
.breadcrumb--basilisk, |
||||
|
.breadcrumb--native { |
||||
|
top: 0; |
||||
|
} |
||||
|
.dropdown-menu { |
||||
|
.no--hover { |
||||
|
pointer-events: none; |
||||
|
} |
||||
|
} |
||||
|
.ReactTable { |
||||
|
border: none; |
||||
|
|
||||
|
.pagination-bottom { |
||||
|
margin-top: 35px; |
||||
|
} |
||||
|
.rt-td { |
||||
|
text-align: center; |
||||
|
} |
||||
|
.rt-table { |
||||
|
border: 1px solid rgba(0, 0, 0, 0.1); |
||||
|
} |
||||
|
.rt-thead .rt-th, |
||||
|
.rt-thead .rt-td { |
||||
|
padding: 10px 5px; |
||||
|
} |
||||
|
.rt-tr.-odd div, |
||||
|
.rt-tr.-even div { |
||||
|
padding-top: 10px; |
||||
|
padding-bottom: 10px; |
||||
|
} |
||||
|
.-pagination, |
||||
|
.rt-thead, |
||||
|
.rt-tfoot { |
||||
|
border: none; |
||||
|
} |
||||
|
.rt-tfoot { |
||||
|
border-top: 1px solid rgba(0, 0, 0, 0.1); |
||||
|
} |
||||
|
.rt-thead { |
||||
|
border-bottom: 1px solid rgba(0, 0, 0, 0.1); |
||||
|
} |
||||
|
.colum--direction { |
||||
|
width: 40px !important; |
||||
|
flex: 40 0 auto !important; |
||||
|
padding-right: 10px; |
||||
|
} |
||||
|
.colum--txinfo { |
||||
|
width: 40px !important; |
||||
|
flex: 40 0 auto !important; |
||||
|
} |
||||
|
.colum--type { |
||||
|
width: 40px !important; |
||||
|
flex: 40 0 auto !important; |
||||
|
} |
||||
|
.-pagination { |
||||
|
.-pageJump { |
||||
|
margin-right: 5px; |
||||
|
margin-left: 5px; |
||||
|
} |
||||
|
.-btn { |
||||
|
color: #757575; |
||||
|
background-color: #efefef; |
||||
|
border: 1px solid #e0e0e0; |
||||
|
|
||||
|
&:hover { |
||||
|
color: #fff; |
||||
|
} |
||||
|
} |
||||
|
.-btn[disabled]:hover { |
||||
|
color: #757575; |
||||
|
} |
||||
|
} |
||||
|
.rt-noData { |
||||
|
top: 46px; |
||||
|
width: 100%; |
||||
|
text-align: center; |
||||
|
height: 98px; |
||||
|
padding: 38px; |
||||
|
background: rgba(255, 255, 255, 0.85); |
||||
|
} |
||||
|
} |
||||
|
.table-cell-offset-16 { |
||||
|
padding-left: 16px; |
||||
|
} |
@ -1,20 +0,0 @@ |
|||||
import React from 'react'; |
|
||||
import WalletsNativeAlertRender from './walletsNativeAlert.render'; |
|
||||
|
|
||||
class WalletsNativeAlert extends React.Component { |
|
||||
hasNoProgress() { |
|
||||
return this.props && |
|
||||
this.props.Dashboard && |
|
||||
!this.props.Dashboard.progress; |
|
||||
} |
|
||||
|
|
||||
render() { |
|
||||
if (this.hasNoProgress()) { |
|
||||
return WalletsNativeAlertRender.call(this); |
|
||||
} |
|
||||
|
|
||||
return null; |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
export default WalletsNativeAlert; |
|
@ -1,19 +0,0 @@ |
|||||
import React from 'react'; |
|
||||
import { translate } from '../../../translate/translate'; |
|
||||
|
|
||||
const WalletsNativeAlertRender = function() { |
|
||||
return ( |
|
||||
<div className="alert alert-danger alert-dismissible"> |
|
||||
<h4>{ translate('INDEX.OOPS_ERROR') }</h4> |
|
||||
<p> |
|
||||
<span>{ translate('INDEX.OOPS_ERROR_DESC') }</span> |
|
||||
<code>server=1</code><br/> |
|
||||
<code>rpcport=</code><br/> |
|
||||
<code>rpcuser=</code><br/> |
|
||||
<code>rpcpassword=</code> |
|
||||
</p> |
|
||||
</div> |
|
||||
); |
|
||||
}; |
|
||||
|
|
||||
export default WalletsNativeAlertRender; |
|
@ -1,73 +0,0 @@ |
|||||
import React from 'react'; |
|
||||
import { connect } from 'react-redux'; |
|
||||
import { translate } from '../../../translate/translate'; |
|
||||
import { displayNotariesModal } from '../../../actions/actionCreators'; |
|
||||
import Store from '../../../store'; |
|
||||
import { TreeNode } from 'rc-tree'; |
|
||||
import { |
|
||||
NotariesListRender, |
|
||||
WalletsNotariesListRender |
|
||||
} from './walletsNotariesList.render'; |
|
||||
|
|
||||
class WalletsNotariesList extends React.Component { |
|
||||
constructor() { |
|
||||
super(); |
|
||||
this.closeNotariesModal = this.closeNotariesModal.bind(this); |
|
||||
} |
|
||||
|
|
||||
closeNotariesModal() { |
|
||||
Store.dispatch(displayNotariesModal(false)); |
|
||||
} |
|
||||
|
|
||||
handleKeydown(e) { |
|
||||
if (e.key === 'Escape') { |
|
||||
this.closeNotariesModal(); |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
renderNotariesFetching() { |
|
||||
if (!this.props.ActiveCoin.notaries) { |
|
||||
return ( |
|
||||
<div>{ translate('INDEX.FETCHING_NOTARIES_LIST') }...</div> |
|
||||
); |
|
||||
} else { |
|
||||
return ( |
|
||||
<div>{ translate('INDEX.TOTAL_NOTARIES') }: { this.props.ActiveCoin.notaries.numnotaries }</div> |
|
||||
); |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
renderNotariesList() { |
|
||||
if (this.props.ActiveCoin.notaries && |
|
||||
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; |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
render() { |
|
||||
if (this.props && |
|
||||
this.props.ActiveCoin.mode === 'basilisk' && |
|
||||
this.props.ActiveCoin.displayNotariesModal) { |
|
||||
return WalletsNotariesListRender.call(this); |
|
||||
} |
|
||||
|
|
||||
return null; |
|
||||
} |
|
||||
} |
|
||||
const mapStateToProps = (state) => { |
|
||||
return { |
|
||||
ActiveCoin: { |
|
||||
mode: state.ActiveCoin.mode, |
|
||||
displayNotariesModal: state.ActiveCoin.displayNotariesModal, |
|
||||
notaries: state.ActiveCoin.notaries, |
|
||||
} |
|
||||
}; |
|
||||
|
|
||||
}; |
|
||||
|
|
||||
export default connect(mapStateToProps)(WalletsNotariesList); |
|
@ -1,60 +0,0 @@ |
|||||
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) { |
|
||||
return ( |
|
||||
<TreeNode |
|
||||
title={ `Node ${index}` } |
|
||||
key={ `node-${index}` }> |
|
||||
<TreeNode |
|
||||
key={ `node-${index}-btc` } |
|
||||
title={ `BTC: ${node.BTCaddress}` } /> |
|
||||
<TreeNode |
|
||||
key={ `node-${index}-kmd` } |
|
||||
title={ `KMD: ${node.KMDaddress}` } /> |
|
||||
<TreeNode |
|
||||
key={ `node-${index}-pubkey` } |
|
||||
title={ `Pubkey: ${node.pubkey}` } /> |
|
||||
</TreeNode> |
|
||||
); |
|
||||
}; |
|
||||
|
|
||||
export const WalletsNotariesListRender = function() { |
|
||||
return ( |
|
||||
<div onKeyDown={ (event) => this.handleKeydown(event) }> |
|
||||
<div |
|
||||
className="modal show" |
|
||||
id="kmd_txid_info_mdl"> |
|
||||
<div className="modal-dialog modal-center modal-lg"> |
|
||||
<div className="modal-content"> |
|
||||
<div className="modal-body modal-body-container"> |
|
||||
<div className="panel nav-tabs-horizontal"> |
|
||||
<div className="panel-body"> |
|
||||
<div className="tab-content"> |
|
||||
<div className="tab-pane active"> |
|
||||
{ this.renderNotariesFetching() } |
|
||||
<Tree |
|
||||
defaultExpandAll={ false } |
|
||||
openAnimation={ animation }> |
|
||||
{ this.renderNotariesList() } |
|
||||
</Tree> |
|
||||
</div> |
|
||||
</div> |
|
||||
</div> |
|
||||
</div> |
|
||||
</div> |
|
||||
<div className="modal-footer"> |
|
||||
<button |
|
||||
type="button" |
|
||||
className="btn btn-default" |
|
||||
onClick={ this.closeNotariesModal }>{ translate('INDEX.CLOSE') }</button> |
|
||||
</div> |
|
||||
</div> |
|
||||
</div> |
|
||||
</div> |
|
||||
<div className="modal-backdrop show in"></div> |
|
||||
</div> |
|
||||
); |
|
||||
}; |
|