Merge pull request #158 from bobanetwork/main

New Release : v0.11.0

.env.example

@@ -4,6 +4,7 @@ REACT_APP_WALLET_VERSION=1.0.10
 REACT_APP_ENV=dev
 REACT_APP_GA4_MEASUREMENT_ID=
 REACT_APP_SENTRY_DSN=
+REACT_APP_WC_PROJECT_ID=
 
 #####################
 ##### WebWallet #####

.github/PULL_REQUEST_TEMPLATE.md

@@ -1,19 +1,33 @@
-:clipboard: Add associated issues, tickets, docs URL here.
-
-closes: 
+:clipboard:  closes: 
 
 ## Overview
 
 Describe what your Pull Request is about in a few sentences.
 
+## Tasks
+
+- [ ] No debug console statement added 
+- [ ] Should use only typescript.
+- [ ] Does have unit test for each touched file with 90% coverage
+- [ ] Does have an integration test if any UI changes.
+
+
 ## Changes
 
-Describe your changes and implementation choices. More details make PRs easier to review.
+Describe your changes and implementation choices
 
 - Change 1
 - Change 2
 - ...
 
 ## Testing
 
-Describe how to test your new feature/bug fix and if possible, a step by step guide on how to demo this.
+Snapshots for test coverage for changed files.
+
+
+## UI Snaps
+
+Add screenshots or video if any visuals changes are there so would be helpful for review.
+
+
+

.github/workflows/coverage-linting.yml

@@ -21,7 +21,7 @@ jobs:
         run: git fetch
 
       - name: Setup node
-        uses: actions/setup-node@v3
+        uses: actions/setup-node@v4
         with:
           node-version: '16.x'
 
@@ -47,6 +47,7 @@ jobs:
         env:
           FORCE_COLOR: 1
           SKIP_PREFLIGHT_CHECK: true
+          REACT_APP_WALLET_VERSION: 0.9.1
 
       - uses: codecov/codecov-action@v3
         with:
@@ -62,7 +63,7 @@ jobs:
       - uses: actions/checkout@v4
       - name: Fetch history
         run: git fetch
-      - uses: actions/setup-node@v3
+      - uses: actions/setup-node@v4
         with:
           node-version: '16.x'
 

.github/workflows/end2end-test.yml

@@ -12,7 +12,7 @@ jobs:
       - name: Checkout
         uses: actions/checkout@v3
       - name: Setup Node
-        uses: actions/setup-node@v3
+        uses: actions/setup-node@v4
         with:
           node-version: 16.16.0
           cache: 'yarn'

.github/workflows/secret-detect.yml

@@ -14,6 +14,6 @@ jobs:
       - name: Run Yelp's detect-secrets
         uses: RobertFischer/[email protected]
       - name: Commit back .secrets.baseline (if it was missing)
-        uses: stefanzweifel/git-auto-commit-action@v4
+        uses: stefanzweifel/git-auto-commit-action@v5
         with:
           commit_message: "build(detect-secrets): Commit the newly-generated .secrets.baseline file"

.gitignore

@@ -19,4 +19,5 @@ coverage
 *.log
 
 # gateway
-/build
+/build
+.idea/

.lintstagedrc.json

