Merge branch 'main' of github.com:WalletConnect/web-examples into fea…

…t/sa-connection-improvments

.github/workflows/pr_checks.yml

@@ -0,0 +1,50 @@
+name: UI Tests
+
+concurrency:
+  # Support push/pr as event types with different behaviors each:
+  # 1. push: queue up builds
+  # 2. pr: only allow one run per PR
+  group: ${{ github.workflow }}-${{ github.event.type }}${{ github.event.pull_request.number }}
+  # If there is already a workflow running for the same pull request, cancel it
+  cancel-in-progress: ${{ github.event_name == 'pull_request' }}
+
+env:
+  VERCEL_ORG_ID: ${{ secrets.VERCEL_TEAM_ID }}
+  VERCEL_PROJECT_ID: ${{ secrets.UI_TEST_WALLET_V2_VERCEL_PROJECT_ID }}
+
+on:
+  pull_request:
+    branches:
+      - main
+
+jobs:
+  preview:
+    runs-on: ubuntu-latest
+    outputs:
+      preview-url: ${{ steps.preview.outputs.PREVIEW_URL }}
+    steps:
+      - uses: actions/checkout@v4
+      - name: Install Vercel CLI
+        run: npm install --global vercel@latest
+      - name: Pull Vercel Environment Information
+        run: vercel pull --yes --environment=preview --token=${{ secrets.UI_TEST_VERCEL_TOKEN }}
+      - name: Build Project Artifacts
+        run: vercel build --token=${{ secrets.UI_TEST_VERCEL_TOKEN }}
+      - name: Deploy Project Artifacts to Vercel
+        run: vercel deploy --prebuilt --token=${{ secrets.UI_TEST_VERCEL_TOKEN }} > preview.txt
+      - name: preview
+        id: preview
+        run: echo "PREVIEW_URL=$(cat preview.txt | tail -n 1)" >> "$GITHUB_OUTPUT"
+
+  ui-test:
+    needs: preview
+    with:
+      base-url: https://lab.web3modal.com/
+      wallet-url: ${{ needs.preview.outputs.preview-url }}/
+      skip-playwright-webserver: true
+      branch: V3
+      command: playwright:test:wallet
+    uses: WalletConnect/web3modal/.github/workflows/ui_tests.yml@V3
+    secrets:
+      NEXT_PUBLIC_PROJECT_ID: ${{ secrets.UI_TEST_PROJECT_ID }}
+      TESTS_NEXTAUTH_SECRET: ${{ secrets.TESTS_NEXTAUTH_SECRET }}

advanced/dapps/react-dapp-auth/package.json

@@ -18,7 +18,7 @@
     "ethers": "^5.7.0",
     "events": "^3.3.0",
     "framer-motion": "^7.0.0",
-    "next": "12.2.4",
+    "next": "12.3.4",
     "react": "18.2.0",
     "react-dom": "18.2.0",
     "smart-truncate": "^1.0.1"

advanced/dapps/react-dapp-v2-cosmos-provider/package.json

