From d814a45dffa6a872f6e336cad33ca41ffb102887 Mon Sep 17 00:00:00 2001 From: Dan Finlay Date: Wed, 13 Apr 2016 15:28:44 -0700 Subject: Moved UI into repo with its own dependency stack --- ui/app/config.js | 103 +++++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 103 insertions(+) create mode 100644 ui/app/config.js (limited to 'ui/app/config.js') diff --git a/ui/app/config.js b/ui/app/config.js new file mode 100644 index 000000000..33d87bcc2 --- /dev/null +++ b/ui/app/config.js @@ -0,0 +1,103 @@ +const inherits = require('util').inherits +const Component = require('react').Component +const h = require('react-hyperscript') +const connect = require('react-redux').connect +const actions = require('./actions') + +module.exports = connect(mapStateToProps)(ConfigScreen) + +function mapStateToProps(state) { + return { + rpc: state.metamask.rpcTarget, + metamask: state.metamask, + } +} + +inherits(ConfigScreen, Component) +function ConfigScreen() { + Component.call(this) +} + + +ConfigScreen.prototype.render = function() { + var state = this.props + var rpc = state.rpc + var metamaskState = state.metamask + + return ( + h('.flex-column.flex-grow', [ + + // subtitle and nav + h('.section-title.flex-row.flex-center', [ + h('i.fa.fa-arrow-left.fa-lg.cursor-pointer', { + onClick: (event) => { + state.dispatch(actions.showAccountsPage()) + } + }), + h('h2.page-subtitle', 'Configuration'), + ]), + + // conf view + h('.flex-column.flex-justify-center.flex-grow.select-none', [ + h('.flex-space-around', { + style: { + padding: '20px', + } + }, [ + + currentProviderDisplay(metamaskState), + + + h('div', [ + h('input', { + placeholder: 'New RPC URL', + style: { + width: '100%', + }, + onKeyPress(event) { + if (event.key === 'Enter') { + var element = event.target + var newRpc = element.value + state.dispatch(actions.setRpcTarget(newRpc)) + } + } + }), + ]), + + h('div', [ + h('button', { + style: { + alignSelf: 'center', + }, + onClick(event) { + event.preventDefault() + state.dispatch(actions.setRpcTarget('https://rpc.metamask.io/')) + } + }, 'Use Main Network') + ]), + + h('div', [ + h('button', { + style: { + alignSelf: 'center', + }, + onClick(event) { + event.preventDefault() + state.dispatch(actions.setRpcTarget('https://testrpc.metamask.io/')) + } + }, 'Use Morden Test Network') + ]), + + ]), + ]), + ]) + ) +} + +function currentProviderDisplay(metamaskState) { + var rpc = metamaskState.rpcTarget + return h('div', [ + h('h3', {style: { fontWeight: 'bold' }}, 'Currently using RPC'), + h('p', rpc) + ]) +} -- cgit