fix(danger): remove localhost occurences

.github/workflows/ui_tests.yml

@@ -33,16 +33,29 @@ jobs:
           node-version: 18.x
           cache: 'npm'
           cache-dependency-path: 'package-lock.json'
+      - 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: Cache playwright binaries
+        uses: actions/cache@v3
+        id: playwright-cache
+        with:
+          path: |
+            ~/.cache/ms-playwright
+          key: ${{ runner.os }}-playwright-${{ env.PLAYWRIGHT_VERSION }}
       - name: install
         run: npm ci
       - name: build
         run: npm run build
       - name: Install Playwright Browsers
+        if: steps.playwright-cache.outputs.cache-hit != 'true'
         working-directory: ./apps/laboratory/
         run: npm run playwright:install
       - name: Run Playwright tests
         env:
           NEXT_PUBLIC_PROJECT_ID: ${{ secrets.NEXT_PUBLIC_PROJECT_ID }}
+          NEXTAUTH_SECRET: ${{ secrets.TESTS_NEXTAUTH_SECRET }}
+          CI: true
         working-directory: ./apps/laboratory/
         run: npm run playwright:test
       - uses: actions/upload-artifact@v3
@@ -51,3 +64,9 @@ jobs:
           name: playwright-report
           path: ./apps/laboratory/playwright-report/
           retention-days: 7
+      - uses: actions/upload-artifact@v3
+        if: always()
+        with:
+          name: screenshots
+          path: ./apps/laboratory/screenshots/
+          retention-days: 7

.gitignore

@@ -9,3 +9,4 @@ lerna-debug.log
 .env
 .turbo
 playwright-report/
+screenshots/

apps/gallery/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@apps/gallery",
-  "version": "3.6.0-alpha.0",
+  "version": "3.5.3",
   "private": true,
   "main": "index.js",
   "scripts": {
@@ -9,18 +9,18 @@
     "lint": "eslint . --ext .js,.jsx,.ts,.tsx"
   },
   "dependencies": {
-    "@web3modal/common": "3.6.0-alpha.0",
-    "@web3modal/ui": "3.6.0-alpha.0",
+    "@web3modal/common": "3.5.3",
+    "@web3modal/ui": "3.5.3",
     "lit": "3.1.0",
-    "storybook": "7.6.4"
+    "storybook": "7.6.6"
   },
   "devDependencies": {
-    "@storybook/addon-essentials": "7.6.4",
-    "@storybook/addon-links": "7.6.4",
-    "@storybook/blocks": "7.6.4",
-    "@storybook/theming": "7.6.4",
-    "@storybook/web-components": "7.6.4",
-    "@storybook/web-components-vite": "7.6.4",
+    "@storybook/addon-essentials": "7.6.6",
+    "@storybook/addon-links": "7.6.6",
+    "@storybook/blocks": "7.6.6",
+    "@storybook/theming": "7.6.6",
+    "@storybook/web-components": "7.6.6",
+    "@storybook/web-components-vite": "7.6.6",
     "file-system-cache": "2.4.4"
   }
 }

apps/gallery/stories/composites/wui-list-accordion.stories.ts

@@ -0,0 +1,26 @@
+import type { Meta } from '@storybook/web-components'
+import '@web3modal/ui/src/composites/wui-list-accordion'
+import type { WuiListAccordion } from '@web3modal/ui/src/composites/wui-list-accordion'
+import { html } from 'lit'
+import '../../components/gallery-container'
+import { signTypedData } from '../../utils/PresetUtils'
+
+type Component = Meta<WuiListAccordion>
+
+export default {
+  title: 'Composites/wui-list-accordion',
+  args: {
+    textTitle: 'Message',
+    overflowedContent: JSON.stringify(signTypedData, null, 2)
+  }
+} as Component
+
+export const Default: Component = {
+  render: args =>
+    html` <gallery-container width="336">
+      <wui-list-accordion
+        textTitle=${args.textTitle}
+        overflowedContent=${args.overflowedContent}
+      ></wui-list-accordion>
+    </gallery-container>`
+}

