Merge pull request #441 from rsksmart/v2.1.5

V2.1.5

.github/workflows/ci.yml

@@ -0,0 +1,23 @@
+name: ci
+
+on:
+  push:
+    branches: [ master, develop ]
+  pull_request:
+    branches: [ master, develop ]
+
+jobs:
+  test:
+
+    runs-on: ubuntu-latest
+
+    steps:
+    - uses: actions/checkout@v2
+    - name: Use Node.js 12.x
+      uses: actions/setup-node@v1
+      with:
+        node-version: 12.x
+    - run: yarn
+    - run: npm run ganache &
+    - run: yarn test
+    - run: yarn lint

.github/workflows/gh-deploy.yml

@@ -0,0 +1,28 @@
+
+name: Github Pages Deploy
+
+on:
+  pull_request:
+    branches:
+      - develop
+
+jobs:
+  build-and-deploy:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout 🛎️
+        uses: actions/[email protected] # If you're using actions/checkout@v2 you must set persist-credentials to false in most cases for the deployment to work correctly.
+        with:
+          persist-credentials: false
+
+      - name: Install and Build for Testnet 🔧 # This example project is built using npm and outputs the result to the 'build' folder. Replace with the commands required to build your project, or remove this step entirely if your site is pre-built.
+        run: |
+          yarn
+          yarn build:testnet
+      - name: Deploy 🚀
+        uses: JamesIves/[email protected]
+        with:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+          BRANCH: gh-pages # The branch the action should deploy to.
+          FOLDER: build # The folder the action should deploy.
+          CLEAN: true # Automatically remove deleted files from the deploy branch

README.md

@@ -8,9 +8,8 @@
     Testnet: https://testnet.manager.rns.rifos.org
 </p>
 <p align="middle">
-    <a href="https://circleci.com/gh/circrnsdomains/rns-manager-react">
-        <img src="https://circleci.com/gh/rnsdomains/rns-manager-react.svg?style=svg" alt="CircleCI" />
-    </a>
+    <a href="https://github.com/rnsdomains/rns-manager-react/actions?query=workflow%3Aci">
+        <img src="https://github.com/rnsdomains/rns-manager-react/workflows/ci/badge.svg" />
     <a href="https://lgtm.com/projects/g/rnsdomains/rns-manager-react/alerts/">
         <img src="https://img.shields.io/lgtm/alerts/g/rnsdomains/rns-manager-react.svg?logo=lgtm&logoWidth=18" alt="Total alerts" />
     </a>

package.json

