diff --git a/js/src/redux/providers/status.js b/js/src/redux/providers/status.js
index 830192bbeaa..13847971694 100644
--- a/js/src/redux/providers/status.js
+++ b/js/src/redux/providers/status.js
@@ -54,7 +54,10 @@ export default class Status {
this._api.eth
.getBlockByNumber(blockNumber)
.then((block) => {
- this._store.dispatch(statusCollection({ gasLimit: block.gasLimit }));
+ this._store.dispatch(statusCollection({
+ blockTimestamp: block.timestamp,
+ gasLimit: block.gasLimit
+ }));
})
.catch((error) => {
console.warn('status._subscribeBlockNumber', 'getBlockByNumber', error);
diff --git a/js/src/redux/providers/statusReducer.js b/js/src/redux/providers/statusReducer.js
index 07ba4af5b35..279a9da4282 100644
--- a/js/src/redux/providers/statusReducer.js
+++ b/js/src/redux/providers/statusReducer.js
@@ -19,6 +19,7 @@ import { handleActions } from 'redux-actions';
const initialState = {
blockNumber: new BigNumber(0),
+ blockTimestamp: new Date(),
devLogs: [],
devLogsLevels: null,
devLogsEnabled: false,
diff --git a/js/src/ui/Actionbar/actionbar.js b/js/src/ui/Actionbar/actionbar.js
index c3fbe6a1898..f744f5c5737 100644
--- a/js/src/ui/Actionbar/actionbar.js
+++ b/js/src/ui/Actionbar/actionbar.js
@@ -17,11 +17,13 @@
import React, { Component, PropTypes } from 'react';
import { Toolbar, ToolbarGroup } from 'material-ui/Toolbar';
+import { nodeOrStringProptype } from '~/util/proptypes';
+
import styles from './actionbar.css';
export default class Actionbar extends Component {
static propTypes = {
- title: PropTypes.string,
+ title: nodeOrStringProptype(),
buttons: PropTypes.array,
children: PropTypes.node,
className: PropTypes.string
diff --git a/js/src/ui/Page/page.css b/js/src/ui/Page/page.css
index 72a78dc2256..c09283aec4f 100644
--- a/js/src/ui/Page/page.css
+++ b/js/src/ui/Page/page.css
@@ -18,7 +18,7 @@
.layout {
padding: 0.25em 0.25em 1em 0.25em;
- > * {
+ &>div {
margin-bottom: 0.75em;
}
}
diff --git a/js/src/ui/Page/page.js b/js/src/ui/Page/page.js
index 867c3fdf16b..9646358b384 100644
--- a/js/src/ui/Page/page.js
+++ b/js/src/ui/Page/page.js
@@ -16,21 +16,38 @@
import React, { Component, PropTypes } from 'react';
+import Actionbar from '../Actionbar';
+import { nodeOrStringProptype } from '~/util/proptypes';
+
import styles from './page.css';
export default class Page extends Component {
static propTypes = {
+ buttons: PropTypes.array,
className: PropTypes.string,
- children: PropTypes.node
+ children: PropTypes.node,
+ title: nodeOrStringProptype()
};
render () {
- const { className, children } = this.props;
+ const { buttons, className, children, title } = this.props;
const classes = `${styles.layout} ${className}`;
+ let actionbar = null;
+
+ if (title || buttons) {
+ actionbar = (
+
+ );
+ }
return (
-
- { children }
+
+ { actionbar }
+
+ { children }
+
);
}
diff --git a/js/src/views/Signer/signer.js b/js/src/views/Signer/signer.js
index 6d68c1dc081..f0b4baed72e 100644
--- a/js/src/views/Signer/signer.js
+++ b/js/src/views/Signer/signer.js
@@ -23,8 +23,7 @@ export default class Signer extends Component {
render () {
return (
);
diff --git a/js/src/views/Signer/store.js b/js/src/views/Signer/store.js
index 0eeb99861cb..bcc85a43120 100644
--- a/js/src/views/Signer/store.js
+++ b/js/src/views/Signer/store.js
@@ -30,12 +30,6 @@ export default class Store {
}
}
- @action unsubscribe () {
- if (this._timeoutId) {
- clearTimeout(this._timeoutId);
- }
- }
-
@action setBalance = (address, balance) => {
this.setBalances({ [address]: balance });
}
@@ -50,6 +44,12 @@ export default class Store {
}
}
+ @action unsubscribe () {
+ if (this._timeoutId) {
+ clearTimeout(this._timeoutId);
+ }
+ }
+
fetchBalance (address) {
this._api.eth
.getBalance(address)
diff --git a/js/src/views/Status/components/Debug/Debug.css b/js/src/views/Status/components/Debug/debug.css
similarity index 100%
rename from js/src/views/Status/components/Debug/Debug.css
rename to js/src/views/Status/components/Debug/debug.css
diff --git a/js/src/views/Status/components/Debug/Debug.js b/js/src/views/Status/components/Debug/debug.js
similarity index 99%
rename from js/src/views/Status/components/Debug/Debug.js
rename to js/src/views/Status/components/Debug/debug.js
index 84ce1bb8716..438d208f9a8 100644
--- a/js/src/views/Status/components/Debug/Debug.js
+++ b/js/src/views/Status/components/Debug/debug.js
@@ -22,7 +22,7 @@ import ReorderIcon from 'material-ui/svg-icons/action/reorder';
import { Container } from '~/ui';
-import styles from './Debug.css';
+import styles from './debug.css';
export default class Debug extends Component {
static propTypes = {
diff --git a/js/src/views/Status/components/Debug/index.js b/js/src/views/Status/components/Debug/index.js
index 9e8eae2198a..c6b522c46c1 100644
--- a/js/src/views/Status/components/Debug/index.js
+++ b/js/src/views/Status/components/Debug/index.js
@@ -14,4 +14,4 @@
// You should have received a copy of the GNU General Public License
// along with Parity. If not, see
.
-export default from './Debug';
+export default from './debug';
diff --git a/js/src/views/Status/components/MiningSettings/index.js b/js/src/views/Status/components/MiningSettings/index.js
index 3eee1e0516b..7853e0d33ce 100644
--- a/js/src/views/Status/components/MiningSettings/index.js
+++ b/js/src/views/Status/components/MiningSettings/index.js
@@ -14,4 +14,4 @@
// You should have received a copy of the GNU General Public License
// along with Parity. If not, see
.
-export default from './MiningSettings';
+export default from './miningSettings';
diff --git a/js/src/views/Status/components/MiningSettings/MiningSettings.js b/js/src/views/Status/components/MiningSettings/miningSettings.js
similarity index 100%
rename from js/src/views/Status/components/MiningSettings/MiningSettings.js
rename to js/src/views/Status/components/MiningSettings/miningSettings.js
diff --git a/js/src/views/Status/components/Status/index.js b/js/src/views/Status/components/Status/index.js
index 8885a04c6cf..44079b22485 100644
--- a/js/src/views/Status/components/Status/index.js
+++ b/js/src/views/Status/components/Status/index.js
@@ -14,4 +14,4 @@
// You should have received a copy of the GNU General Public License
// along with Parity. If not, see
.
-export default from './Status';
+export default from './status';
diff --git a/js/src/views/Status/components/Status/Status.css b/js/src/views/Status/components/Status/status.css
similarity index 90%
rename from js/src/views/Status/components/Status/Status.css
rename to js/src/views/Status/components/Status/status.css
index d79d41062de..229e72ce1c4 100644
--- a/js/src/views/Status/components/Status/Status.css
+++ b/js/src/views/Status/components/Status/status.css
@@ -28,10 +28,19 @@
content: '';
}
-.blockinfo {
- font-size: 24px;
+.blockInfo {
color: #aaa;
- line-height: 24px;
+ font-size: 1.5em;
+ line-height: 1.5em;
+}
+
+.blockByline {
+ color: #aaa;
+ font-size: 0.75em;
+}
+
+.padBottom {
+ padding-bottom: 1.25em !important;
}
.col,
diff --git a/js/src/views/Status/components/Status/Status.js b/js/src/views/Status/components/Status/status.js
similarity index 84%
rename from js/src/views/Status/components/Status/Status.js
rename to js/src/views/Status/components/Status/status.js
index e2d65cb9a2f..891ec66324b 100644
--- a/js/src/views/Status/components/Status/Status.js
+++ b/js/src/views/Status/components/Status/status.js
@@ -14,14 +14,16 @@
// You should have received a copy of the GNU General Public License
// along with Parity. If not, see
.
-import React, { Component, PropTypes } from 'react';
import bytes from 'bytes';
+import moment from 'moment';
+import React, { Component, PropTypes } from 'react';
import { Container, ContainerTitle, Input } from '~/ui';
-import styles from './Status.css';
import MiningSettings from '../MiningSettings';
+import styles from './status.css';
+
export default class Status extends Component {
static propTypes = {
nodeStatus: PropTypes.object.isRequired,
@@ -44,23 +46,26 @@ export default class Status extends Component {
-
+
-
+
#{ nodeStatus.blockNumber.toFormat() }
-
+
+
+ { moment().calendar(nodeStatus.blockTimestamp) }
+
-
+
-
+
-
+
{ `${hashrate} H/s` }
-
+
diff --git a/js/src/views/Status/containers/StatusPage/index.js b/js/src/views/Status/containers/StatusPage/index.js
index e36bc949c3d..0e141a16db4 100644
--- a/js/src/views/Status/containers/StatusPage/index.js
+++ b/js/src/views/Status/containers/StatusPage/index.js
@@ -14,4 +14,4 @@
// You should have received a copy of the GNU General Public License
// along with Parity. If not, see
.
-export default from './StatusPage';
+export default from './statusPage';
diff --git a/js/src/views/Status/status.css b/js/src/views/Status/containers/StatusPage/statusPage.css
similarity index 93%
rename from js/src/views/Status/status.css
rename to js/src/views/Status/containers/StatusPage/statusPage.css
index 0ed554ae645..bda975813e9 100644
--- a/js/src/views/Status/status.css
+++ b/js/src/views/Status/containers/StatusPage/statusPage.css
@@ -14,5 +14,9 @@
/* You should have received a copy of the GNU General Public License
/* along with Parity. If not, see
.
*/
-.container {
+
+.body {
+ &>div {
+ margin-bottom: 0.25em;
+ }
}
diff --git a/js/src/views/Status/containers/StatusPage/StatusPage.js b/js/src/views/Status/containers/StatusPage/statusPage.js
similarity index 95%
rename from js/src/views/Status/containers/StatusPage/StatusPage.js
rename to js/src/views/Status/containers/StatusPage/statusPage.js
index c7ab56c5e72..286e2c20ecf 100644
--- a/js/src/views/Status/containers/StatusPage/StatusPage.js
+++ b/js/src/views/Status/containers/StatusPage/statusPage.js
@@ -23,6 +23,8 @@ import { clearStatusLogs, toggleStatusLogs, toggleStatusRefresh } from '~/redux/
import Debug from '../../components/Debug';
import Status from '../../components/Status';
+import styles from './statusPage.css';
+
class StatusPage extends Component {
static propTypes = {
nodeStatus: PropTypes.object.isRequired,
@@ -39,7 +41,7 @@ class StatusPage extends Component {
render () {
return (
-
+
diff --git a/js/src/views/Status/status.js b/js/src/views/Status/status.js
index ff13f1a078e..805c9685098 100644
--- a/js/src/views/Status/status.js
+++ b/js/src/views/Status/status.js
@@ -16,22 +16,16 @@
import React, { Component } from 'react';
-import { Actionbar, Page } from '~/ui';
+import { Page } from '~/ui';
import StatusPage from './containers/StatusPage';
-import styles from './status.css';
-
export default class Status extends Component {
render () {
return (
-
+
+
+
);
}
}