From b2854433ec7b816cf700d13c4bd3fac600c7266d Mon Sep 17 00:00:00 2001 From: Wenty Li <105278450+wenty22@users.noreply.github.com> Date: Fri, 1 Dec 2023 15:22:19 +0800 Subject: [PATCH 1/4] docs: Update CONTRIBUTING.md --- CONTRIBUTING.md | 36 ++++++++++++++++++++++++++++++------ 1 file changed, 30 insertions(+), 6 deletions(-) diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md index 632a16a3..6b195e7a 100644 --- a/CONTRIBUTING.md +++ b/CONTRIBUTING.md @@ -55,11 +55,11 @@ Before adding a new wallet, you need to collect some information: | item | description | e.g. | required | | ------------------ | --------------------------------------------------------------------------------------------------- | ----------------------------------- | -------- | -| wallet name | - | Trust Wallet | yes | +| wallet name | - | Trust Wallet | ✔️ | | short name | If display space is insufficient, the short name will be displayed. | Trust | optional | -| wallet logo | logo in svg format. | - | yes | -| download url | - | https://trustwallet.com/download | yes | -| deeplink | After clicking deeplink in the system browser, we can directly open dapp in the app's dapp browser. | trust://open_url?coin_id=60&url=xxx | yes | +| wallet logo | logo in svg format. | - | ✔️ | +| download url | - | https://trustwallet.com/download | ✔️ | +| deeplink | After clicking deeplink in the system browser, we can directly open dapp in the app's dapp browser. | trust://open_url?coin_id=60&url=xxx | ✔️ | | WalletConnect link | If your app supports WalletConnect, please provides the WalletConnect uri. | trust://wc?uri=xxx | optional | Then you can add it to project by following steps: @@ -117,7 +117,7 @@ export function trustWallet(props: TrustWalletProps = {}): WalletProps { default: 'https://trustwallet.com/', }, spinnerColor: '#1098FC', - installed: isTrustWallet(), + isInstalled: isTrustWallet, createConnector: (chains: Chain[]) => { return new TrustWalletConnector({ chains, @@ -163,7 +163,7 @@ export interface WalletProps { }; spinnerColor?: string; showQRCode?: boolean; - installed: boolean | undefined; + isInstalled: () => boolean | undefined; createConnector: (chains: Chain[]) => Connector; getDeepLink: () => string | undefined; getQRCodeUri?: (uri: string) => string; @@ -205,6 +205,30 @@ const config = createConfig( ); ``` +## Notice!!! Test cases for adding a new wallet + +Before merging the PR to main branch, we hope you complete the following tests, and fill the test results into the PR template, otherwise the PR may +not be approved. + +In general, wallet is available at several different platforms, such as PC browser extension, +Android, iOS and WalletConnect. If your wallet supports the corresponding platform, please make sure +your wallet is worked, can it be connected, can it switch networks, and can it support testnet? + + + +|test case|steps|support?|connected?|switch networks?|support testnet?| +|-|-|-|-|-|-| +|PC, browser extension|
  1. Open dapp in PC browser
  2. Select your wallet, check the functions
    1. |✔️|✔️|✔️|✔️| +|Android, in system browser|
      1. Open dapp in Android system browser, select your wallet
      2. The wallet app will be evoked, and the dapp will be open in the wallet dapp browser
      3. Select your wallet, check the functions
      |✔️|✔️|❌|✔️| +|Android, in wallet dapp browser|
      1. Open dapp in the wallet dapp browser
      2. Select your wallet, check the functions
        1. |✔️|✔️|✔️|✔️| +|iOS, in system browser|
          1. Open dapp in iOS system browser, select your wallet
          2. The wallet app will be evoked, and the dapp will be open in the wallet dapp browser
          3. Select your wallet, check the functions
          |✔️|✔️|✔️|❌| +|iOS, in wallet dapp browser|
          1. Open dapp in the wallet dapp browser
          2. Select your wallet, check the functions
          |✔️|✔️|✔️|❌| +|WalletConnect, PC|
          1. Scan the QR code of WalletConnect using your wallet app
          2. You will see a popup on the wallet app that asks you to connect WalletConnect
          3. Check the functions
          |✔️|✔️|✔️|✔️| +|WalletConnect, Android, in system browser|
          1. Open dapp in Android system browser, select WalletConnect, choose your wallet in WalletConnect wallet list
          2. The wallet app will be evoked, a popup for applying to connect WalletConnect will be displayed.
          3. Check the functions
          |✔️|✔️|✔️|✔️| +|WalletConnect, Android, in wallet dapp browser|
          1. Open dapp in the wallet dapp browser
          2. Select WalletConnect, choose your wallet in WalletConnect wallet list
          3. A popup for applying to connect WalletConnect will be displayed
          4. Check the functions
            1. |✔️|✔️|✔️|✔️| +|WalletConnect, iOS, in system browser|
              1. Open dapp in iOS system browser, select WalletConnect, choose your wallet in WalletConnect wallet list
              2. The wallet app will be evoked, a popup for applying to connect WalletConnect will be displayed.
              3. Check the functions
              |✔️|✔️|✔️|✔️| +|WalletConnect, iOS, in wallet dapp browser|
              1. Open dapp in the wallet dapp browser
              2. Select WalletConnect, choose your wallet in WalletConnect wallet list
              3. A popup for applying to connect WalletConnect will be displayed
              4. Check the functions
                1. |✔️|✔️|✔️|✔️| + ## Release notes A complete development workflow like following: From d18aedbbebe3a7d8975a54af80639f64417a2a0b Mon Sep 17 00:00:00 2001 From: Wenty Li <105278450+wenty22@users.noreply.github.com> Date: Fri, 1 Dec 2023 15:28:33 +0800 Subject: [PATCH 2/4] docs: Add test result table --- .github/PULL_REQUEST_TEMPLATE.md | 19 +++++++++++++++++++ 1 file changed, 19 insertions(+) diff --git a/.github/PULL_REQUEST_TEMPLATE.md b/.github/PULL_REQUEST_TEMPLATE.md index 68e6da91..15fd1e6f 100644 --- a/.github/PULL_REQUEST_TEMPLATE.md +++ b/.github/PULL_REQUEST_TEMPLATE.md @@ -30,3 +30,22 @@ - [ ] I have read the **CONTRIBUTING** document. - [ ] I have added tests to cover my changes. - [ ] All new and existing tests passed. + +## For adding a new wallet + +For more detail, please click [here](../CONTRIBUTING.md#notice-test-cases-for-adding-a-new-wallet) + + +|test case|support?|connected?|switch networks?|support testnet?| +|-|-|-|-|-| +|PC, browser extension| ✔️ | ✔️ | ❌ | ❌ | +|Android, in system browser| | | | | +|Android, in wallet dapp browser| | | | | +|iOS, in system browser| | | | | +|iOS, in wallet dapp browser| | | | | +|WalletConnect, PC| | | | | +|WalletConnect, Android, in system browser| | | | | +|WalletConnect, Android, in wallet dapp browser| | | | | +|WalletConnect, iOS, in system browser| | | | | +|WalletConnect, iOS, in wallet dapp browser| | | | | + From 084a397a261093f64e80c5b5fbd700e2cfe7a3ec Mon Sep 17 00:00:00 2001 From: Wenty Li <105278450+wenty22@users.noreply.github.com> Date: Wed, 13 Dec 2023 10:11:10 +0800 Subject: [PATCH 3/4] build: release 1.0.7 (#60) * chore: Update bug_report template (#26) * feat: Add test example * feat: Update examples * feat: Add disclaimer & download url * docs: Update example * docs: Update docs * docs: Update docs * docs: Update gitignore * docs: Update docs * feat: Add zIndices theme config * feat: Update examples * feat: Refactor switch network modal * refactor: Clean code * feat: Update examples * refactor: Update dependencies * feat: Update version * docs: Update docs * chore: Add changeset * test: Test changeset version * docs: Create LICENSE * docs: Update packages info * chore: Add husky & lint-staged * abc: test commit lint * chore: Update husky * chore: Update husky * test: test husky * chore: Add issue & pr template * fix: Update OpenSwitchNetworkOptions type * feat: Add options to control modal close * feat: Add default wallets to walletConnect * docs: Update useModal document * refactor: Add className to base components * chore: Add release github acton * chore: Add publish ci script * chore: Fix github action * chore: Update github action * test: Test github action * chore: Add .pnpm-store to gitignore * chore: Update github action * chore: Copy readme to walletkit package when publish * chore: Update issue_template * chore: Update pr & issue template * Update bug_report.yml * Create config.yml * Delete .github/ISSUE_TEMPLATE/config.yml * Update bug_report.yml * Update bug_report.yml * chore: Update bug_report.yml * style: Add chains type declaration for dev example * style: Add chains type declaration for dev example * chore: test docs release workflow * chore: Test docs release workflow * chore: test docs release workflow * chore: test docs release workflow * style: Add chains type declaration for dev example * chore: test docs release workflow * chore: Test docs release workflow * chore: test docs release workflow * chore: test docs release workflow * test: test alpha release * chore: update versions (alpha) (#39) Co-authored-by: github-actions[bot] * docs: Update docs * fix: fix theme `auto` mode issue & fix walletConnect chains error * fix: fixed `WalletConnect` automatic connection issue * chore: Update dependencies versions * chore: update versions (alpha) (#41) Co-authored-by: github-actions[bot] * chore: prettier & eslint ignore changeset's md files * fix: No need refresh when open WalletConnect Modal in QRCode page * chore: Add vconsole for dev demo * fix: fixed trustwallet losing status after refreshing * chore: update release info * fix: Fixed trustwallet losing account status after refreshing (#44) * chore: prettier & eslint ignore changeset's md files * fix: No need refresh when open WalletConnect Modal in QRCode page * chore: Add vconsole for dev demo * fix: fixed trustwallet losing status after refreshing * chore: update release info * chore: update versions (alpha) (#45) Co-authored-by: github-actions[bot] * style: Update log output styles * style: Add switchNetwork log * refactor: update the `installed` field that detect whether wallet is installed to a function * fix: fixed conflict issue between trustwallet and metaMask * docs: update release docs * Dev (#47) * chore: prettier & eslint ignore changeset's md files * fix: No need refresh when open WalletConnect Modal in QRCode page * chore: Add vconsole for dev demo * fix: fixed trustwallet losing status after refreshing * chore: update release info * style: Update log output styles * style: Add switchNetwork log * refactor: update the `installed` field that detect whether wallet is installed to a function * fix: fixed conflict issue between trustwallet and metaMask * docs: update release docs * chore: update versions (alpha) (#48) Co-authored-by: github-actions[bot] * docs: Add tests for adding new wallet * Dev (#49) * chore: prettier & eslint ignore changeset's md files * fix: No need refresh when open WalletConnect Modal in QRCode page * chore: Add vconsole for dev demo * fix: fixed trustwallet losing status after refreshing * chore: update release info * style: Update log output styles * style: Add switchNetwork log * refactor: update the `installed` field that detect whether wallet is installed to a function * fix: fixed conflict issue between trustwallet and metaMask * docs: update release docs * docs: Add tests for adding new wallet * docs: Update contributing * docs: Add test result table to PULL_REQUEST_TEMPLATE * fix: fixed multiple wallet conflicts resulting in undetectable issues * chore: Add changeset log * fix: Fixed multiple wallets conficts resulting in undetectable issues. (#51) * docs: Add test result table to PULL_REQUEST_TEMPLATE * fix: fixed multiple wallet conflicts resulting in undetectable issues * chore: Add changeset log * chore: update versions (alpha) (#52) Co-authored-by: github-actions[bot] * fix: Fixed TrustWallet will automatically reconnect after reloading the page. (#53) * docs: Add test result table to PULL_REQUEST_TEMPLATE * fix: fixed multiple wallet conflicts resulting in undetectable issues * chore: Add changeset log * chore: update versions (alpha) (#54) Co-authored-by: github-actions[bot] * feat: add `action` prop to WalletKitButton & WalletKitButton.Custom to support the case of adding network. * Add `action` prop to WalletKitButton & WalletKitButton.Custom to support the case of adding network. (#56) * docs: Add test result table to PULL_REQUEST_TEMPLATE * fix: fixed multiple wallet conflicts resulting in undetectable issues * chore: Add changeset log * feat: add `action` prop to WalletKitButton & WalletKitButton.Custom to support the case of adding network. * chore: update versions (alpha) (#57) Co-authored-by: github-actions[bot] * fix: fix theme configuration naming error issue * docs: Add changeset docs * build: release --------- Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com> Co-authored-by: github-actions[bot] --- .changeset/afraid-crabs-pump.md | 5 + .changeset/famous-drinks-behave.md | 5 + .changeset/happy-hounds-complain.md | 5 + .changeset/honest-numbers-hug.md | 5 + .changeset/late-birds-compare.md | 5 + .changeset/lovely-months-argue.md | 5 + .changeset/modern-comics-smell.md | 5 + .changeset/pre.json | 19 + .changeset/pretty-flowers-rhyme.md | 5 + .eslintignore | 3 +- .github/actions/setup/action.yaml | 25 + .github/workflows/docs.yaml | 38 ++ .github/workflows/release.yaml | 30 +- .prettierignore | 2 +- CONTRIBUTING.md | 8 +- README.md | 6 +- examples/nextjs/package.json | 4 +- examples/nextjs/pages/_app.tsx | 2 +- examples/nextjs/pages/_document.tsx | 2 + examples/vite/package.json | 4 +- examples/vite/src/App.tsx | 2 +- package.json | 13 +- packages/walletkit/CHANGELOG.md | 76 ++- packages/walletkit/README.md | 6 +- packages/walletkit/dev/App.tsx | 3 + packages/walletkit/dev/index.html | 27 + packages/walletkit/dev/vite.config.ts | 7 +- packages/walletkit/package.json | 7 +- .../src/chains/icons/EthereumIcon.tsx | 14 + packages/walletkit/src/chains/index.tsx | 28 +- .../src/components/EthereumScript/index.tsx | 30 ++ .../src/components/ModalProvider/context.ts | 7 +- .../src/components/ModalProvider/index.tsx | 10 +- .../src/components/ThemeProvider/index.tsx | 4 +- .../WalletKitButton/ConnectButton/index.tsx | 15 +- .../ConnectButtonRenderer/index.tsx | 15 +- .../components/WalletKitProvider/context.ts | 6 +- .../components/WalletKitProvider/index.tsx | 10 +- .../src/defaultConfig/getDefaultConfig.ts | 53 +- packages/walletkit/src/globalData/index.ts | 20 +- .../walletkit/src/hooks/useClickWallet.ts | 13 +- packages/walletkit/src/hooks/useConnector.ts | 6 - packages/walletkit/src/hooks/useQRCodeUri.ts | 24 +- .../src/hooks/useWalletConnectModal.ts | 16 +- .../src/hooks/useWalletKitConnect.ts | 8 +- .../src/hooks/useWalletKitSwitchNetwork.ts | 10 +- packages/walletkit/src/index.ts | 1 + .../src/pages/ConnectWithQRCode/index.tsx | 6 - .../walletkit/src/pages/Connecting/index.tsx | 26 +- .../src/pages/Connectors/GridLayout/index.tsx | 10 +- .../pages/Connectors/GridLayout/styles.css.ts | 4 +- .../src/pages/Connectors/ListLayout/index.tsx | 10 +- .../walletkit/src/pages/Connectors/index.tsx | 9 +- .../src/pages/SwitchNetwork/index.tsx | 6 +- packages/walletkit/src/themes/base.ts | 8 +- packages/walletkit/src/typings.d.ts | 1 - packages/walletkit/src/utils/common.ts | 8 + .../src/wallets/binanceWeb3Wallet/index.tsx | 6 +- .../src/wallets/coinbaseWallet/icon.tsx | 15 +- .../src/wallets/coinbaseWallet/index.tsx | 7 +- .../walletkit/src/wallets/injected/index.tsx | 2 +- .../src/wallets/mathWallet/index.tsx | 2 +- .../walletkit/src/wallets/metaMask/icon.tsx | 15 +- .../walletkit/src/wallets/metaMask/index.tsx | 16 +- .../walletkit/src/wallets/okxWallet/index.tsx | 4 +- packages/walletkit/src/wallets/safe/index.tsx | 2 +- .../src/wallets/tokenPocket/icon.tsx | 2 +- .../src/wallets/tokenPocket/index.tsx | 10 +- .../src/wallets/trustWallet/connector.ts | 8 + .../src/wallets/trustWallet/index.tsx | 8 +- packages/walletkit/src/wallets/types.ts | 2 +- .../src/wallets/walletConnect/index.tsx | 11 +- pnpm-lock.yaml | 466 +++++++++--------- website/package.json | 5 +- website/src/App.tsx | 8 +- website/src/components/Layout/index.tsx | 6 +- website/src/components/WalletKit/index.tsx | 2 +- website/src/pages/index.mdx | 9 +- 78 files changed, 798 insertions(+), 510 deletions(-) create mode 100644 .changeset/afraid-crabs-pump.md create mode 100644 .changeset/famous-drinks-behave.md create mode 100644 .changeset/happy-hounds-complain.md create mode 100644 .changeset/honest-numbers-hug.md create mode 100644 .changeset/late-birds-compare.md create mode 100644 .changeset/lovely-months-argue.md create mode 100644 .changeset/modern-comics-smell.md create mode 100644 .changeset/pre.json create mode 100644 .changeset/pretty-flowers-rhyme.md create mode 100644 .github/actions/setup/action.yaml create mode 100644 .github/workflows/docs.yaml create mode 100644 packages/walletkit/src/chains/icons/EthereumIcon.tsx create mode 100644 packages/walletkit/src/components/EthereumScript/index.tsx delete mode 100644 packages/walletkit/src/hooks/useConnector.ts diff --git a/.changeset/afraid-crabs-pump.md b/.changeset/afraid-crabs-pump.md new file mode 100644 index 00000000..c9bc7057 --- /dev/null +++ b/.changeset/afraid-crabs-pump.md @@ -0,0 +1,5 @@ +--- +'@totejs/walletkit': patch +--- + +Fixed theme configuration naming error issue diff --git a/.changeset/famous-drinks-behave.md b/.changeset/famous-drinks-behave.md new file mode 100644 index 00000000..d53113e8 --- /dev/null +++ b/.changeset/famous-drinks-behave.md @@ -0,0 +1,5 @@ +--- +'@totejs/walletkit': patch +--- + +Fixed TrustWallet will automatically reconnect after reloading the page. diff --git a/.changeset/happy-hounds-complain.md b/.changeset/happy-hounds-complain.md new file mode 100644 index 00000000..17ddadad --- /dev/null +++ b/.changeset/happy-hounds-complain.md @@ -0,0 +1,5 @@ +--- +'@totejs/walletkit': patch +--- + +refactor: update the `installed` field that detect whether wallet is installed to a function diff --git a/.changeset/honest-numbers-hug.md b/.changeset/honest-numbers-hug.md new file mode 100644 index 00000000..12669d36 --- /dev/null +++ b/.changeset/honest-numbers-hug.md @@ -0,0 +1,5 @@ +--- +'@totejs/walletkit': patch +--- + +Fixed multiple wallets conficts resulting in undetectable issues. diff --git a/.changeset/late-birds-compare.md b/.changeset/late-birds-compare.md new file mode 100644 index 00000000..2471f4e7 --- /dev/null +++ b/.changeset/late-birds-compare.md @@ -0,0 +1,5 @@ +--- +'@totejs/walletkit': patch +--- + +Fixed `WalletConnect` automatic connection issue in the follow scenario: connect the WalletConnect -> close browser -> reopen browser -> disconnect -> select WalletConnect, will automatically connect. diff --git a/.changeset/lovely-months-argue.md b/.changeset/lovely-months-argue.md new file mode 100644 index 00000000..8674cc05 --- /dev/null +++ b/.changeset/lovely-months-argue.md @@ -0,0 +1,5 @@ +--- +'@totejs/walletkit': patch +--- + +Fixed trustwallet losing account status after refreshing diff --git a/.changeset/modern-comics-smell.md b/.changeset/modern-comics-smell.md new file mode 100644 index 00000000..55dfc42c --- /dev/null +++ b/.changeset/modern-comics-smell.md @@ -0,0 +1,5 @@ +--- +'@totejs/walletkit': patch +--- + +Fixed conflict issue between trustwallet and metaMask. diff --git a/.changeset/pre.json b/.changeset/pre.json new file mode 100644 index 00000000..06ad5de3 --- /dev/null +++ b/.changeset/pre.json @@ -0,0 +1,19 @@ +{ + "mode": "exit", + "tag": "alpha", + "initialVersions": { + "example-nextjs": "0.0.1", + "example-vite": "0.0.1", + "@totejs/walletkit": "1.0.7-alpha.2", + "website": "0.0.1" + }, + "changesets": [ + "famous-drinks-behave", + "happy-hounds-complain", + "honest-numbers-hug", + "late-birds-compare", + "lovely-months-argue", + "modern-comics-smell", + "pretty-flowers-rhyme" + ] +} diff --git a/.changeset/pretty-flowers-rhyme.md b/.changeset/pretty-flowers-rhyme.md new file mode 100644 index 00000000..261fa305 --- /dev/null +++ b/.changeset/pretty-flowers-rhyme.md @@ -0,0 +1,5 @@ +--- +'@totejs/walletkit': patch +--- + +Add `action` prop to WalletKitButton & WalletKitButton.Custom to support the case of adding network. diff --git a/.eslintignore b/.eslintignore index 3859ffd8..2ff8f9da 100644 --- a/.eslintignore +++ b/.eslintignore @@ -1,4 +1,3 @@ .next dist -CHANGELOG.md -build.cjs \ No newline at end of file +**/*.md \ No newline at end of file diff --git a/.github/actions/setup/action.yaml b/.github/actions/setup/action.yaml new file mode 100644 index 00000000..7b3a6999 --- /dev/null +++ b/.github/actions/setup/action.yaml @@ -0,0 +1,25 @@ +name: 'setup' +description: Prepare the environment + +runs: + using: composite + steps: + - name: Setup node.js + uses: actions/setup-node@v3 + with: + node-version: 16 + + - name: Setup pnpm + uses: pnpm/action-setup@v2 + id: pnpm-install + with: + version: 8 + run_install: false + + - name: Setup pnpm config + shell: bash + run: pnpm config set store-dir .pnpm-store + + - name: Install dependencies + shell: bash + run: pnpm install diff --git a/.github/workflows/docs.yaml b/.github/workflows/docs.yaml new file mode 100644 index 00000000..989ab81d --- /dev/null +++ b/.github/workflows/docs.yaml @@ -0,0 +1,38 @@ +name: Deploy docs +on: + push: + branches: + - main + - alpha + +jobs: + release: + name: deploy docs + if: github.repository == 'node-real/walletkit' + timeout-minutes: 10 + runs-on: ubuntu-latest + steps: + - name: Checkout code repository + uses: actions/checkout@v3 + with: + fetch-depth: 0 + + - uses: ./.github/actions/setup + + - name: Build docs + run: pnpm build:docs + + - name: Redirect + run: | + mkdir -p ./website/dist/website/dist + cat << EOF > "./website/dist/website/dist/index.html" + + EOF + + - name: Deploy docs + uses: JamesIves/github-pages-deploy-action@v4 + with: + folder: ./website/dist + branch: 'docs' + clean: true + force: true diff --git a/.github/workflows/release.yaml b/.github/workflows/release.yaml index 391aa96e..7815ae84 100644 --- a/.github/workflows/release.yaml +++ b/.github/workflows/release.yaml @@ -3,17 +3,15 @@ on: push: branches: - main + - alpha - 0.x - -env: - CI: true - PNPM_CACHE_FOLDER: .pnpm-store + - 0.x-alpha jobs: release: name: release if: github.repository == 'node-real/walletkit' - timeout-minutes: 15 + timeout-minutes: 10 runs-on: ubuntu-latest steps: - name: Checkout code repository @@ -21,17 +19,10 @@ jobs: with: fetch-depth: 0 - - name: Setup node.js - uses: actions/setup-node@v3 - with: - node-version: 16 + - uses: ./.github/actions/setup - - name: Setup pnpm - uses: pnpm/action-setup@v2 - id: pnpm-install - with: - version: 8 - run_install: false + - name: Build packages + run: pnpm build - name: Creating .npmrc run: | @@ -41,15 +32,6 @@ jobs: env: NPM_TOKEN: ${{ secrets.NPM_TOKEN }} - - name: Setup pnpm config - run: pnpm config set store-dir $PNPM_CACHE_FOLDER - - - name: Install dependencies - run: pnpm install - - - name: Build packages - run: pnpm --filter "@totejs/**" build - - name: Create and publish versions uses: changesets/action@v1 with: diff --git a/.prettierignore b/.prettierignore index 9262527b..2ff8f9da 100644 --- a/.prettierignore +++ b/.prettierignore @@ -1,3 +1,3 @@ .next dist -CHANGELOG.md \ No newline at end of file +**/*.md \ No newline at end of file diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md index 6b195e7a..87fba8a3 100644 --- a/CONTRIBUTING.md +++ b/CONTRIBUTING.md @@ -207,13 +207,9 @@ const config = createConfig( ## Notice!!! Test cases for adding a new wallet -Before merging the PR to main branch, we hope you complete the following tests, and fill the test results into the PR template, otherwise the PR may -not be approved. - -In general, wallet is available at several different platforms, such as PC browser extension, -Android, iOS and WalletConnect. If your wallet supports the corresponding platform, please make sure -your wallet is worked, can it be connected, can it switch networks, and can it support testnet? +Before merging the PR to main branch, we hope you complete the following tests, and fill the test results into the PR template, otherwise the PR may not be approved. +In general, wallet is available at several different platforms, such as PC browser extension, Android, iOS and WalletConnect. If your wallet supports the corresponding platform, please make sure your wallet is worked, can it be connected, can it switch networks, and can it support testnet? |test case|steps|support?|connected?|switch networks?|support testnet?| diff --git a/README.md b/README.md index b0e3b47f..78461d3d 100644 --- a/README.md +++ b/README.md @@ -10,14 +10,14 @@ WalletKit is a React component library for easily connecting a wallet to your dA ## Documentation -For full documentation, visit [here](https://node-real.github.io/walletkit/website/dist/#/index). +For full documentation, visit [here](https://node-real.github.io/walletkit). ## Examples The following examples are provided in the [examples](./examples/) folder of this repo. -- [nextjs](https://github.com/node-real/walletkit/tree/main/examples/nextjs) -- [vite](https://github.com/node-real/walletkit/tree/main/examples/vite) +- [nextjs](./examples/nextjs/) +- [vite](./examples/vite/) ## Installation diff --git a/examples/nextjs/package.json b/examples/nextjs/package.json index 8ae42fd4..c486f2ed 100644 --- a/examples/nextjs/package.json +++ b/examples/nextjs/package.json @@ -14,12 +14,12 @@ "next": "^13.5.6", "react": "^18.2.0", "react-dom": "^18.2.0", - "viem": "^1.19.8", + "viem": "^1.19.9", "wagmi": "^1.4.7" }, "devDependencies": { "@types/node": "^20.10.0", - "@types/react": "^18.2.38", + "@types/react": "^18.2.39", "@types/react-dom": "^18.2.17", "typescript": "^5.3.2" } diff --git a/examples/nextjs/pages/_app.tsx b/examples/nextjs/pages/_app.tsx index b4a8eb0e..d9387ed6 100644 --- a/examples/nextjs/pages/_app.tsx +++ b/examples/nextjs/pages/_app.tsx @@ -27,7 +27,7 @@ const config = createConfig( ); const options: WalletKitOptions = { - initialChainId: 56, + initialChainId: 1, }; export default function App({ Component, pageProps }: AppProps) { diff --git a/examples/nextjs/pages/_document.tsx b/examples/nextjs/pages/_document.tsx index 86b57f74..b4c55d0a 100644 --- a/examples/nextjs/pages/_document.tsx +++ b/examples/nextjs/pages/_document.tsx @@ -1,10 +1,12 @@ import { Html, Head, Main, NextScript } from 'next/document'; +import { EthereumScript } from '@totejs/walletkit'; export default function Document() { return ( WalletKit Next.js Example +
                  diff --git a/examples/vite/package.json b/examples/vite/package.json index 6a62c762..a19cc36f 100644 --- a/examples/vite/package.json +++ b/examples/vite/package.json @@ -13,11 +13,11 @@ "@totejs/walletkit": "workspace:*", "react": "^18.2.0", "react-dom": "^18.2.0", - "viem": "^1.19.8", + "viem": "^1.19.9", "wagmi": "^1.4.7" }, "devDependencies": { - "@types/react": "^18.2.38", + "@types/react": "^18.2.39", "@types/react-dom": "^18.2.17", "@vitejs/plugin-react": "^4.2.0", "typescript": "^5.3.2", diff --git a/examples/vite/src/App.tsx b/examples/vite/src/App.tsx index 455a875c..38459e33 100644 --- a/examples/vite/src/App.tsx +++ b/examples/vite/src/App.tsx @@ -25,7 +25,7 @@ const config = createConfig( ); const options: WalletKitOptions = { - initialChainId: 56, + initialChainId: 1, }; export default function App() { diff --git a/package.json b/package.json index eb808576..e8c2cac6 100644 --- a/package.json +++ b/package.json @@ -9,12 +9,17 @@ "scripts": { "prepare": "husky install", "lint": "pnpm eslint .", - "dev": "pnpm --filter @totejs/walletkit dev", - "ci:version": "pnpm changeset version && pnpm install && cp README.md packages/walletkit/README.md", - "ci:publish": "pnpm publish -r" + "dev": "pnpm --F @totejs/walletkit dev", + "build": "pnpm --F @totejs/walletkit build", + "dev:docs": "pnpm --F @totejs/walletkit build:watch & pnpm --F website dev", + "build:docs": "pnpm --F @totejs/walletkit build && pnpm --F website build", + "pre:enter": "pnpm changeset pre enter alpha", + "pre:exit": "pnpm changeset pre exit", + "ci:version": "pnpm changeset version && cp README.md packages/walletkit/README.md", + "ci:publish": "pnpm changeset publish" }, "devDependencies": { - "@changesets/cli": "^2.26.2", + "@changesets/cli": "^2.27.1", "@commitlint/cli": "^18.4.3", "@commitlint/config-conventional": "^18.4.3", "@typescript-eslint/eslint-plugin": "^5.62.0", diff --git a/packages/walletkit/CHANGELOG.md b/packages/walletkit/CHANGELOG.md index ae2a8fc6..06268094 100644 --- a/packages/walletkit/CHANGELOG.md +++ b/packages/walletkit/CHANGELOG.md @@ -1,35 +1,79 @@ # @totejs/walletkit +## 1.0.7-alpha.6 + +### Patch Changes + +- c431545: Add `action` prop to WalletKitButton & WalletKitButton.Custom to support the case of + adding network. + +## 1.0.7-alpha.5 + +### Patch Changes + +- f851750: Fixed TrustWallet will automatically reconnect after reloading the page. + +## 1.0.7-alpha.4 + +### Patch Changes + +- 78c9fc8: Fixed multiple wallets conficts resulting in undetectable issues. + +## 1.0.7-alpha.3 + +### Patch Changes + +- e418a56: Update the `installed` field that detect whether wallet is installed to a function +- e418a56: Fixed conflict issue between trustwallet and metaMask. + +## 1.0.7-alpha.2 + +### Patch Changes + +- 52e9976: Fixed trustwallet losing account status after refreshing + +## 1.0.7-alpha.1 + +### Patch Changes + +- 3dd2578: Fixed `WalletConnect` automatic connection issue in the follow scenario: connect the + WalletConnect -> close browser -> reopen browser -> disconnect -> select WalletConnect, will + automatically connect. + ## 1.0.6 ### Patch Changes -- 9fd73b8: Add chains type declaration for dev example -- 9fd73b8: Fixed typescript declaration files export path error, remove `dev` in tsconfig.json - includes field +- 9fd73b8: + - Add chains type declaration for `dev example` +- 9fd73b8: + - Fixed typescript declaration files export path error, remove `dev` from tsconfig.json includes + field ## 1.0.5 ### Patch Changes -- d3aaaf9: Add chains type declaration for dev example -- 12ebee8: Add Binance Web3 Wallet & Coinbase Wallet & OKX Wallet & MathWallet support. +- 12ebee8: + + - Add Binance Web3 Wallet & Coinbase Wallet & OKX Wallet & MathWallet support. - Add showQRCode & getQRCodeUri configuration items to support display a QR code when a wallet is - not installed. + - Add showQRCode & getQRCodeUri configuration items to support display a QR code when a wallet is + not installed. - UI adapted to mobile end and multiple wallets. + - UI adapted to mobile end and multiple wallets. - Fixed the hover effect did not disappear after clicking button on the mobile end. + - Fixed the hover effect did not disappear after clicking button on the mobile end. - Fixed walletConnect popup and QR code display being very slow issue. + - Fixed walletConnect popup and QR code display being very slow issue. - Disabled page scrolling when opening walletkit modal. + - Disabled page scrolling when opening walletkit modal. - For a smoother development experience, remove `examples/test` and create a dev demo in - `packages/walletkit`. + - For a smoother development experience, remove `examples/test` and create a dev demo in + `packages/walletkit`. - Update walletConnect `relayUrl` to `wss://relay.walletconnect.org`. + - Update walletConnect `relayUrl` to `wss://relay.walletconnect.org`. -- 4a88b07: Remove default `initialChainId` to support the case only connecting a wallet and not - switching a network. +- 4a88b07: + - Remove default `initialChainId` to support the case only connecting a wallet and not switching a + network. diff --git a/packages/walletkit/README.md b/packages/walletkit/README.md index b0e3b47f..78461d3d 100644 --- a/packages/walletkit/README.md +++ b/packages/walletkit/README.md @@ -10,14 +10,14 @@ WalletKit is a React component library for easily connecting a wallet to your dA ## Documentation -For full documentation, visit [here](https://node-real.github.io/walletkit/website/dist/#/index). +For full documentation, visit [here](https://node-real.github.io/walletkit). ## Examples The following examples are provided in the [examples](./examples/) folder of this repo. -- [nextjs](https://github.com/node-real/walletkit/tree/main/examples/nextjs) -- [vite](https://github.com/node-real/walletkit/tree/main/examples/vite) +- [nextjs](./examples/nextjs/) +- [vite](./examples/vite/) ## Installation diff --git a/packages/walletkit/dev/App.tsx b/packages/walletkit/dev/App.tsx index df07e60e..b712b404 100644 --- a/packages/walletkit/dev/App.tsx +++ b/packages/walletkit/dev/App.tsx @@ -1,5 +1,6 @@ import { chains } from './chains'; import { WagmiConfig, createConfig } from 'wagmi'; +import VConsole from 'vconsole'; import { SwitchNetworkModal, ThemeMode, @@ -23,6 +24,8 @@ import { } from '../src/wallets'; import React from 'react'; +new VConsole(); + const config = createConfig( getDefaultConfig({ autoConnect: true, diff --git a/packages/walletkit/dev/index.html b/packages/walletkit/dev/index.html index f5e32244..07e23793 100644 --- a/packages/walletkit/dev/index.html +++ b/packages/walletkit/dev/index.html @@ -5,6 +5,33 @@ WalletKit Test Demo + diff --git a/packages/walletkit/dev/vite.config.ts b/packages/walletkit/dev/vite.config.ts index 6334f25c..4843eec6 100644 --- a/packages/walletkit/dev/vite.config.ts +++ b/packages/walletkit/dev/vite.config.ts @@ -6,7 +6,12 @@ import { vanillaExtractPlugin } from '@vanilla-extract/vite-plugin'; export default defineConfig({ root: './dev', - plugins: [react(), vanillaExtractPlugin()], + plugins: [ + react(), + vanillaExtractPlugin({ + identifiers: ({ hash }) => `wk_${hash}`, + }), + ], resolve: { alias: { '@': path.resolve(__dirname, '../src'), diff --git a/packages/walletkit/package.json b/packages/walletkit/package.json index 0b4b0f1b..f4852f70 100644 --- a/packages/walletkit/package.json +++ b/packages/walletkit/package.json @@ -1,6 +1,6 @@ { "name": "@totejs/walletkit", - "version": "1.0.6", + "version": "1.0.7-alpha.6", "author": "node-real", "private": false, "description": "WalletKit is a React component library for easily connecting a wallet to your dApp.", @@ -43,7 +43,7 @@ "devDependencies": { "@rollup/plugin-node-resolve": "^15.2.3", "@types/qrcode": "^1.5.5", - "@types/react": "^18.2.38", + "@types/react": "^18.2.39", "@types/react-dom": "^18.2.17", "@vanilla-extract/css": "^1.14.0", "@vanilla-extract/vite-plugin": "^3.9.2", @@ -52,7 +52,8 @@ "react-dom": "^18.2.0", "rollup-plugin-peer-deps-external": "^2.2.4", "typescript": "^5.3.2", - "viem": "^1.19.8", + "vconsole": "^3.15.1", + "viem": "^1.19.9", "vite": "^4.5.0", "vite-plugin-dts": "^3.6.3", "wagmi": "^1.4.7" diff --git a/packages/walletkit/src/chains/icons/EthereumIcon.tsx b/packages/walletkit/src/chains/icons/EthereumIcon.tsx new file mode 100644 index 00000000..4cc13998 --- /dev/null +++ b/packages/walletkit/src/chains/icons/EthereumIcon.tsx @@ -0,0 +1,14 @@ +import { SVGIconProps } from '@/types'; + +export function EthereumIcon(props: SVGIconProps) { + return ( + + + + + + + + + ); +} diff --git a/packages/walletkit/src/chains/index.tsx b/packages/walletkit/src/chains/index.tsx index 2235f9fc..5441e11a 100644 --- a/packages/walletkit/src/chains/index.tsx +++ b/packages/walletkit/src/chains/index.tsx @@ -1,7 +1,13 @@ import { BscIcon } from './icons/BscIcon'; import { ComboIcon } from './icons/ComboIcon'; +import { EthereumIcon } from './icons/EthereumIcon'; const chainsConfig = [ + { + id: 1, + name: 'Ethereum', + logo: , + }, { id: 56, name: 'BSC', @@ -15,7 +21,27 @@ const chainsConfig = [ { id: 91715, name: 'Combo Testnet', - logo: , + logo: , + }, + { + id: 204, + name: 'opBNB', + logo: , + }, + { + id: 1017, + name: 'BNB Greenfield', + logo: , + }, + { + id: 5600, + name: 'BNB Greenfield Testnet', + logo: , + }, + { + id: 9000, + name: 'BNB Greenfield Devnet', + logo: , }, ]; diff --git a/packages/walletkit/src/components/EthereumScript/index.tsx b/packages/walletkit/src/components/EthereumScript/index.tsx new file mode 100644 index 00000000..1fb856d3 --- /dev/null +++ b/packages/walletkit/src/components/EthereumScript/index.tsx @@ -0,0 +1,30 @@ +export function EthereumScript() { + const scriptHtml = ` + (function() { + try { + const isMobile = + /android|iPhone|iPad|iPod/i.test(navigator.userAgent) || + (navigator.platform === 'MacIntel' && navigator.maxTouchPoints > 1); + + if (!isMobile && window.ethereum && window.ethereum.isMetaMask && window.trustwallet) { + const originalEthereum = window.ethereum; + + Object.defineProperty(window, 'ethereum', { + enumerable: true, + configurable: true, + set(v) { + if (v.isTrust || v.isTrustWallet) return; + this.value = v; + }, + get() { + return this.value ?? originalEthereum; + }, + }); + } + } catch (err) { + console.error('[ethereum script]', err); + } + })() + `; + return