fix: user search

Closes #78

src/components/ProfileSection.tsx

@@ -116,14 +116,20 @@ export const Profile = ({ pubkey }: ProfileProps) => {
     })
   }
 
+  // Try to encode
   let profileRoute = appRoutes.home
+  let nprofile: string | undefined
+  try {
     const hexPubkey = npubToHex(pubkey)
-  if (hexPubkey) {
+    nprofile = hexPubkey
-    profileRoute = getProfilePageRoute(
+      ? nip19.nprofileEncode({
-      nip19.nprofileEncode({
           pubkey: hexPubkey
         })
-    )
+      : undefined
+    profileRoute = nprofile ? getProfilePageRoute(nprofile) : appRoutes.home
+  } catch (error) {
+    // Silently ignore and redirect to home
+    log(true, LogType.Error, 'Failed to encode profile.', error)
   }
 
   return (
@@ -148,7 +154,8 @@ export const Profile = ({ pubkey }: ProfileProps) => {
               <div className='IBMSMSMSSS_Author_Top_Left_InsideDetails'>
                 <div className='IBMSMSMSSS_Author_TopWrapper'>
                   <p className='IBMSMSMSSS_Author_Top_Name'>{displayName}</p>
-                  {nip05 && (
+                  {/* Nip05 can sometimes be an empty object '{}' which causes the error */}
+                  {typeof nip05 === 'string' && (
                     <p className='IBMSMSMSSS_Author_Top_Handle'>{nip05}</p>
                   )}
                 </div>
@@ -181,8 +188,12 @@ export const Profile = ({ pubkey }: ProfileProps) => {
                   <path d='M384 96L384 0h-112c-26.51 0-48 21.49-48 48v288c0 26.51 21.49 48 48 48H464c26.51 0 48-21.49 48-48V128h-95.1C398.4 128 384 113.6 384 96zM416 0v96h96L416 0zM192 352V128h-144c-26.51 0-48 21.49-48 48v288c0 26.51 21.49 48 48 48h192c26.51 0 48-21.49 48-48L288 416h-32C220.7 416 192 387.3 192 352z'></path>
                 </svg>
               </div>
-              <ProfileQRButtonWithPopUp pubkey={pubkey} />
+              {typeof nprofile !== 'undefined' && (
-              {lud16 && <ZapButtonWithPopUp pubkey={pubkey} />}
+                <ProfileQRButtonWithPopUp nprofile={nprofile} />
+              )}
+              {typeof lud16 !== 'undefined' && (
+                <ZapButtonWithPopUp pubkey={pubkey} />
+              )}
             </div>
           </div>
         </div>
@@ -227,20 +238,16 @@ const posts: Post[] = [
 ]
 
 type QRButtonWithPopUpProps = {
-  pubkey: string
+  nprofile: string
 }
 
 export const ProfileQRButtonWithPopUp = ({
-  pubkey
+  nprofile
 }: QRButtonWithPopUpProps) => {
   const [isOpen, setIsOpen] = useState(false)
 
   useBodyScrollDisable(isOpen)
 
-  const nprofile = nip19.nprofileEncode({
-    pubkey
-  })
-
   const onQrCodeClicked = async () => {
     const href = `https://njump.me/${nprofile}`
     const a = document.createElement('a')

src/pages/profile.tsx

@@ -23,6 +23,8 @@ import { FilterOptions, ModDetails, UserRelaysType } from 'types'
 import {
   copyTextToClipboard,
   DEFAULT_FILTER_OPTIONS,
+  log,
+  LogType,
   now,
   npubToHex,
   scrollIntoView,
@@ -42,8 +44,8 @@ export const ProfilePage = () => {
       : undefined
     profilePubkey = value?.data.pubkey
   } catch (error) {
-    // Failed to decode the nprofile
     // Silently ignore and redirect to home or logged in user
+    log(true, LogType.Error, 'Failed to decode nprofile.', error)
   }
 
   const scrollTargetRef = useRef<HTMLDivElement>(null)

src/pages/search.tsx

@@ -37,7 +37,8 @@ import {
   isModDataComplete,
   log,
   LogType,
-  scrollIntoView
+  scrollIntoView,
+  timeout
 } from 'utils'
 
 enum SearchKindEnum {
@@ -373,29 +374,38 @@ const UsersResult = ({
     if (searchTerm === '') {
       setProfiles([])
     } else {
+      const fetchProfiles = async () => {
+        setIsFetching(true)
+
         const filter: NDKFilter = {
           kinds: [NDKKind.Metadata],
           search: searchTerm
         }
 
-      setIsFetching(true)
+        const profiles = await Promise.race([
-      fetchEvents(filter)
+          fetchEvents(filter),
+          timeout(10 * 1000)
+        ])
           .then((events) => {
             const results = events.map((event) => {
               const ndkEvent = new NDKEvent(undefined, event)
               const profile = profileFromEvent(ndkEvent)
               return profile
             })
-          setProfiles(results)
+            return results
           })
           .catch((err) => {
             log(true, LogType.Error, 'An error occurred in fetching users', err)
+            return []
           })
-        .finally(() => {
+
+        setProfiles(profiles)
         setIsFetching(false)
-        })
       }
-  }, [searchTerm, fetchEvents])
+
+      fetchProfiles()
+    }
+  }, [fetchEvents, searchTerm])
 
   const filteredProfiles = useMemo(() => {
     let filtered = [...profiles]

src/pages/settings/profile.tsx

@@ -98,15 +98,15 @@ export const ProfileSettings = () => {
 
   // In case user is not logged in clicking on profile link will navigate to homepage
   let profileRoute = appRoutes.home
+  let nprofile: string | undefined
   if (userState.auth && userState.user) {
     const hexPubkey = npubToHex(userState.user.npub as string)
 
     if (hexPubkey) {
-      profileRoute = getProfilePageRoute(
+      nprofile = nip19.nprofileEncode({
-        nip19.nprofileEncode({
         pubkey: hexPubkey
       })
-      )
+      profileRoute = getProfilePageRoute(nprofile)
     }
   }
 
@@ -247,10 +247,8 @@ export const ProfileSettings = () => {
                         <path d='M384 96L384 0h-112c-26.51 0-48 21.49-48 48v288c0 26.51 21.49 48 48 48H464c26.51 0 48-21.49 48-48V128h-95.1C398.4 128 384 113.6 384 96zM416 0v96h96L416 0zM192 352V128h-144c-26.51 0-48 21.49-48 48v288c0 26.51 21.49 48 48 48h192c26.51 0 48-21.49 48-48L288 416h-32C220.7 416 192 387.3 192 352z'></path>
                       </svg>
                     </div>
-                    {typeof userState.user?.pubkey === 'string' && (
+                    {typeof nprofile !== 'undefined' && (
-                      <ProfileQRButtonWithPopUp
+                      <ProfileQRButtonWithPopUp nprofile={nprofile} />
-                        pubkey={userState.user.pubkey}
-                      />
                     )}
                   </div>
                 </div>