apps/gallery/stories/composites/wui-list-content.stories.ts

@@ -0,0 +1,28 @@
+import type { Meta } from '@storybook/web-components'
+import '@web3modal/ui/src/composites/wui-list-content'
+import type { WuiListContent } from '@web3modal/ui/src/composites/wui-list-content'
+import { html } from 'lit'
+import '../../components/gallery-container'
+import { networkImageSrc } from '../../utils/PresetUtils'
+
+type Component = Meta<WuiListContent>
+
+export default {
+  title: 'Composites/wui-list-content',
+  args: {
+    imageSrc: networkImageSrc,
+    textTitle: 'Network',
+    textValue: ''
+  }
+} as Component
+
+export const Default: Component = {
+  render: args =>
+    html` <gallery-container width="336">
+      <wui-list-content
+        .imageSrc=${args.imageSrc}
+        textTitle=${args.textTitle}
+        .textValue=${args.textValue}
+      ></wui-list-content>
+    </gallery-container>`
+}

apps/gallery/stories/composites/wui-list-wallet-transaction.stories.ts

@@ -0,0 +1,30 @@
+import type { Meta } from '@storybook/web-components'
+import '@web3modal/ui/src/composites/wui-list-wallet-transaction'
+import type { WuiListWalletTransaction } from '@web3modal/ui/src/composites/wui-list-wallet-transaction'
+import { html } from 'lit'
+import '../../components/gallery-container'
+import { networkImageSrc } from '../../utils/PresetUtils'
+
+type Component = Meta<WuiListWalletTransaction>
+
+export default {
+  title: 'Composites/wui-list-wallet-transaction',
+  args: {
+    amount: '0.003',
+    networkCurreny: 'ETH',
+    networkImageUrl: networkImageSrc,
+    receiverAddress: '0x3c8...7fab'
+  }
+} as Component
+
+export const Default: Component = {
+  render: args =>
+    html` <gallery-container width="336">
+      <wui-list-wallet-transaction
+        amount=${args.amount}
+        networkCurreny=${args.networkCurreny}
+        networkImageUrl=${args.networkImageUrl}
+        receiverAddress=${args.receiverAddress}
+      ></wui-list-wallet-transaction>
+    </gallery-container>`
+}

apps/gallery/utils/PresetUtils.ts

