feat: improve search (#460)

* feat: improve search results * feat: improve search results
bgd-labs · Jun 4, 2024 · 2dc0566 · 2dc0566
1 parent fda06a9
commit 2dc0566
Show file tree

Hide file tree

Showing 5 changed files with 75 additions and 68 deletions.
diff --git a/ui/package-lock.json b/ui/package-lock.json
diff --git a/ui/package.json b/ui/package.json
@@ -12,7 +12,7 @@
     "@bgd-labs/js-utils": "^1.1.1",
     "clsx": "^2.1.0",
     "fuse.js": "^7.0.0",
-    "next": "14.1.0",
+    "next": "14.2.3",
     "react": "^18",
     "react-dom": "^18",
     "tailwind-merge": "^2.2.1"

diff --git a/ui/src/app/page.tsx b/ui/src/app/page.tsx
@@ -7,10 +7,12 @@ import { SearchSkeleton } from '@/components/SearchSkeleton';
 import { Footer } from '@/components/Footer';
 import { type SearchItem } from '@/types';
 import logo from '@/assets/logo.svg';
+import { Address, isAddress } from 'viem';
 
-function isEthereumAddress(value: any): value is string {
-  return typeof value === 'string' && /^0x[a-fA-F0-9]{40}$/.test(value);
-}
+const TAG_MAP: Record<string, string[]> = {
+  S_TOKEN: ['stable', 'debt'],
+  V_TOKEN: ['variable', 'debt'],
+};
 
 function flattenObject(
   obj: any,
@@ -33,17 +35,17 @@ function flattenObject(
     }
     if (typeof value === 'object' && value !== null) {
       result.push(...flattenObject(value, newPath, chainId));
-    } else if (isEthereumAddress(value)) {
+    } else if (isAddress(value as string)) {
       const link = `${CHAIN_ID_CLIENT_MAP[chainId!]?.chain?.blockExplorers?.default.url}/address/${value}`;
-
+      const key = newPath[newPath.length - 1];
+      const searchPath = [...newPath, value];
+      if (TAG_MAP[key]) searchPath.push(...TAG_MAP[key]);
       result.push({
         path: newPath,
-        value,
+        value: value as Address,
         chainId,
         link,
-        searchPath: newPath.join(''),
-        library: newPath[0],
-        key: newPath[newPath.length - 1],
+        searchPath: searchPath.join(' '),
       });
     }
   }

diff --git a/ui/src/components/Search.tsx b/ui/src/components/Search.tsx
@@ -10,13 +10,12 @@ import { SearchResult } from './SearchResult';
 
 const fuseOptions = {
   includeScore: true,
-  keys: ['searchPath', 'value', 'library', 'key'],
-  // threshold: 0.6,
-  // ignoreLocation: false,
+  keys: ['searchPath'],
+  threshold: 0.6,
+  ignoreLocation: true,
   useExtendedSearch: true,
 };
 
-const SEARCH_LIMIT = 32;
 const DEBOUNCE_TIME = 150;
 
 export const Search = ({ addresses }: { addresses: SearchItem[] }) => {
@@ -43,8 +42,8 @@ export const Search = ({ addresses }: { addresses: SearchItem[] }) => {
     (search: string) => {
       const fuse = new Fuse(addresses, fuseOptions, fuseIndex);
       if (search) {
-        const limitedSearch = search.slice(0, SEARCH_LIMIT);
-        setResults(fuse.search(limitedSearch, { limit: 100 }));
+        // const limitedSearch = search.slice(0, SEARCH_LIMIT);
+        setResults(fuse.search(search, { limit: 100 }));
       } else {
         setResults([]);
       }

diff --git a/ui/src/types.ts b/ui/src/types.ts
@@ -4,8 +4,4 @@ export type SearchItem = {
   chainId: number | null;
   link: string;
   searchPath: string;
-  // always the root entry point
-  library: string;
-  // always the explicit key of the value
-  key: string;
 };