add filteroutduplicatewallets logic

reown-com · May 17, 2024 · a8f4518 · a8f4518
1 parent 68a1ca5
commit a8f4518
Show file tree

Hide file tree

Showing 3 changed files with 80 additions and 6 deletions.
diff --git a/packages/scaffold/src/partials/w3m-connect-custom-widget/index.ts b/packages/scaffold/src/partials/w3m-connect-custom-widget/index.ts
@@ -1,11 +1,32 @@
 import type { WcWallet } from '@web3modal/core'
-import { AssetUtil, OptionsController, RouterController } from '@web3modal/core'
+import {
+  AssetUtil,
+  ConnectorController,
+  CoreHelperUtil,
+  OptionsController,
+  RouterController,
+  StorageUtil
+} from '@web3modal/core'
 import { customElement } from '@web3modal/ui'
 import { LitElement, html } from 'lit'
+import { state } from 'lit/decorators.js'
 import { ifDefined } from 'lit/directives/if-defined.js'
 
 @customElement('w3m-connect-custom-widget')
 export class W3mConnectCustomWidget extends LitElement {
+  // -- Members ------------------------------------------- //
+  private unsubscribe: (() => void)[] = []
+
+  // -- State & Properties -------------------------------- //
+  @state() private connectors = ConnectorController.state.connectors
+
+  public constructor() {
+    super()
+    this.unsubscribe.push(
+      ConnectorController.subscribeKey('connectors', val => (this.connectors = val))
+    )
+  }
+
   // -- Render -------------------------------------------- //
   public override render() {
     const { customWallets } = OptionsController.state
@@ -34,8 +55,21 @@ export class W3mConnectCustomWidget extends LitElement {
 
   // -- Private Methods ----------------------------------- //
   private filterOutDuplicateWallets(wallets: WcWallet[]) {
-    // Implement duplicate wallet filtering logic
-    return wallets
+    const recent = StorageUtil.getRecentWallets()
+
+    const connectorRDNSs = this.connectors
+      .map(connector => connector.info?.rdns)
+      .filter(Boolean) as string[]
+
+    const recentRDNSs = recent.map(wallet => wallet.rdns).filter(Boolean) as string[]
+    const allRDNSs = connectorRDNSs.concat(recentRDNSs)
+    if (allRDNSs.includes('io.metamask.mobile') && CoreHelperUtil.isMobile()) {
+      const index = allRDNSs.indexOf('io.metamask.mobile')
+      allRDNSs[index] = 'io.metamask'
+    }
+    const filtered = wallets.filter(wallet => !allRDNSs.includes(String(wallet?.rdns)))
+
+    return filtered
   }
 
   private onConnectWallet(wallet: WcWallet) {

diff --git a/packages/scaffold/src/partials/w3m-connect-featured-widget/index.ts b/packages/scaffold/src/partials/w3m-connect-featured-widget/index.ts
@@ -1,11 +1,36 @@
 import type { WcWallet } from '@web3modal/core'
-import { ApiController, AssetUtil, RouterController } from '@web3modal/core'
+import {
+  ApiController,
+  AssetUtil,
+  ConnectorController,
+  CoreHelperUtil,
+  RouterController,
+  StorageUtil
+} from '@web3modal/core'
 import { customElement } from '@web3modal/ui'
 import { LitElement, html } from 'lit'
+import { state } from 'lit/decorators.js'
 import { ifDefined } from 'lit/directives/if-defined.js'
 
 @customElement('w3m-connect-featured-widget')
 export class W3mConnectFeaturedWidget extends LitElement {
+  // -- Members ------------------------------------------- //
+  private unsubscribe: (() => void)[] = []
+
+  // -- State & Properties -------------------------------- //
+  @state() private connectors = ConnectorController.state.connectors
+
+  public constructor() {
+    super()
+    this.unsubscribe.push(
+      ConnectorController.subscribeKey('connectors', val => (this.connectors = val))
+    )
+  }
+
+  public override disconnectedCallback() {
+    this.unsubscribe.forEach(unsubscribe => unsubscribe())
+  }
+
   // -- Render -------------------------------------------- //
   public override render() {
     const { featured } = ApiController.state
@@ -35,8 +60,21 @@ export class W3mConnectFeaturedWidget extends LitElement {
 
   // -- Private Methods ----------------------------------- //
   private filterOutDuplicateWallets(wallets: WcWallet[]) {
-    // Implement duplicate wallet filtering logic
-    return wallets
+    const recent = StorageUtil.getRecentWallets()
+
+    const connectorRDNSs = this.connectors
+      .map(connector => connector.info?.rdns)
+      .filter(Boolean) as string[]
+
+    const recentRDNSs = recent.map(wallet => wallet.rdns).filter(Boolean) as string[]
+    const allRDNSs = connectorRDNSs.concat(recentRDNSs)
+    if (allRDNSs.includes('io.metamask.mobile') && CoreHelperUtil.isMobile()) {
+      const index = allRDNSs.indexOf('io.metamask.mobile')
+      allRDNSs[index] = 'io.metamask'
+    }
+    const filtered = wallets.filter(wallet => !allRDNSs.includes(String(wallet?.rdns)))
+
+    return filtered
   }
 
   private onConnectWallet(wallet: WcWallet) {

diff --git a/packages/scaffold/src/views/w3m-connect-view/index.ts b/packages/scaffold/src/views/w3m-connect-view/index.ts
@@ -49,6 +49,8 @@ export class W3mConnectView extends LitElement {
             <w3m-connect-recent-widget></w3m-connect-recent-widget>
             <w3m-connect-announced-widget></w3m-connect-announced-widget>
             <w3m-connect-injected-widget></w3m-connect-injected-widget>
+            <w3m-connect-custom-widget></w3m-connect-custom-widget>
+            <w3m-connect-recommended-widget></w3m-connect-recommended-widget>
             <wui-flex class="all-wallets" .margin=${['xs', '0', '0', '0'] as const}>
               <w3m-all-wallets-widget></w3m-all-wallets-widget>
             </wui-flex>