@@ -205,6 +205,7 @@ export const iconOptions: IconType[] = [
   'twitterIcon',
   'twitter',
   'verify',
+  'verifyFilled',
   'wallet',
   'walletConnect',
   'walletPlaceholder',
@@ -240,7 +241,7 @@ export const logoOptions: LogoType[] = [
 
 export const placementOptions: PlacementType[] = ['top', 'right', 'bottom', 'left']
 
-export const chipOptions: ChipType[] = ['fill', 'transparent', 'shade']
+export const chipOptions: ChipType[] = ['fill', 'transparent', 'shade', 'success', 'shadeSmall']
 
 export const buttonOptions: ButtonType[] = ['fill', 'accent', 'shade', 'fullWidth', 'accentBg']
 
@@ -284,3 +285,68 @@ export const iconBoxBorderOptions: IconBoxBorderType[] = [
 ]
 
 export const tagLabelOptions = ['get wallet', 'installed', 'qr code', 'recent']
+
+export const signTypedData = {
+  domain: {
+    name: 'Ether Mail',
+    version: '1',
+    chainId: 1,
+    verifyingContract: '0xcccccccccccccccccccccccccccccccccccccccc'
+  },
+  primaryType: 'Mail',
+  types: {
+    EIP712Domain: [
+      {
+        name: 'name',
+        type: 'string'
+      },
+      {
+        name: 'version',
+        type: 'string'
+      },
+      {
+        name: 'chainId',
+        type: 'uint256'
+      },
+      {
+        name: 'verifyingContract',
+        type: 'address'
+      }
+    ],
+    Person: [
+      {
+        name: 'name',
+        type: 'string'
+      },
+      {
+        name: 'wallet',
+        type: 'address'
+      }
+    ],
+    Mail: [
+      {
+        name: 'from',
+        type: 'Person'
+      },
+      {
+        name: 'to',
+        type: 'Person'
+      },
+      {
+        name: 'contents',
+        type: 'string'
+      }
+    ]
+  },
+  message: {
+    from: {
+      name: 'Cow',
+      wallet: '0xcd2a3d9f938e13cd947ec05abc7fe734df8dd826'
+    },
+    to: {
+      name: 'Bob',
+      wallet: '0xbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb'
+    },
+    contents: 'Hello, Bob!'
+  }
+}

apps/laboratory/.env.example

@@ -1,4 +1,4 @@
 # Obtain a project ID from https://cloud.walletconnect.com
 NEXT_PUBLIC_PROJECT_ID=""
 NEXTAUTH_SECRET=""
-NEXTAUTH_URL="http://localhost:3000"
+NEXTAUTH_URL=""

apps/laboratory/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@apps/laboratory",
-  "version": "3.6.0-alpha.0",
+  "version": "3.5.3",
   "private": true,
   "scripts": {
     "dev:laboratory": "next dev",
@@ -15,11 +15,11 @@
     "@chakra-ui/react": "2.8.2",
     "@emotion/react": "11.11.1",
     "@emotion/styled": "11.11.0",
-    "@sentry/browser": "7.88.0",
-    "@sentry/react": "7.88.0",
-    "@web3modal/ethers": "3.6.0-alpha.0",
-    "@web3modal/ethers5": "3.6.0-alpha.0",
-    "@web3modal/wagmi": "3.6.0-alpha.0",
+    "@sentry/browser": "7.89.0",
+    "@sentry/react": "7.89.0",
+    "@web3modal/ethers": "3.5.3",
+    "@web3modal/ethers5": "3.5.3",
+    "@web3modal/wagmi": "3.5.3",
     "framer-motion": "10.16.16",
     "next": "14.0.4",
     "next-auth": "4.24.5",

apps/laboratory/playwright.config.ts

@@ -1,10 +1,11 @@
 import { defineConfig, devices } from '@playwright/test'
-import { LOCAL_LABS_URL } from './tests/shared/constants'
+import { BASE_URL } from './tests/shared/constants'
 
 import { config } from 'dotenv'
+import type { ModalFixture } from './tests/shared/fixtures/w3m-fixture'
 config({ path: './.env.local' })
 
-export default defineConfig({
+export default defineConfig<ModalFixture>({
   testDir: './tests',
 
   fullyParallel: true,
@@ -13,13 +14,13 @@ export default defineConfig({
   reporter: [['list'], ['html']],
 
   expect: {
-    timeout: (process.env['CI'] ? 60 : 5) * 1000
+    timeout: (process.env['CI'] ? 60 : 15) * 1000
   },
   timeout: 60 * 1000,
 
   use: {
     /* Base URL to use in actions like `await page.goto('/')`. */
-    baseURL: LOCAL_LABS_URL,
+    baseURL: BASE_URL,
 
     /* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */
     trace: 'on-first-retry',
@@ -30,20 +31,30 @@ export default defineConfig({
   /* Configure projects for major browsers */
   projects: [
     {
-      name: 'chromium',
-      use: { ...devices['Desktop Chrome'] }
+      name: 'chromium/wagmi',
+      use: { ...devices['Desktop Chrome'], library: 'wagmi' }
     },
 
     {
-      name: 'firefox',
-      use: { ...devices['Desktop Firefox'] }
+      name: 'firefox/wagmi',
+      use: { ...devices['Desktop Firefox'], library: 'wagmi' }
+    },
+
+    {
+      name: 'chromium/ethers',
+      use: { ...devices['Desktop Chrome'], library: 'ethers' }
+    },
+
+    {
+      name: 'firefox/ethers',
+      use: { ...devices['Desktop Firefox'], library: 'ethers' }
     }
   ],
 
   /* Run your local dev server before starting the tests */
   webServer: {
     command: 'npm run playwright:start',
-    url: LOCAL_LABS_URL,
+    url: BASE_URL,
     reuseExistingServer: !process.env['CI']
   }
 })