Merge branch 'V4' into refactor/loading-state-in-useweb3modalstate-hook

.eslintrc.json

@@ -6,7 +6,8 @@
     "eslint:all",
     "plugin:@typescript-eslint/stylistic-type-checked",
     "plugin:@typescript-eslint/strict-type-checked",
-    "prettier"
+    "prettier",
+    "plugin:prettier/recommended"
   ],
   "parserOptions": {
     "project": ["tsconfig.json"]
@@ -21,7 +22,8 @@
     ".turbo",
     "exbamples",
     "coverage",
-    ".changeset"
+    ".changeset",
+    "playwright-report"
   ],
   "rules": {
     // Core

.github/ISSUE_TEMPLATE/bug_report.yml

@@ -9,7 +9,9 @@ body:
       description: |
         This should include as little code as possible, and no extraneous dependencies. Do not share your entire project.
         You should also test your issue against the latest NPM package version(s) to ensure that it hasn't already been resolved.
-        Sharing a link to a GitHub repository, [Codesandbox](https://codesandbox.io) and/or preview deployment are best. Include any instructions to run the project in the README or the summary field below.
+        Sharing a link to a GitHub repository or preview deployment are best. Include any instructions to run the project in the README or the summary field below.
+
+        Don't have an available repo/preview to share? You can create online with our [StackBlitz template](https://stackblitz.com/edit/web3modal-next-template) quickly.
 
         IF A REPRODUCIBLE DEMO IS NOT PROVIDED, YOUR ISSUE WILL BE CLOSED.
         [Learn more about creating a minimal reproducible example](https://stackoverflow.com/help/mcve).

.github/workflows/ci_canary.yml → .github/workflows/publish_canary.yml

@@ -1,4 +1,4 @@
-name: ci_canary
+name: Publish Canary Image
 on:
   workflow_dispatch:
   push:
@@ -49,7 +49,7 @@ jobs:
           IMAGE_TAG: V4
         with:
           context: .
-          file: Dockerfile
+          file: Dockerfile.canary
           push: true
           tags: ${{ env.ECR_REGISTRY }}/${{ env.ECR_REPOSITORY }}:${{ env.IMAGE_TAG }}
           cache-from: type=local,src=/tmp/.buildx-cache

.github/workflows/ui_tests.yml

@@ -28,6 +28,11 @@ on:
         default: false
         required: false
         type: boolean
+      secure-site-url:
+        description: 'Secure site SDK url'
+        default: 'https://secure.walletconnect.com/sdk'
+        required: false
+        type: string
     secrets:
       NEXT_PUBLIC_PROJECT_ID:
         required: true
@@ -39,7 +44,8 @@ on:
 jobs:
   ui_tests:
     name: 'Playwright Tests'
-    runs-on: ubuntu-latest
+    runs-on:
+      group: ubuntu-runners
     timeout-minutes: 15
     steps:
       - name: checkout
@@ -56,6 +62,9 @@ jobs:
       - name: Get installed Playwright version
         id: playwright-version
         run: echo "PLAYWRIGHT_VERSION=$(node -e "console.log(require('./package-lock.json').packages['apps/laboratory']['devDependencies']['@playwright/test'])")" >> $GITHUB_ENV
+      - name: Install Brave Browser
+        working-directory: ./apps/laboratory/
+        run: sudo ./scripts/install-brave-browser.sh
       - name: Cache playwright binaries
         uses: actions/cache@v4
         id: playwright-cache
@@ -79,9 +88,16 @@ jobs:
           SKIP_PLAYWRIGHT_WEBSERVER: ${{ inputs.skip-playwright-webserver }}
           NEXTAUTH_SECRET: ${{ secrets.TESTS_NEXTAUTH_SECRET }}
           MAILSAC_API_KEY: ${{ secrets.TESTS_MAILSEC_API_KEY }}
+          NEXT_PUBLIC_SECURE_SITE_SDK_URL: ${{ inputs.secure-site-url }}
           CI: true
         working-directory: ./apps/laboratory/
         run: npm run ${{ inputs.command }}
+      - name: Run canary with minimal environment config
+        env:
+          NEXT_PUBLIC_PROJECT_ID: ${{ secrets.NEXT_PUBLIC_PROJECT_ID }}
+          CI: true
+        working-directory: ./apps/laboratory/
+        run: npm run playwright:test:canary
       - uses: actions/upload-artifact@v3
         if: always()
         with:
@@ -92,5 +108,5 @@ jobs:
         if: always()
         with:
           name: screenshots
-          path: ./apps/laboratory/screenshots/
+          path: ./apps/laboratory/test-results/
           retention-days: 7

.gitignore

@@ -2,11 +2,11 @@ dist
 node_modules
 .DS_Store
 .env
+.idea
 .next
 out
 lerna-debug.log
 .env.local
-.env
 .turbo
 playwright-report/
 screenshots/

.vscode/settings.json

@@ -22,4 +22,4 @@
   "typescript.updateImportsOnFileMove.enabled": "always",
   "css.lint.unknownAtRules": "ignore",
   "css.validate": true
-}
+}

Dockerfile.canary

@@ -0,0 +1,15 @@
+FROM node:20-bookworm
+
+WORKDIR /src
+
+COPY ../ ./
+RUN npm ci
+RUN npm run build
+
+WORKDIR ./apps/laboratory/
+
+RUN npm run playwright:install
+
+ENV TIMING_LOGS=true
+
+CMD ["npm", "run", "playwright:test:canary"]

apps/demo/.eslintrc.json

@@ -0,0 +1,3 @@
+{
+  "extends": ["../../.eslintrc.json"]
+}

apps/demo/.gitignore

@@ -0,0 +1,36 @@
+# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
+
+# dependencies
+/node_modules
+/.pnp
+.pnp.js
+.yarn/install-state.gz
+
+# testing
+/coverage
+
+# next.js
+/.next/
+/out/
+
+# production
+/build
+
+# misc
+.DS_Store
+*.pem
+
+# debug
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+
+# local env files
+.env*.local
+
+# vercel
+.vercel
+
+# typescript
+*.tsbuildinfo
+next-env.d.ts

apps/demo/CHANGELOG.md

@@ -0,0 +1,102 @@
+# @apps/demo
+
+## 4.1.9
+
+### Patch Changes
+
+- Blockchain API fix
+
+- Updated dependencies []:
+  - @web3modal/wagmi@4.1.9
+
+## 4.1.8
+
+### Patch Changes
+
+- Hotfix for redundant tokenbalance calls
+
+- Updated dependencies []:
+  - @web3modal/wagmi@4.1.8
+
+## 4.1.7
+
+### Patch Changes
+
+- Hotfix for inccorect state of w3m-button when email is enabled
+
+- Updated dependencies []:
+  - @web3modal/wagmi@4.1.7
+
+## 4.1.6
+
+### Patch Changes
+
+- Fix modal default height. Fix ethers email connection lag. Fix ethers + rc relay disconnect issue. Adds new wui-components for secure site.
+
+- Updated dependencies []:
+  - @web3modal/wagmi@4.1.6
+
+## 4.1.5
+
+### Patch Changes
+
+- release: v4.1.5
+
+- Updated dependencies []:
+  - @web3modal/wagmi@4.1.5
+
+## 4.1.5-93c81127.0
+
+### Patch Changes
+
+- fix: polyfill process in wallet package
+
+- Updated dependencies []:
+  - @web3modal/wagmi@4.1.5-93c81127.0
+
+## 4.1.4
+
+### Patch Changes
+
+- feat: wallet info hook
+
+- Updated dependencies []:
+  - @web3modal/wagmi@4.1.4
+
+## 4.1.3
+
+### Patch Changes
+
+- feat: wallet info hook
+
+- feat: reset version to 4.1.3
+
+- Updated dependencies []:
+  - @web3modal/wagmi@4.1.3
+
+## 4.1.3-5f2ae345.1
+
+### Patch Changes
+
+- canary: test imports
+
+- Updated dependencies []:
+  - @web3modal/wagmi@4.1.3-5f2ae345.1
+
+## 4.1.3-8e039e.0
+
+### Patch Changes
+
+- feat: update optional dependencies
+
+- Updated dependencies []:
+  - @web3modal/wagmi@4.1.3-8e039e.0
+
+## 4.1.2
+
+### Patch Changes
+
+- 4.1.2 release
+
+- Updated dependencies []:
+  - @web3modal/wagmi@4.1.2

apps/demo/app/layout.tsx

@@ -0,0 +1,42 @@
+import type { Metadata } from 'next'
+import localFont from 'next/font/local'
+import '@/styles/globals.css'
+import Web3ModalProvider from '@/context/Web3Modal'
+
+const abcDiatype = localFont({
+  src: [
+    {
+      path: '../public/fonts/ABCDiatype-Regular.woff2',
+      weight: '400'
+    },
+    {
+      path: '../public/fonts/ABCDiatype-Bold.woff2',
+      weight: '700'
+    }
+  ],
+  variable: '--font-abcDiatype'
+})
+
+export const metadata: Metadata = {
+  title: 'Web3Modal | Demo',
+  description:
+    'Web3Modal is an elegantly simple yet powerful library that helps you manage your multi-chain wallet connection flows, all in one place.',
+  openGraph: {
+    description:
+      'Your on-ramp to web3 multichain. Web3Modal is a versatile library that makes it super easy to connect users with your Dapp and start interacting with the blockchain.'
+  }
+}
+
+export default function RootLayout({
+  children
+}: Readonly<{
+  children: React.ReactNode
+}>) {
+  return (
+    <html lang="en">
+      <body className={abcDiatype.className}>
+        <Web3ModalProvider>{children}</Web3ModalProvider>
+      </body>
+    </html>
+  )
+}

apps/demo/app/page.tsx

@@ -0,0 +1,35 @@
+'use client'
+
+import Gradient from '@/components/Gradient'
+import ConfigSection from '@/components/ConfigSection'
+import ViewSection from '@/components/ViewSection'
+import NavSection from '@/components/NavSection'
+import { motion } from 'framer-motion'
+import { VARIANTS } from '@/utils/constants'
+
+export default function Home() {
+  // Web3Modal Demo
+  return (
+    <motion.main
+      variants={VARIANTS}
+      initial="initial"
+      animate="animate"
+      transition={{
+        delayChildren: 0.2,
+        staggerChildren: 0.4
+      }}
+      className="h-d-screen relative overflow-hidden"
+    >
+      <NavSection />
+      <div className="grid grid-cols-3 h-full pt-20">
+        <div className="col-span-1 bg-white border-r border-slate-100 relative">
+          <ConfigSection />
+        </div>
+        <div className="col-span-2 shadow-[inset_0_-2px_24px_rgba(0,0,0,0.05)] px-12 py-8 grid place-items-center relative">
+          <ViewSection />
+        </div>
+      </div>
+      <Gradient />
+    </motion.main>
+  )
+}