@@ -1,12 +1,14 @@
 {
   "name": "rns-manager-react",
-  "version": "2.1.4",
+  "version": "2.1.5",
   "private": true,
   "license": "MIT",
+  "homepage": ".",
   "dependencies": {
     "@ensdomains/address-encoder": "^0.1.8",
     "@githubprimer/octicons-react": "^8.5.0",
-    "@rsksmart/rlogin": "^1.0.4",
+    "@portis/web3": "^4.0.3",
+    "@rsksmart/rlogin": "1.0.8",
     "@rsksmart/rns": "^1.9.0",
     "@rsksmart/rns-suite": "^1.1.0",
     "@walletconnect/web3-provider": "^1.3.1",
@@ -27,7 +29,7 @@
     "react-redux": "^7.1.1",
     "react-router": "^5.1.2",
     "react-router-dom": "^5.1.2",
-    "react-scripts": "2.1.5",
+    "react-scripts": "4.0.0",
     "react-switch": "^5.0.0",
     "react-zlib-js": "^1.0.4",
     "redux": "^4.0.1",
@@ -41,6 +43,7 @@
     "web3-utils": "^1.2.4"
   },
   "scripts": {
+    "ganache": "npx ganache-cli",
     "start": "env-cmd -f .env.local react-scripts start",
     "start:testnet": "env-cmd -f .env.testnet react-scripts start",
     "start:mainnet": "env-cmd -f .env.production react-scripts start",
@@ -73,6 +76,7 @@
     "eslint-plugin-jest": "^22.7.1",
     "eslint-plugin-jsx-a11y": "^6.2.1",
     "eslint-plugin-react": "7.14.3",
+    "ganache-cli": "^6.12.2",
     "jest-environment-enzyme": "^7.1.2",
     "jest-enzyme": "^7.1.2",
     "redux-mock-store": "^1.5.4"

src/app/auth/operations.js

@@ -177,14 +177,14 @@ const startWithRLogin = callback => (dispatch) => {
 
   window.rLogin.enable()
     .then((accounts) => {
-      const chainId = parseInt(window.rLogin.chainId);
-
-      dispatch(receiveEnable(
-        accounts[0],
-        chainId,
-        chainId === parseInt(process.env.REACT_APP_ENVIRONMENT_ID),
-        accounts.length !== 0,
-      ));
+      window.rLogin.request({ method: 'eth_chainId' })
+        .then(chainId => parseInt(chainId))
+        .then(chainId => dispatch(receiveEnable(
+          accounts[0],
+          chainId,
+          chainId === parseInt(process.env.REACT_APP_ENVIRONMENT_ID),
+          accounts.length !== 0,
+        )));
 
       if (window.location.search.includes('autologin')) {
         dispatch(authenticate(window.location.search.split('=')[1], accounts[0]));

src/app/components/PlausibleAnalytics.js

@@ -48,7 +48,6 @@ const PlausibleAnalytics = ({ strings, domain }) => {
         {strings.plausible}
         <a href="https://plausible.io/data-policy" {...linkProps}>Plausible Policies</a>
         <a href="https://www.rsk.co/privacy-policy" {...linkProps}>RSK policies</a>
-.
       </p>
       <p>{strings.plausible2}</p>
       <p>

src/app/rLogin/rLogin.js

@@ -1,6 +1,7 @@
 /* eslint-disable radix */
 import RLogin from '@rsksmart/rlogin';
 import WalletConnectProvider from '@walletconnect/web3-provider';
+import Portis from '@portis/web3';
 
 const rLogin = new RLogin({
   cachedProvider: false,
@@ -14,6 +15,16 @@ const rLogin = new RLogin({
         },
       },
     },
+    portis: {
+      package: Portis,
+      options: {
+        id: '7ea0e47e-ff3c-4fc7-85cb-7b336d0569ed',
+        network: {
+          nodeUrl: 'https://public-node.testnet.rsk.co',
+          chainId: 31,
+        },
+      },
+    },
   },
   supportedChains: [parseInt(process.env.REACT_APP_ENVIRONMENT_ID)],
 });

src/app/tabs/home/components/WalletCarousel.js

@@ -23,14 +23,17 @@ const WalletCarousel = ({ wallets, strings }) => {
     }
   });
 
-  const SingleItem = item => (
-    <Col key={item.name}>
-      <a href={item.link} target="_blank" rel="noopener noreferrer">
-        <div className="image-container" style={{ backgroundImage: `url(${item.image})` }} />
-        <p>{item.name}</p>
-      </a>
-    </Col>
-  );
+  const SingleItem = (item) => {
+    const { name, link, image } = item;
+    return (
+      <Col key={name}>
+        <a href={link} target="_blank" rel="noopener noreferrer">
+          <div className="image-container" style={{ backgroundImage: `url(${image})` }} />
+          <p>{name}</p>
+        </a>
+      </Col>
+    );
+  };
 
   return (
     <div className="supported-wallets">

src/app/tabs/registrar/components/RegistrarComponent.js

@@ -86,24 +86,24 @@ class RegistrarComponent extends Component {
           }
 
         {waiting && (
-        <>
-          <LoadingContainer />
-          <TextRotationComponent
-            messages={shuffle(keyMessages)}
-            language={language}
-            heading={strings.did_you_know}
-            timer={6000}
-          />
-          <p style={{ marginTop: '50px' }}>
-            <a
-              href="https://hackmd.io/@ilanolkies/rns-user-guide"
-              target="_blank"
-              rel="noopener noreferrer"
-            >
-              {strings.download_guide}
-            </a>
-          </p>
-        </>
+          <>
+            <LoadingContainer />
+            <TextRotationComponent
+              messages={shuffle(keyMessages)}
+              language={language}
+              heading={strings.did_you_know}
+              timer={6000}
+            />
+            <p style={{ marginTop: '50px' }}>
+              <a
+                href="https://hackmd.io/@ilanolkies/rns-user-guide"
+                target="_blank"
+                rel="noopener noreferrer"
+              >
+                {strings.download_guide}
+              </a>
+            </p>
+          </>
         )}
 
         {(canReveal && !revealConfirmed)

src/assets/css/sass/_footer.scss

@@ -40,7 +40,7 @@ footer::before {
   content: '';
   width: 100%;
   height: 200px;
-  background: url('../../img/gray-arch.svg');
+  background: url("/assets/img/gray-arch.svg");
   background-position: center top;
   background-repeat: no-repeat;
   background-size: cover;

src/assets/css/sass/admin/_address.scss

@@ -19,7 +19,7 @@
       padding: 10px 10px;
       border: 1px solid $gray;
       border-radius: 5px;
-      background-image: url('/assets/img/caret-down.svg');
+      background-image: url("/assets/img/caret-down.svg");
       background-position: right 15px center;
       background-repeat: no-repeat;
       background-size: 12px 8px;

src/assets/css/sass/admin/_resolver.scss

@@ -7,7 +7,7 @@
     padding: 12px 10px;
     border-radius: 5px;
     border: 1px solid $gray;
-    background-image: url('/assets/img/caret-down.svg');
+    background-image: url("/assets/img/caret-down.svg");
     background-position: right 15px center;
     background-repeat: no-repeat;
     background-size: 12px 8px;

src/assets/css/sass/home/_index.scss

@@ -33,7 +33,7 @@
 
   .spacer {
     height: 80px;
-    background-image: url('/assets/img/home/bottom-background.svg');
+    // background-image: url("/assets/img/home/bottom-background.svg");
     background-position: bottom !important;
     background-repeat: no-repeat;
     background-size: cover;

tests/setupRnsSuite.js

@@ -2,8 +2,8 @@ require('./setEnvVars');
 const RNSSuite = require('@rsksmart/rns-suite');
 const fs = require('fs');
 
-// set the blockchainURL. Use 0.0.0.0:8545 for CircleCi
-const blockchainUrl = process.env.CIRCLECI ? 'http://0.0.0.0:8545' : process.env.REACT_APP_NODE;
+// set the blockchainURL. Use 0.0.0.0:8545 for Github Actions
+const blockchainUrl = process.env.GITHUB_ACTIONS ? 'http://0.0.0.0:8545' : process.env.REACT_APP_NODE;
 
 // eslint-disable-next-line no-console
 console.log(`Setting up RNS suite on ${blockchainUrl}`);