From 96859b0f54b3126e137db7b8eeab6e967d723318 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=C5=81ukasz=20Magiera?= Date: Wed, 18 Sep 2019 19:53:48 +0200 Subject: [PATCH 1/3] Basic single node UI --- cli/auth.go | 41 ++++++++++++ cli/cmd.go | 1 + lotuspond/front/package-lock.json | 102 ++++++++++++++++++++++++++++++ lotuspond/front/package.json | 1 + lotuspond/front/src/App.js | 93 +++++++++++++++++++-------- lotuspond/front/src/App.test.js | 4 +- lotuspond/front/src/Client.js | 4 +- lotuspond/front/src/FullNode.js | 9 ++- lotuspond/front/src/Pond.js | 55 ++++++++++++++++ lotuspond/front/src/SingleNode.js | 64 +++++++++++++++++++ 10 files changed, 340 insertions(+), 34 deletions(-) create mode 100644 cli/auth.go create mode 100644 lotuspond/front/src/Pond.js create mode 100644 lotuspond/front/src/SingleNode.js diff --git a/cli/auth.go b/cli/auth.go new file mode 100644 index 00000000000..f4b5ea13299 --- /dev/null +++ b/cli/auth.go @@ -0,0 +1,41 @@ +package cli + +import ( + "fmt" + + "gopkg.in/urfave/cli.v2" + + "github.com/filecoin-project/go-lotus/api" +) + +var authCmd = &cli.Command{ + Name: "auth", + Usage: "Manage RPC permissions", + Subcommands: []*cli.Command{ + authCreateAdminToken, + }, +} + +var authCreateAdminToken = &cli.Command{ + Name: "create-admin-token", + Usage: "Create admin token", + Action: func(cctx *cli.Context) error { + napi, err := GetFullNodeAPI(cctx) + if err != nil { + return err + } + ctx := ReqContext(cctx) + + // TODO: Probably tell the user how powerful this token is + + token, err := napi.AuthNew(ctx, api.AllPermissions) + if err != nil { + return err + } + + // TODO: Log in audit log when it is implemented + + fmt.Println(string(token)) + return nil + }, +} diff --git a/cli/cmd.go b/cli/cmd.go index afeec86b929..631d0d49dc6 100644 --- a/cli/cmd.go +++ b/cli/cmd.go @@ -110,6 +110,7 @@ func ReqContext(cctx *cli.Context) context.Context { } var Commands = []*cli.Command{ + authCmd, chainCmd, clientCmd, createMinerCmd, diff --git a/lotuspond/front/package-lock.json b/lotuspond/front/package-lock.json index 10b714fb5b3..907aea84d27 100644 --- a/lotuspond/front/package-lock.json +++ b/lotuspond/front/package-lock.json @@ -5816,6 +5816,11 @@ "resolved": "https://registry.npmjs.org/growly/-/growly-1.3.0.tgz", "integrity": "sha1-8QdIy+dq+WS3yWyTxrzCivEgwIE=" }, + "gud": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/gud/-/gud-1.0.0.tgz", + "integrity": "sha512-zGEOVKFM5sVPPrYs7J5/hYEw2Pof8KCyOwyhG8sAF26mCAeUFAcYPu1mwB7hhpIP29zOIBaDqwuHdLp0jvZXjw==" + }, "gzip-size": { "version": "5.0.0", "resolved": "https://registry.npmjs.org/gzip-size/-/gzip-size-5.0.0.tgz", @@ -5957,6 +5962,19 @@ "resolved": "https://registry.npmjs.org/hex-color-regex/-/hex-color-regex-1.1.0.tgz", "integrity": "sha512-l9sfDFsuqtOqKDsQdqrMRk0U85RZc0RtOR9yPI7mRVOa4FsR/BVnZ0shmQRM96Ji99kYZP/7hn1cedc1+ApsTQ==" }, + "history": { + "version": "4.10.1", + "resolved": "https://registry.npmjs.org/history/-/history-4.10.1.tgz", + "integrity": "sha512-36nwAD620w12kuzPAsyINPWJqlNbij+hpK1k9XRloDtym8mxzGYl2c17LnV6IAGB2Dmg4tEa7G7DlawS0+qjew==", + "requires": { + "@babel/runtime": "^7.1.2", + "loose-envify": "^1.2.0", + "resolve-pathname": "^3.0.0", + "tiny-invariant": "^1.0.2", + "tiny-warning": "^1.0.0", + "value-equal": "^1.0.1" + } + }, "hmac-drbg": { "version": "1.0.1", "resolved": "https://registry.npmjs.org/hmac-drbg/-/hmac-drbg-1.0.1.tgz", @@ -8378,6 +8396,16 @@ "resolved": "https://registry.npmjs.org/mimic-fn/-/mimic-fn-1.2.0.tgz", "integrity": "sha512-jf84uxzwiuiIVKiOLpfYk7N46TSy8ubTonmneY9vrpHNAnp0QBt2BxWV9dO3/j+BoVAb+a5G6YDPW3M5HOdMWQ==" }, + "mini-create-react-context": { + "version": "0.3.2", + "resolved": "https://registry.npmjs.org/mini-create-react-context/-/mini-create-react-context-0.3.2.tgz", + "integrity": "sha512-2v+OeetEyliMt5VHMXsBhABoJ0/M4RCe7fatd/fBy6SMiKazUSEt3gxxypfnk2SHMkdBYvorHRoQxuGoiwbzAw==", + "requires": { + "@babel/runtime": "^7.4.0", + "gud": "^1.0.0", + "tiny-warning": "^1.0.2" + } + }, "mini-css-extract-plugin": { "version": "0.5.0", "resolved": "https://registry.npmjs.org/mini-css-extract-plugin/-/mini-css-extract-plugin-0.5.0.tgz", @@ -10521,6 +10549,60 @@ "resolved": "https://registry.npmjs.org/react-is/-/react-is-16.8.6.tgz", "integrity": "sha512-aUk3bHfZ2bRSVFFbbeVS4i+lNPZr3/WM5jT2J5omUVV1zzcs1nAaf3l51ctA5FFvCRbhrH0bdAsRRQddFJZPtA==" }, + "react-router": { + "version": "5.0.1", + "resolved": "https://registry.npmjs.org/react-router/-/react-router-5.0.1.tgz", + "integrity": "sha512-EM7suCPNKb1NxcTZ2LEOWFtQBQRQXecLxVpdsP4DW4PbbqYWeRiLyV/Tt1SdCrvT2jcyXAXmVTmzvSzrPR63Bg==", + "requires": { + "@babel/runtime": "^7.1.2", + "history": "^4.9.0", + "hoist-non-react-statics": "^3.1.0", + "loose-envify": "^1.3.1", + "mini-create-react-context": "^0.3.0", + "path-to-regexp": "^1.7.0", + "prop-types": "^15.6.2", + "react-is": "^16.6.0", + "tiny-invariant": "^1.0.2", + "tiny-warning": "^1.0.0" + }, + "dependencies": { + "hoist-non-react-statics": { + "version": "3.3.0", + "resolved": "https://registry.npmjs.org/hoist-non-react-statics/-/hoist-non-react-statics-3.3.0.tgz", + "integrity": "sha512-0XsbTXxgiaCDYDIWFcwkmerZPSwywfUqYmwT4jzewKTQSWoE6FCMoUVOeBJWK3E/CrWbxRG3m5GzY4lnIwGRBA==", + "requires": { + "react-is": "^16.7.0" + } + }, + "isarray": { + "version": "0.0.1", + "resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz", + "integrity": "sha1-ihis/Kmo9Bd+Cav8YDiTmwXR7t8=" + }, + "path-to-regexp": { + "version": "1.7.0", + "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-1.7.0.tgz", + "integrity": "sha1-Wf3g9DW62suhA6hOnTvGTpa5k30=", + "requires": { + "isarray": "0.0.1" + } + } + } + }, + "react-router-dom": { + "version": "5.0.1", + "resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-5.0.1.tgz", + "integrity": "sha512-zaVHSy7NN0G91/Bz9GD4owex5+eop+KvgbxXsP/O+iW1/Ln+BrJ8QiIR5a6xNPtrdTvLkxqlDClx13QO1uB8CA==", + "requires": { + "@babel/runtime": "^7.1.2", + "history": "^4.9.0", + "loose-envify": "^1.3.1", + "prop-types": "^15.6.2", + "react-router": "5.0.1", + "tiny-invariant": "^1.0.2", + "tiny-warning": "^1.0.0" + } + }, "react-scripts": { "version": "3.0.1", "resolved": "https://registry.npmjs.org/react-scripts/-/react-scripts-3.0.1.tgz", @@ -10887,6 +10969,11 @@ "resolved": "https://registry.npmjs.org/resolve-from/-/resolve-from-3.0.0.tgz", "integrity": "sha1-six699nWiBvItuZTM17rywoYh0g=" }, + "resolve-pathname": { + "version": "3.0.0", + "resolved": "https://registry.npmjs.org/resolve-pathname/-/resolve-pathname-3.0.0.tgz", + "integrity": "sha512-C7rARubxI8bXFNB/hqcp/4iUeIXJhJZvFPFPiSPRnhU5UPxzMFIl+2E6yY6c4k9giDJAhtV+enfA+G89N6Csng==" + }, "resolve-url": { "version": "0.2.1", "resolved": "https://registry.npmjs.org/resolve-url/-/resolve-url-0.2.1.tgz", @@ -12083,6 +12170,16 @@ "resolved": "https://registry.npmjs.org/timsort/-/timsort-0.3.0.tgz", "integrity": "sha1-QFQRqOfmM5/mTbmiNN4R3DHgK9Q=" }, + "tiny-invariant": { + "version": "1.0.6", + "resolved": "https://registry.npmjs.org/tiny-invariant/-/tiny-invariant-1.0.6.tgz", + "integrity": "sha512-FOyLWWVjG+aC0UqG76V53yAWdXfH8bO6FNmyZOuUrzDzK8DI3/JRY25UD7+g49JWM1LXwymsKERB+DzI0dTEQA==" + }, + "tiny-warning": { + "version": "1.0.3", + "resolved": "https://registry.npmjs.org/tiny-warning/-/tiny-warning-1.0.3.tgz", + "integrity": "sha512-lBN9zLN/oAf68o3zNXYrdCt1kP8WsiGW8Oo2ka41b2IM5JL/S1CTyX1rW0mb/zSuJun0ZUrDxx4sqvYS2FWzPA==" + }, "tmp": { "version": "0.0.33", "resolved": "https://registry.npmjs.org/tmp/-/tmp-0.0.33.tgz", @@ -12478,6 +12575,11 @@ "spdx-expression-parse": "^3.0.0" } }, + "value-equal": { + "version": "1.0.1", + "resolved": "https://registry.npmjs.org/value-equal/-/value-equal-1.0.1.tgz", + "integrity": "sha512-NOJ6JZCAWr0zlxZt+xqCHNTEKOsrks2HQd4MqhP1qy4z1SkbEP467eNx6TgDKXMvUOb+OENfJCZwM+16n7fRfw==" + }, "varint": { "version": "5.0.0", "resolved": "https://registry.npmjs.org/varint/-/varint-5.0.0.tgz", diff --git a/lotuspond/front/package.json b/lotuspond/front/package.json index e1adde73a78..a5f3976125a 100644 --- a/lotuspond/front/package.json +++ b/lotuspond/front/package.json @@ -11,6 +11,7 @@ "react": "^16.8.6", "react-cristal": "^0.0.12", "react-dom": "^16.8.6", + "react-router-dom": "^5.0.1", "react-scripts": "3.0.1", "rpc-websockets": "^4.5.1", "styled-components": "^3.3.3", diff --git a/lotuspond/front/src/App.js b/lotuspond/front/src/App.js index e2ea90732bd..0e1dc719524 100644 --- a/lotuspond/front/src/App.js +++ b/lotuspond/front/src/App.js @@ -1,53 +1,92 @@ import React from 'react'; import './App.css'; -import { Client } from 'rpc-websockets' -import NodeList from "./NodeList"; +import { BrowserRouter as Router, Route, Link } from "react-router-dom"; +import Pond from "./Pond"; +import SingleNode from "./SingleNode"; - -class App extends React.Component { +class Index extends React.Component { constructor(props) { super(props) - const client = new Client('ws://127.0.0.1:2222/rpc/v0') - client.on('open', () => { - this.setState(() => ({client: client})) - }) + this.state = {rpcUrl: "ws://127.0.0.1:1234/rpc/v0", rpcToken: ''} - this.state = { - windows: {}, - nextWindow: 0, + const initialState = JSON.parse(window.localStorage.getItem('saved-nodes')) + if (initialState) { + this.state.nodes = initialState + } else { + this.state.nodes = [] } - - this.mountWindow = this.mountWindow.bind(this) } - mountWindow(cb) { - const id = this.state.nextWindow - this.setState({nextWindow: id + 1}) - - const window = cb(() => { - this.setState(prev => ({windows: {...prev.windows, [id]: undefined}})) - }) + componentDidUpdate(prevProps, prevState, snapshot) { + window.localStorage.setItem('saved-nodes', JSON.stringify(this.state.nodes)) + } - this.setState(prev => ({windows: {...prev.windows, [id]: window}})) + onAdd = () => { + this.setState({addingNode: true}) } - render() { - if (this.state.client === undefined) { + update = (name) => (e) => this.setState({ [name]: e.target.value }) + + tokenOk = () => { + let m = this.state.rpcToken.match(/\.(.+)\./) + // TODO: eww + if(m && atob(m[1]) === '{"Allow":["read","write","sign","admin"]}') { return ( + -Token OK-
- Connecting to RPC +
+
) } + return -Expecting valid admin token- + } + + addNode = async () => { + this.setState(p => ({nodes: [...p.nodes, {addr: this.state.rpcUrl, token: this.state.rpcToken}], addingNode: true})) + } + render() { return ( -
- +
+
Open Pond
+
----------------
+
+
Managed Nodes:
+ { + this.state.nodes.map((node, i) =>
+ {i}. {node.addr} [OPEN UI] +
) + } +
+ + +
+ ) + } +} + +class App extends React.Component { + constructor(props) { + super(props) + } + + render() { + return ( + + + + + ) } } diff --git a/lotuspond/front/src/App.test.js b/lotuspond/front/src/App.test.js index a754b201bf9..b63d6b53a2f 100644 --- a/lotuspond/front/src/App.test.js +++ b/lotuspond/front/src/App.test.js @@ -1,9 +1,9 @@ import React from 'react'; import ReactDOM from 'react-dom'; -import App from './App'; +import Pond from './Pond'; it('renders without crashing', () => { const div = document.createElement('div'); - ReactDOM.render(, div); + ReactDOM.render(, div); ReactDOM.unmountComponentAtNode(div); }); diff --git a/lotuspond/front/src/Client.js b/lotuspond/front/src/Client.js index 8a4472ddd89..a1c7e20224d 100644 --- a/lotuspond/front/src/Client.js +++ b/lotuspond/front/src/Client.js @@ -70,7 +70,7 @@ class Client extends React.Component { let ppb = Math.round(this.state.total / this.state.blocks * 100) / 100 let ppmbb = Math.round(ppb / (this.state.kbs / 1000) * 100) / 100 - let dealMaker =
+ let dealMaker = ) - return + return
{dealMaker}
{deals}
diff --git a/lotuspond/front/src/FullNode.js b/lotuspond/front/src/FullNode.js index 7889e91c3f4..232c167a5c1 100644 --- a/lotuspond/front/src/FullNode.js +++ b/lotuspond/front/src/FullNode.js @@ -121,7 +121,7 @@ class FullNode extends React.Component { miners = this.state.minerList.map((a, k) =>
) } - let storageMine = [Spawn Storage Miner] + let storageMine = let addresses = this.state.addrs.map((addr) => { let line =
@@ -167,10 +167,13 @@ class FullNode extends React.Component { ) } + let nodeID = this.props.node.ID ? this.props.node.ID : '' + let nodePos = this.props.node.ID ? {x: this.props.node.ID*30, y: this.props.node.ID * 30} : undefined + return (
diff --git a/lotuspond/front/src/Pond.js b/lotuspond/front/src/Pond.js new file mode 100644 index 00000000000..ae3726540db --- /dev/null +++ b/lotuspond/front/src/Pond.js @@ -0,0 +1,55 @@ +import React from 'react'; +import './App.css'; +import { Client } from 'rpc-websockets' +import NodeList from "./NodeList"; + + +class Pond extends React.Component { + constructor(props) { + super(props) + + const client = new Client('ws://127.0.0.1:2222/rpc/v0') + client.on('open', () => { + this.setState(() => ({client: client})) + }) + + this.state = { + windows: {}, + nextWindow: 0, + } + + this.mountWindow = this.mountWindow.bind(this) + } + + mountWindow(cb) { + const id = this.state.nextWindow + this.setState({nextWindow: id + 1}) + + const window = cb(() => { + this.setState(prev => ({windows: {...prev.windows, [id]: undefined}})) + }) + + this.setState(prev => ({windows: {...prev.windows, [id]: window}})) + } + + render() { + if (this.state.client === undefined) { + return ( +
+ Connecting to RPC +
+ ) + } + + return ( +
+ +
+ {Object.keys(this.state.windows).map((w, i) =>
{this.state.windows[w]}
)} +
+
+ ) + } +} + +export default Pond diff --git a/lotuspond/front/src/SingleNode.js b/lotuspond/front/src/SingleNode.js new file mode 100644 index 00000000000..941d96185d6 --- /dev/null +++ b/lotuspond/front/src/SingleNode.js @@ -0,0 +1,64 @@ +import React from 'react'; +import './App.css'; +import {Client} from "rpc-websockets"; +import FullNode from "./FullNode"; + +class SingleNode extends React.Component { + constructor(props) { + super(props) + + const nodes = JSON.parse(window.localStorage.getItem('saved-nodes')) + const node = nodes[this.props.match.params.node] + + const client = new Client(`${node.addr}?token=${node.token}`) + client.on('open', async () => { + this.setState(() => ({client: client})) + }) + + this.state = { + windows: {}, + nextWindow: 0, + + addr: node.addr + } + } + + mountWindow = (cb) => { + const id = this.state.nextWindow + this.setState({nextWindow: id + 1}) + + const window = cb(() => { + this.setState(prev => ({windows: {...prev.windows, [id]: undefined}})) + }) + + this.setState(prev => ({windows: {...prev.windows, [id]: window}})) + } + + render() { + if (this.state.client === undefined) { + return ( +
+ Connecting to Node RPC: {`${this.state.addr}?token=****`} +
+ ) + } + + let node = + + return ( +
+ {node} +
+ {Object.keys(this.state.windows).map((w, i) =>
{this.state.windows[w]}
)} +
+
+ ) + } +} + +export default SingleNode; From 3ae0cc3388d7d8d570c03fbb831e1fd61094dffb Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=C5=81ukasz=20Magiera?= Date: Thu, 19 Sep 2019 02:50:23 +0200 Subject: [PATCH 2/3] pond: Some styles --- lotuspond/front/src/App.css | 115 ++++++++++++++++++++++++++++-- lotuspond/front/src/App.js | 36 +++++----- lotuspond/front/src/FullNode.js | 9 ++- lotuspond/front/src/SingleNode.js | 7 +- lotuspond/front/src/Window.js | 15 ++++ 5 files changed, 152 insertions(+), 30 deletions(-) create mode 100644 lotuspond/front/src/Window.js diff --git a/lotuspond/front/src/App.css b/lotuspond/front/src/App.css index 02f4c2a8834..41a8d2dfede 100644 --- a/lotuspond/front/src/App.css +++ b/lotuspond/front/src/App.css @@ -1,11 +1,117 @@ +.Index { + width: 100vw; + height: 100vh; + background: #1a1a1a; + color: #f0f0f0; + font-family: monospace; + + display: grid; + grid-template-columns: auto 40vw auto; + grid-template-rows: auto auto auto 3em; + grid-template-areas: + ". . ." + ". main ." + ". . ." + "footer footer footer"; +} + +.Index-footer { + background: #2a2a2a; + grid-area: footer; +} + +.Index-footer > div { + padding-left: 0.7em; + padding-top: 0.7em; +} + +.Index-nodes { + grid-area: main; + background: #2a2a2a; +} + +.Index-node { + margin: 5px; + padding: 15px; + background: #1f1f1f; +} + +.Index-addwrap { + margin-top: 5px; +} + +/* SingleNode */ + + +.SingleNode-connecting { + width: 100vw; + height: 100vh; + + background: #1a1a1a; + color: #ffffff; + font-family: monospace; + + display: grid; + grid-template-columns: auto min-content auto; + grid-template-rows: auto min-content auto; + grid-template-areas: + ". . ." + ". main ." + ". . ." +} + +.SingleNode-connecting > div { + grid-area: main; + padding: 15px; + white-space: nowrap; + background: #2a2a2a; +} + + + +/*****/ + +a:link { + color: #50f020; +} + +a:visited { + color: #50f020; +} + +a:hover { + color: #10a010; +} + +.Button { + display: inline-block; + padding: 15px; + background: #1f1f1f; + margin-left: 5px; +} + +.Window { + background: #2a2a2a !important; + color: #f0f0f0; +} + +.Window > :first-child > :nth-child(2)::before { + background: #f0f0f0; +} + +.Window > :first-child > :nth-child(2)::after { + background: #f0f0f0; +} + +/* POND */ + .App { min-height: 100vh; - background: #b7c4cd; + background: #1a1a1a; font-family: monospace; } .NodeList { - background: #f9be77; user-select: text; font-family: monospace; min-width: 40em; @@ -13,7 +119,6 @@ } .FullNode { - background: #f9be77; user-select: text; font-family: monospace; min-width: 50em; @@ -25,7 +130,6 @@ } .StorageNode { - background: #f9be77; user-select: text; font-family: monospace; min-width: 40em; @@ -33,7 +137,6 @@ } .Block { - background: #f9be77; user-select: text; font-family: monospace; min-width: 50em; @@ -41,7 +144,6 @@ } .State { - background: #f9be77; user-select: text; font-family: monospace; min-width: 40em; @@ -49,7 +151,6 @@ } .Client { - background: #f9be77; user-select: text; font-family: monospace; display: inline-block; diff --git a/lotuspond/front/src/App.js b/lotuspond/front/src/App.js index 0e1dc719524..e5761e0830f 100644 --- a/lotuspond/front/src/App.js +++ b/lotuspond/front/src/App.js @@ -49,25 +49,29 @@ class Index extends React.Component { render() { return ( -
-
Open Pond
-
----------------
-
-
Managed Nodes:
- { - this.state.nodes.map((node, i) =>
- {i}. {node.addr} [OPEN UI] -
) - } -
- - - + ) } } diff --git a/lotuspond/front/src/SingleNode.js b/lotuspond/front/src/SingleNode.js index 941d96185d6..a9da918f998 100644 --- a/lotuspond/front/src/SingleNode.js +++ b/lotuspond/front/src/SingleNode.js @@ -37,8 +37,11 @@ class SingleNode extends React.Component { render() { if (this.state.client === undefined) { return ( -
- Connecting to Node RPC: {`${this.state.addr}?token=****`} +
+
+
Connecting to Node RPC:
+
{`${this.state.addr}?token=****`}
+
) } diff --git a/lotuspond/front/src/Window.js b/lotuspond/front/src/Window.js new file mode 100644 index 00000000000..b3dd4340f1b --- /dev/null +++ b/lotuspond/front/src/Window.js @@ -0,0 +1,15 @@ +import React from 'react' +import {Cristal} from "react-cristal"; + +class Window extends React.Component { + render() { + let props = {className: '', ...this.props} + props.className = `${props.className} Window` + + return + {this.props.children} + + } +} + +export default Window From 6d71929fcc0ce7e1bf6241c622d8ad6d79bb08f1 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=C5=81ukasz=20Magiera?= Date: Thu, 19 Sep 2019 16:27:01 +0200 Subject: [PATCH 3/3] pond: More dark CSS --- lotuspond/front/src/Address.js | 2 +- lotuspond/front/src/App.css | 21 +++++++++++++++++---- lotuspond/front/src/Block.js | 6 +++--- lotuspond/front/src/ChainExplorer.js | 6 +++--- lotuspond/front/src/Client.js | 6 +++--- lotuspond/front/src/ConnMgr.js | 6 +++--- lotuspond/front/src/Consensus.js | 6 +++--- lotuspond/front/src/Logs.js | 6 +++--- lotuspond/front/src/NodeList.js | 6 +++--- lotuspond/front/src/State.js | 6 +++--- lotuspond/front/src/StorageNode.js | 6 +++--- lotuspond/front/src/StorageNodeInit.js | 7 +++---- 12 files changed, 48 insertions(+), 36 deletions(-) diff --git a/lotuspond/front/src/Address.js b/lotuspond/front/src/Address.js index 3b98b0f6f68..b41f3cdcb7c 100644 --- a/lotuspond/front/src/Address.js +++ b/lotuspond/front/src/Address.js @@ -105,7 +105,7 @@ class Address extends React.Component { } addr = sheet.sheet.insertRule(`.pondaddr-${this.props.addr}, .pondaddr-${this.props.addr} * { color: #11ee11; }`, 0)} + onMouseEnter={() => sheet.sheet.insertRule(`.pondaddr-${this.props.addr}, .pondaddr-${this.props.addr} * { color: #11ee11 !important; }`, 0)} onMouseLeave={() => sheet.sheet.deleteRule(0)} >{addr} diff --git a/lotuspond/front/src/App.css b/lotuspond/front/src/App.css index 41a8d2dfede..2cbf61f5f54 100644 --- a/lotuspond/front/src/App.css +++ b/lotuspond/front/src/App.css @@ -80,7 +80,7 @@ a:visited { } a:hover { - color: #10a010; + color: #30a00a; } .Button { @@ -92,6 +92,10 @@ a:hover { .Window { background: #2a2a2a !important; + color: #e0e0e0; +} + +.Window b { color: #f0f0f0; } @@ -103,6 +107,14 @@ a:hover { background: #f0f0f0; } +.Window a:link { + color: #30a015; +} + +.Window a:visited { + color: #30a015; +} + /* POND */ .App { @@ -169,19 +181,20 @@ a:hover { .ChainExplorer { font-family: monospace; + color: #d0d0d0; } .ChainExplorer-at { min-width: 40em; - background: #77ff77; + background: #222222; } .ChainExplorer-after { - background: #cc9c44 + background: #440000 } .ChainExplorer-before { - background: #cccc00 + background: #444400 } .Logs { diff --git a/lotuspond/front/src/Block.js b/lotuspond/front/src/Block.js index bc797d22789..ee273695eb0 100644 --- a/lotuspond/front/src/Block.js +++ b/lotuspond/front/src/Block.js @@ -1,7 +1,7 @@ import React from 'react'; -import {Cristal} from "react-cristal"; import {BlockLinks} from "./BlockLink"; import Address from "./Address"; +import Window from "./Window"; class Block extends React.Component { constructor(props) { @@ -57,9 +57,9 @@ class Block extends React.Component { ) } - return ( + return ( {content} - ) + ) } } diff --git a/lotuspond/front/src/ChainExplorer.js b/lotuspond/front/src/ChainExplorer.js index d9609614f9c..5aa6dbf064e 100644 --- a/lotuspond/front/src/ChainExplorer.js +++ b/lotuspond/front/src/ChainExplorer.js @@ -1,6 +1,6 @@ import React from 'react'; -import {Cristal} from "react-cristal"; import {BlockLinks} from "./BlockLink"; +import Window from "./Window"; const rows = 32 @@ -132,9 +132,9 @@ class ChainExplorer extends React.Component { return
@{row} {info}
})}
- return ( + return ( {content} - ) + ) } } diff --git a/lotuspond/front/src/Client.js b/lotuspond/front/src/Client.js index a1c7e20224d..56aa82ffe5d 100644 --- a/lotuspond/front/src/Client.js +++ b/lotuspond/front/src/Client.js @@ -1,6 +1,6 @@ import React from 'react'; -import Cristal from 'react-cristal' import Address from "./Address"; +import Window from "./Window"; const dealStates = [ "Unknown", @@ -94,12 +94,12 @@ class Client extends React.Component {
) - return + return
{dealMaker}
{deals}
-
+ } } diff --git a/lotuspond/front/src/ConnMgr.js b/lotuspond/front/src/ConnMgr.js index 24beee6f205..c53601883de 100644 --- a/lotuspond/front/src/ConnMgr.js +++ b/lotuspond/front/src/ConnMgr.js @@ -1,5 +1,5 @@ import React from 'react'; -import Cristal from 'react-cristal' +import Window from "./Window"; async function awaitReducer(prev, c) { return {...await prev, ...await c} @@ -107,7 +107,7 @@ class ConnMgr extends React.Component { }) return( - + {keys.slice(0, -1).map((i) => ())}{rows} @@ -118,7 +118,7 @@ class ConnMgr extends React.Component { - + ) } } diff --git a/lotuspond/front/src/Consensus.js b/lotuspond/front/src/Consensus.js index 0d817f81d14..86b1362a47b 100644 --- a/lotuspond/front/src/Consensus.js +++ b/lotuspond/front/src/Consensus.js @@ -1,6 +1,6 @@ import React from 'react'; -import {Cristal} from "react-cristal"; import {BlockLinks} from "./BlockLink"; +import Window from "./Window"; function styleForHDiff(max, act) { switch (max - act) { @@ -42,7 +42,7 @@ class Consensus extends React.Component { } render() { - return ( + return (
Max Height: {this.state.maxH}
@@ -62,7 +62,7 @@ class Consensus extends React.Component {
{i}
-
) + ) } } diff --git a/lotuspond/front/src/Logs.js b/lotuspond/front/src/Logs.js index ec98feb79f2..3bcf2bbaf64 100644 --- a/lotuspond/front/src/Logs.js +++ b/lotuspond/front/src/Logs.js @@ -1,9 +1,9 @@ import React from 'react' -import {Cristal} from "react-cristal"; import { Terminal } from 'xterm'; import { AttachAddon } from "xterm-addon-attach"; import 'xterm/dist/xterm.css'; import * as fit from 'xterm/lib/addons/fit/fit'; +import Window from "./Window"; class Logs extends React.Component { constructor(props) { @@ -22,9 +22,9 @@ class Logs extends React.Component { } render() { - return + return
- + } } diff --git a/lotuspond/front/src/NodeList.js b/lotuspond/front/src/NodeList.js index 5da9f05dc8f..093a336c433 100644 --- a/lotuspond/front/src/NodeList.js +++ b/lotuspond/front/src/NodeList.js @@ -2,12 +2,12 @@ import React from 'react'; import FullNode from "./FullNode"; import ConnMgr from "./ConnMgr"; import Consensus from "./Consensus"; -import {Cristal} from "react-cristal"; import StorageNode from "./StorageNode"; import {Client} from "rpc-websockets"; import pushMessage from "./chain/send"; import Logs from "./Logs"; import StorageNodeInit from "./StorageNodeInit"; +import Window from "./Window"; const [NodeUnknown, NodeRunning, NodeStopped] = [0, 1, 2] @@ -155,7 +155,7 @@ class NodeList extends React.Component { } return ( - +
@@ -190,7 +190,7 @@ class NodeList extends React.Component { {connMgr} {consensus}
- + ); } } diff --git a/lotuspond/front/src/State.js b/lotuspond/front/src/State.js index d8790ace9e1..70ddbc549c4 100644 --- a/lotuspond/front/src/State.js +++ b/lotuspond/front/src/State.js @@ -1,5 +1,5 @@ import React from 'react' -import {Cristal} from "react-cristal"; +import Window from "./Window"; class State extends React.Component { constructor(props) { @@ -21,9 +21,9 @@ class State extends React.Component {
{Object.keys(this.state.State).map(k =>
{k}: {JSON.stringify(this.state.State[k])}
)}
- return + return {content} - +
} } diff --git a/lotuspond/front/src/StorageNode.js b/lotuspond/front/src/StorageNode.js index 65d8388f09f..2c813605cf4 100644 --- a/lotuspond/front/src/StorageNode.js +++ b/lotuspond/front/src/StorageNode.js @@ -1,7 +1,7 @@ import React from 'react'; -import {Cristal} from "react-cristal"; import { Client } from 'rpc-websockets' import Address from "./Address"; +import Window from "./Window"; const stateConnected = 'connected' const stateConnecting = 'connecting' @@ -121,7 +121,7 @@ class StorageNode extends React.Component { ) } - return @@ -130,7 +130,7 @@ class StorageNode extends React.Component { {runtime}
- + } } diff --git a/lotuspond/front/src/StorageNodeInit.js b/lotuspond/front/src/StorageNodeInit.js index 45e802ec37d..bd9d5390ab4 100644 --- a/lotuspond/front/src/StorageNodeInit.js +++ b/lotuspond/front/src/StorageNodeInit.js @@ -1,6 +1,5 @@ import React from 'react'; -import {Cristal} from "react-cristal"; -import StorageNode from "./StorageNode"; +import Window from "./Window"; class StorageNodeInit extends React.Component { async componentDidMount() { @@ -11,7 +10,7 @@ class StorageNodeInit extends React.Component { } render() { - return
@@ -19,7 +18,7 @@ class StorageNodeInit extends React.Component { Waiting for init, make sure at least one miner is enabled
- + } }