Merge pull request #136 from MetaMask/ChangeRpcButton

Add new rpc save button to config view

2 files changed, 34 insertions, 5 deletions

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 0099aa0ff..a3ffe84ab 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -7,6 +7,9 @@
 - Added transaction list to account detail view.
 - Fix bug on config screen where current RPC address was always displayed wrong.
 - Fixed bug where entering a decimal value when sending a transaction would result in sending the wrong amount.
+- Add save button to custom RPC input field.
+- Add quick-select button for RPC on `localhost:8545`.
+- Improve config view styling.
 - Users have been migrated from old test-net RPC to a newer test-net RPC.
 
 # 1.5.1 2016-04-15
diff --git a/ui/app/config.js b/ui/app/config.js
index 878c9955f..f4eecf7f8 100644
--- a/ui/app/config.js
+++ b/ui/app/config.js
@@ -47,11 +47,14 @@ ConfigScreen.prototype.render = function() {
 
           currentProviderDisplay(metamaskState),
 
-          h('div', [
-            h('input', {
+          h('div', { style: {display: 'flex'} }, [
+            h('input#new_rpc', {
               placeholder: 'New RPC URL',
               style: {
-                width: '100%',
+                width: 'inherit',
+                flex: '1 0 auto',
+                height: '30px',
+                margin: '8px',
               },
               onKeyPress(event) {
                 if (event.key === 'Enter') {
@@ -61,6 +64,17 @@ ConfigScreen.prototype.render = function() {
                 }
               }
             }),
+            h('button', {
+              style: {
+                alignSelf: 'center',
+              },
+              onClick(event) {
+                event.preventDefault()
+                var element = document.querySelector('input#new_rpc')
+                var newRpc = element.value
+                state.dispatch(actions.setRpcTarget(newRpc))
+              }
+            }, 'Save')
           ]),
 
           h('div', [
@@ -87,6 +101,18 @@ ConfigScreen.prototype.render = function() {
             }, 'Use Morden Test Network')
           ]),
 
+          h('div', [
+            h('button', {
+              style: {
+                alignSelf: 'center',
+              },
+              onClick(event) {
+                event.preventDefault()
+                state.dispatch(actions.setRpcTarget('http://localhost:8545/'))
+              }
+            }, 'Use http://localhost:8545')
+          ]),
+
         ]),
       ]),
     ])
@@ -96,7 +122,7 @@ ConfigScreen.prototype.render = function() {
 function currentProviderDisplay(metamaskState) {
   var rpc = metamaskState.provider.rpcTarget
   return h('div', [
-    h('h3', {style: { fontWeight: 'bold' }}, 'Currently using RPC'),
-    h('p', rpc)
+    h('span', {style: { fontWeight: 'bold', paddingRight: '10px'}}, 'Current RPC'),
+    h('span', rpc)
   ])
 }