@@ -1,7 +1,7 @@
 {
   "*.{ts,tsx}": [
-    "yarn format:check",
-    "yarn lint:check"
+    "yarn format:fix",
+    "yarn lint:fix"
   ],
   "!(__tests__|*stories|*test|styles).{ts,tsx}": [
     "yarn test --passWithNoTests"

__mocks__/@walletconnect/ethereum-provider.ts

@@ -0,0 +1,41 @@
+/* 
+  Since we've installed @walletconnect/ethereum-provider, 
+  it has led to dependency issues during Jest testing. 
+  To resolve this, we need to mock the entire 'node_modules' itself, 
+  as unit testing focuses solely on our code
+
+  sample crash report.
+  ```
+  
+   TypeError: Cannot read properties of undefined (reading 'base16')
+
+      15 | limitations under the License.
+      16 |
+    > 17 | import {EthereumProvider} from '@walletconnect/ethereum-provider'
+         | ^
+      
+      at Object.<anonymous> (node_modules/uint8arrays/cjs/src/util/bases.js:42:21)
+      at Object.<anonymous> (node_modules/uint8arrays/cjs/src/from-string.js:5:13)
+      at Object.<anonymous> (node_modules/uint8arrays/cjs/src/index.js:8:18)
+      at Object.<anonymous> (node_modules/@walletconnect/utils/dist/index.cjs.js:1:324)
+      at Object.<anonymous> (node_modules/@walletconnect/ethereum-provider/dist/index.cjs.js:1:177)
+      at Object.<anonymous> (src/services/wallet.service.js:17:1)
+      at Object.<anonymous> (src/services/networkService.js:86:1)
+      at Object.<anonymous> (src/components/global/addToMetamask/index.tsx:4:1)
+      at Object.<anonymous>(src / components / global / index.ts: 1: 1)
+        
+  ```
+*/
+
+export const EthereumProvider = jest.fn()
+
+EthereumProvider.mockImplementation(() => {
+  return {
+    on: jest.fn(),
+    connect: jest.fn(),
+    enable: jest.fn(),
+    disconnect: jest.fn(),
+  }
+})
+
+export default EthereumProvider

buildspec.yml

@@ -0,0 +1,20 @@
+version: 0.2
+
+phases:
+  install:
+    runtime-versions:
+      nodejs: 18
+    commands:
+      - n 16
+      - yarn
+
+  build:
+    commands:
+        - REACT_APP_WALLET_VERSION=$(git rev-parse --short HEAD) yarn build:prod
+
+artifacts:
+  # include all files required to run the application
+  files:
+    - '**/*'
+  discard-paths: no
+  base-directory: build

cypress.config.ts

@@ -22,4 +22,5 @@ export default defineConfig({
   env: {
     target_hash: process.env.CYPRESS_TEST_HASH,
   },
+  includeShadowDom: true,
 })

cypress/e2e/helpers/base/constants.ts

@@ -1,4 +1,4 @@
-import { MetamaskNetwork } from './types'
+import { MetamaskNetwork, NetworkTestInfo } from './types'
 
 export const Binance: MetamaskNetwork = {
   networkName: 'Binance Mainnet',
@@ -35,5 +35,81 @@ export const AvalancheTestnet: MetamaskNetwork = {
   blockExplorer: 'https://testnet.snowtrace.io/',
   isTestnet: true,
 }
+export const EthereumInfo: NetworkTestInfo = {
+  networkName: 'Ethereum',
+  networkAbbreviation: 'ETHEREUM',
+  isTestnet: false,
+}
+export const BinanceInfo: NetworkTestInfo = {
+  networkName: 'Binance Smart Chain',
+  networkAbbreviation: 'BNB',
+  isTestnet: false,
+}
+
+export const AvalancheInfo: NetworkTestInfo = {
+  networkName: 'Avalanche Mainnet C-Chain',
+  networkAbbreviation: 'AVAX',
+  isTestnet: false,
+}
+
+export const MainnetL1Networks: NetworkTestInfo[] = [
+  EthereumInfo,
+  BinanceInfo,
+  AvalancheInfo,
+]
+
+export const MainnetL2Networks: NetworkTestInfo[] = [
+  {
+    networkName: 'Boba ETH',
+    networkAbbreviation: 'Boba Eth',
+    isTestnet: false,
+  },
+  {
+    networkName: 'Boba BNB',
+    networkAbbreviation: 'Boba BNB',
+    isTestnet: false,
+  },
+  {
+    networkName: 'Boba Avalanche',
+    networkAbbreviation: 'Boba Avalanche',
+    isTestnet: false,
+  },
+]
+
+export const EthereumGoerliInfo: NetworkTestInfo = {
+  networkName: 'Ethereum (Goerli)',
+  networkAbbreviation: 'ETHEREUM',
+  isTestnet: true,
+}
+
+export const TestnetL1Networks: NetworkTestInfo[] = [
+  EthereumGoerliInfo,
+  {
+    networkName: 'BNB Testnet',
+    networkAbbreviation: 'BNB',
+    isTestnet: true,
+  },
+  {
+    networkName: 'Fuji Testnet',
+    networkAbbreviation: 'AVAX',
+    isTestnet: true,
+  },
+]
 
-// Update the configs for boba networks TESTNET / MAINNET
+export const TestnetL2Networks: NetworkTestInfo[] = [
+  {
+    networkName: 'Boba (Goerli)',
+    networkAbbreviation: 'Boba (Goerli)',
+    isTestnet: true,
+  },
+  {
+    networkName: 'Boba BNB Testnet',
+    networkAbbreviation: 'Boba BNB',
+    isTestnet: true,
+  },
+  {
+    networkName: 'Boba Fuji Testnet',
+    networkAbbreviation: 'Boba Fuji',
+    isTestnet: true,
+  },
+]

cypress/e2e/helpers/base/page.footer.ts

@@ -17,4 +17,8 @@ export default class PageFooter {
     // @ts-ignore
     return cy.get('#socialLinks').contains(/^v\w+/)
   }
+
+  gasDetailsInfo() {
+    return cy.get('#gasDetails').find('div')
+  }
 }