@@ -28,28 +28,27 @@
     "react-error-overlay": "6.0.11"
   },
   "dependencies": {
+    "@ethereumjs/tx": "^3.5.0",
+    "@walletconnect/encoding": "^1.0.1",
     "@walletconnect/types": "2.10.0",
+    "@walletconnect/universal-provider": "2.10.0",
     "@walletconnect/utils": "2.10.0",
+    "@web3modal/standalone": "^2.3.7",
     "axios": "^1.0.0",
     "blockies-ts": "^1.0.0",
-    "caip-api": "^2.0.0-beta.1",
     "cosmos-wallet": "^1.2.0",
     "eth-sig-util": "^2.5.3",
     "ethereumjs-util": "^7.0.6",
     "ethers": "^5.3.0",
+    "next": "12.3.4",
     "prop-types": "^15.7.2",
     "qr-image": "^3.2.0",
     "react": "^17.0.2",
     "react-dom": "^17.0.2",
     "react-scripts": "^4.0.3",
     "styled-components": "^5.2.0",
     "typescript": "^4.3.2",
-    "web-vitals": "^0.2.4",
-    "next": "12.2.4",
-    "@ethereumjs/tx": "^3.5.0",
-    "@walletconnect/encoding": "^1.0.1",
-    "@walletconnect/universal-provider": "2.10.0",
-    "@web3modal/standalone": "^2.3.7"
+    "web-vitals": "^0.2.4"
   },
   "devDependencies": {
     "@testing-library/jest-dom": "^5.16.1",
@@ -65,8 +64,8 @@
     "@types/react": "18.0.15",
     "@types/react-dom": "18.0.6",
     "@types/styled-components": "^5.1.21",
-    "prettier": "^2.5.1",
-    "eslint-config-next": "12.2.4"
+    "eslint-config-next": "12.2.4",
+    "prettier": "^2.5.1"
   },
   "eslintConfig": {
     "extends": [

advanced/dapps/react-dapp-v2-cosmos-provider/src/chains/cosmos.ts

@@ -1,12 +1,41 @@
 import { JsonRpcRequest } from "@walletconnect/jsonrpc-utils";
 
-import { BLOCKCHAIN_LOGO_BASE_URL } from "../constants";
-
 import { NamespaceMetadata, ChainMetadata, ChainRequestRender } from "../helpers";
 
+export const CosmosChainData = {
+  "cosmoshub-4": {
+    name: "Cosmos Hub",
+    id: "cosmos:cosmoshub-4",
+    rpc: ["https://rpc.cosmos.network"],
+    slip44: 118,
+    testnet: false,
+  },
+  "irishub-1": {
+    name: "Irisnet",
+    id: "cosmos:irishub-1",
+    rpc: ["https://rpc.irisnet.org"],
+    slip44: 566,
+    testnet: false,
+  },
+  "kava-4": {
+    name: "Kava",
+    id: "cosmos:kava-4",
+    rpc: ["https://kava4.data.kava.io"],
+    slip44: 459,
+    testnet: false,
+  },
+  "columbus-4": {
+    name: "Terra",
+    id: "cosmos:columbus-4",
+    rpc: [],
+    slip44: 330,
+    testnet: false,
+  },
+};
+
 export const CosmosMetadata: NamespaceMetadata = {
   "cosmoshub-4": {
-    logo: BLOCKCHAIN_LOGO_BASE_URL + "cosmos:cosmoshub-4.png",
+    logo: "/assets/" + "cosmos-cosmoshub-4.png",
     rgb: "27, 31, 53",
   },
 };
@@ -20,9 +49,7 @@ export function getChainMetadata(chainId: string): ChainMetadata {
   return metadata;
 }
 
-export function getChainRequestRender(
-  request: JsonRpcRequest
-): ChainRequestRender[] {
+export function getChainRequestRender(request: JsonRpcRequest): ChainRequestRender[] {
   return [
     { label: "Method", value: request.method },
     {

advanced/dapps/react-dapp-v2-cosmos-provider/src/chains/eip155.ts

@@ -7,7 +7,6 @@ import {
   convertHexToNumber,
   convertHexToUtf8,
 } from "../helpers";
-import { BLOCKCHAIN_LOGO_BASE_URL } from "../constants";
 
 export const EIP155Colors = {
   ethereum: "99, 125, 234",
@@ -22,55 +21,55 @@ export const EIP155Colors = {
 export const EIP155Metadata: NamespaceMetadata = {
   "1": {
     name: "Ethereum",
-    logo: BLOCKCHAIN_LOGO_BASE_URL + "eip155:1.png",
+    logo: "/assets/" + "eip155-1.png",
     rgb: EIP155Colors.ethereum,
   },
   "5": {
-    logo: BLOCKCHAIN_LOGO_BASE_URL + "eip155:5.png",
+    logo: "/assets/" + "eip155-5.png",
     rgb: EIP155Colors.goerli,
   },
   "10": {
     name: "Optimism",
-    logo: BLOCKCHAIN_LOGO_BASE_URL + "eip155:10.png",
+    logo: "/assets/" + "eip155-10.png",
     rgb: EIP155Colors.optimism,
   },
   "42": {
-    logo: BLOCKCHAIN_LOGO_BASE_URL + "eip155:42.png",
+    logo: "/assets/" + "eip155-42.png",
     rgb: EIP155Colors.ethereum,
   },
   "69": {
-    logo: BLOCKCHAIN_LOGO_BASE_URL + "eip155:69.png",
+    logo: "/assets/" + "eip155-69.png",
     rgb: EIP155Colors.optimism,
   },
   "100": {
-    logo: BLOCKCHAIN_LOGO_BASE_URL + "eip155:100.png",
+    logo: "/assets/" + "eip155-100.png",
     rgb: EIP155Colors.xdai,
   },
   "137": {
     name: "Polygon",
-    logo: BLOCKCHAIN_LOGO_BASE_URL + "eip155:137.png",
+    logo: "/assets/" + "eip155-137.png",
     rgb: EIP155Colors.polygon,
   },
   "80001": {
-    logo: BLOCKCHAIN_LOGO_BASE_URL + "eip155:80001.png",
+    logo: "/assets/" + "eip155-80001.png",
     rgb: EIP155Colors.polygon,
   },
   "42161": {
     name: "Arbitrum",
-    logo: BLOCKCHAIN_LOGO_BASE_URL + "eip155:42161.png",
+    logo: "/assets/" + "eip155-42161.png",
     rgb: EIP155Colors.arbitrum,
   },
   "42220": {
     name: "Celo",
-    logo: BLOCKCHAIN_LOGO_BASE_URL + "eip155:42220.png",
+    logo: "/assets/" + "eip155-42220.png",
     rgb: EIP155Colors.celo,
   },
   "44787": {
-    logo: BLOCKCHAIN_LOGO_BASE_URL + "eip155:44787.png",
+    logo: "/assets/" + "eip155-44787.png",
     rgb: EIP155Colors.celo,
   },
   "421611": {
-    logo: BLOCKCHAIN_LOGO_BASE_URL + "eip155:421611.png",
+    logo: "/assets/" + "eip155-421611.png",
     rgb: EIP155Colors.arbitrum,
   },
 };

advanced/dapps/react-dapp-v2-cosmos-provider/src/chains/polkadot.ts

@@ -1,5 +1,4 @@
 import { JsonRpcRequest } from "@walletconnect/jsonrpc-utils";
-import { BLOCKCHAIN_LOGO_BASE_URL } from "../constants";
 
 import { NamespaceMetadata, ChainMetadata, ChainRequestRender } from "../helpers";
 

advanced/dapps/react-dapp-v2-cosmos-provider/src/components/Blockchain.tsx

@@ -1,6 +1,5 @@
 import React, { PropsWithChildren, FC } from "react";
 import styled from "styled-components";
-import { ChainData } from "caip-api";
 
 import Asset from "./Asset";
 import Button from "./Button";
@@ -93,7 +92,7 @@ interface BlockchainProps {
 }
 
 interface BlockchainDisplayData {
-  data: ChainData;
+  data: any;
   meta: ChainMetadata;
 }
 
@@ -108,7 +107,8 @@ function getBlockchainDisplayData(
   } catch (e) {
     return undefined;
   }
-  const data: ChainData = chainData[namespace][reference];
+  if (typeof chainData[namespace] === "undefined") return undefined;
+  const data = chainData[namespace][reference];
   if (typeof data === "undefined") return undefined;
   return { data, meta };
 }

advanced/dapps/react-dapp-v2-cosmos-provider/src/constants/index.ts

@@ -1,2 +1 @@
 export * from "./default";
-export * from "./logo";

advanced/dapps/react-dapp-v2-cosmos-provider/src/contexts/ClientContext.tsx

@@ -1,4 +1,3 @@
-import SignClient from "@walletconnect/sign-client";
 import { ISignClient, PairingTypes, SessionTypes } from "@walletconnect/types";
 import UniversalProvider, { IUniversalProvider } from "@walletconnect/universal-provider";
 import { Web3Modal } from "@web3modal/standalone";
@@ -18,7 +17,7 @@ import {
   DEFAULT_RELAY_URL,
 } from "../constants";
 import { AccountBalances, ChainNamespaces, getAllChainNamespaces } from "../helpers";
-import { apiGetChainNamespace, ChainsMap } from "caip-api";
+import { CosmosChainData } from "../chains/cosmos";
 
 /**
  * Types
@@ -74,12 +73,16 @@ export function ClientContextProvider({ children }: { children: ReactNode | Reac
     const chainData: ChainNamespaces = {};
     await Promise.all(
       namespaces.map(async namespace => {
-        let chains: ChainsMap | undefined;
-        try {
-          chains = await apiGetChainNamespace(namespace);
-        } catch (e) {
-          // ignore error
+        let chains;
+        switch (namespace) {
+          case "cosmos":
+            chains = CosmosChainData;
+            break;
+
+          default:
+            console.error("Unknown chain namespace: ", namespace);
         }
+
         if (typeof chains !== "undefined") {
           chainData[namespace] = chains;
         }
@@ -161,7 +164,7 @@ export function ClientContextProvider({ children }: { children: ReactNode | Reac
           cosmos: {
             methods: DEFAULT_COSMOS_METHODS,
             chains: [caipChainId],
-            events: ["chainChanged", "accountsChanged"],
+            events: [],
           },
         },
       });