From cd1a8a66190d7abf506d3faf4b9eb8bb63ceb286 Mon Sep 17 00:00:00 2001
From: louis-md <louis@margot-duclot.fr>
Date: Tue, 22 Oct 2024 16:29:50 +0200
Subject: [PATCH] Allow users to search supported networks by contract
 addresses

---
 components/SupportedNetworks/Networks.tsx     |  2 +-
 .../SupportedNetworks/useNetworksSearch.ts    | 36 ++++++-------------
 2 files changed, 12 insertions(+), 26 deletions(-)

diff --git a/components/SupportedNetworks/Networks.tsx b/components/SupportedNetworks/Networks.tsx
index 9478486a..f6959c0c 100644
--- a/components/SupportedNetworks/Networks.tsx
+++ b/components/SupportedNetworks/Networks.tsx
@@ -380,7 +380,7 @@ const SupportedNetworks: React.FC = () => {
             <TextField
               className={css.searchField}
               variant='outlined'
-              placeholder='Search by network name or chain ID'
+              placeholder='Search by network name, chain ID or contract address'
               InputProps={{
                 style: {
                   color: 'white',
diff --git a/components/SupportedNetworks/useNetworksSearch.ts b/components/SupportedNetworks/useNetworksSearch.ts
index 67120452..a19cfb2c 100644
--- a/components/SupportedNetworks/useNetworksSearch.ts
+++ b/components/SupportedNetworks/useNetworksSearch.ts
@@ -1,5 +1,4 @@
 import { useMemo } from 'react'
-import Fuse from 'fuse.js'
 import { type Network } from './Networks'
 
 export const useNetworksSearch = (
@@ -13,31 +12,18 @@ export const useNetworksSearch = (
       }),
     [resources]
   )
-  const fuse = useMemo(
-    () =>
-      new Fuse(sortedByChainId, {
-        keys: [
-          {
-            name: 'name',
-            weight: 0.99
-          },
-          {
-            name: 'chainId',
-            weight: 0.5
-          }
-        ],
-        distance: 500,
-        threshold: 0.3,
-        findAllMatches: true
-      }),
-    [sortedByChainId]
-  )
 
   return useMemo(() => {
-    if (query.length === 0) {
-      return sortedByChainId
-    }
+    if (query.length === 0) return sortedByChainId
 
-    return fuse.search(query).map(result => result.item)
-  }, [fuse, sortedByChainId, query])
+    const lowercaseQuery = query.toLowerCase()
+    return sortedByChainId.filter(
+      network =>
+        network.name.toLowerCase().includes(lowercaseQuery) ||
+        network.chainId.toString().includes(lowercaseQuery) ||
+        network.smartAccounts?.some(account =>
+          account.address?.toLowerCase().includes(lowercaseQuery)
+        )
+    )
+  }, [sortedByChainId, query])
 }