Merge pull request #98 from poanetwork/increase-amount-of-custom-rpc

(Feature) Unlimited amount of custom RPC endpoints

CHANGELOG.md

@@ -2,6 +2,8 @@
 
 ## Current Master
 
+- [#98](https://github.com/poanetwork/metamask-extension/pull/98): (Feature) Unlimited amount of custom RPC
+
 ## 4.8.5 Mon Aug 27 2018
 
 - [#94](https://github.com/poanetwork/metamask-extension/pull/94): (Fix) Force open notification popup

app/scripts/controllers/preferences.js

@@ -311,8 +311,7 @@ class PreferencesController {
 
   /**
    * Returns an updated rpcList based on the passed url and the current list.
-   * The returned list will have a max length of 2. If the _url currently exists it the list, it will be moved to the
-   * end of the list. The current list is modified and returned as a promise.
+   * The returned list will have an unlimited length. The current list is modified and returned as a promise.
    *
    * @param {string} _url The rpc url to add to the frequentRpcList.
    * @returns {Promise<array>} The updated frequentRpcList.
@@ -327,9 +326,6 @@ class PreferencesController {
     if (_url !== 'http://localhost:8545') {
       rpcList.push(_url)
     }
-    if (rpcList.length > 2) {
-      rpcList.shift()
-    }
     return Promise.resolve(rpcList)
   }
 

old-ui/app/app.js

@@ -206,7 +206,6 @@ App.prototype.renderAppBar = function () {
             alignItems: 'center',
           },
         }, [
-
           props.isUnlocked && h(AccountDropdowns, {
             style: {},
             enableAccountsSelector: true,
@@ -259,8 +258,9 @@ App.prototype.renderNetworkDropdown = function () {
     style: {
       position: 'absolute',
       left: '2px',
-      top: '36px',
+      top: '38px',
       width: '270px',
+      maxHeight: isOpen ? '524px' : '0px',
     },
     innerStyle: {
       padding: '2px 16px 2px 0px',
@@ -389,9 +389,6 @@ App.prototype.renderNetworkDropdown = function () {
       ]
     ),
 
-    this.renderSelectedCustomOption(props.provider),
-    this.renderCommonRpc(rpcList, props.provider),
-
     h(
       DropdownMenuItem,
       {
@@ -408,6 +405,9 @@ App.prototype.renderNetworkDropdown = function () {
       ]
     ),
 
+    this.renderSelectedCustomOption(props.provider),
+    this.renderCommonRpc(rpcList, props.provider),
+
   ])
 }
 
@@ -438,6 +438,8 @@ App.prototype.renderDropdown = function () {
       position: 'absolute',
       right: '2px',
       top: '38px',
+      width: '126px',
+      maxHeight: isOpen ? '186px' : '0px',
     },
     innerStyle: {},
   }, [

old-ui/app/components/account-dropdowns.js

@@ -119,11 +119,11 @@ class AccountDropdowns extends Component {
       {
         useCssTransition: true, // Hardcoded because account selector is temporarily in app-header
         style: {
+          position: 'absolute',
           marginLeft: '-213px',
-          marginTop: '32px',
+          top: '38px',
           minWidth: '180px',
-          overflowY: 'auto',
-          maxHeight: '300px',
+          maxHeight: accountSelectorActive ? '300px' : '0px',
           width: '265px',
         },
         innerStyle: {
@@ -264,11 +264,9 @@ class AccountDropdowns extends Component {
       },
       [
         enableAccountsSelector && h(
-          // 'i.fa.fa-angle-down',
           'div.accounts-selector',
           {
             style: {
-              // fontSize: '1.8em',
               background: 'url(images/switch_acc.svg) white center center no-repeat',
               height: '25px',
               width: '25px',

old-ui/app/components/dropdown.js

@@ -11,12 +11,18 @@ class Dropdown extends Component {
     const { isOpen, onClickOutside, style, innerStyle, children, useCssTransition } = this.props
 
     const innerStyleDefaults = extend({
-      borderRadius: '4px',
       padding: '15px 30px',
-      background: 'rgba(71, 28, 115, 0.95)',
+      background: 'transparent',
       boxShadow: 'rgba(0, 0, 0, 0.15) 0px 2px 2px 2px',
     }, innerStyle)
 
+    const styleDefaults = extend({
+      borderRadius: '4px',
+      background: 'rgba(71, 28, 115, 0.95)',
+      overflowY: 'auto',
+      transition: 'max-height 300ms ease-in-out',
+    }, style)
+
     return h(
       MenuDroppo,
       {
@@ -24,7 +30,7 @@ class Dropdown extends Component {
         isOpen,
         zIndex: 11,
         onClickOutside,
-        style,
+        style: styleDefaults,
         innerStyle: innerStyleDefaults,
       },
       [

old-ui/app/components/menu-droppo.js

@@ -29,28 +29,6 @@ MenuDroppoComponent.prototype.render = function () {
     h('.menu-droppo-container', {
       style,
     }, [
-      h('style', `
-        .menu-droppo-enter {
-          transition: transform ${speed} ease-in-out;
-          transform: translateY(-200%);
-        }
-
-        .menu-droppo-enter.menu-droppo-enter-active {
-          transition: transform ${speed} ease-in-out;
-          transform: translateY(0%);
-        }
-
-        .menu-droppo-leave {
-          transition: transform ${speed} ease-in-out;
-          transform: translateY(0%);
-        }
-
-        .menu-droppo-leave.menu-droppo-leave-active {
-          transition: transform ${speed} ease-in-out;
-          transform: translateY(-200%);
-        }
-      `),
-
       useCssTransition
         ? h(ReactCSSTransitionGroup, {
           className: 'css-transition-group',

old-ui/app/css/index.css

@@ -1008,6 +1008,15 @@ div.message-container > div:first-child {
   height: 22px;
 }
 
+.menu-droppo-container::-webkit-scrollbar {
+  width: 1px;
+}
+ 
+.menu-droppo-container::-webkit-scrollbar-thumb {
+  border: 1px solid transparent;
+  background-clip: content-box;
+}
+
 .hidden {
   visibility: hidden;
 }