From b15ce2c1537a2cb8c347737bc3683a34b7c4792b Mon Sep 17 00:00:00 2001
From: codytseng <codytseng@outlook.com>
Date: Thu, 23 Jan 2025 12:01:27 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=F0=9F=90=9B?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/Nip05/index.tsx                |  6 +--
 src/components/SearchDialog/index.tsx         |  2 +-
 .../TextareaWithMentions.tsx/index.tsx        | 44 ++++++++-----------
 src/components/ui/command.tsx                 |  6 +--
 src/hooks/useSearchProfiles.tsx               |  2 +-
 5 files changed, 26 insertions(+), 34 deletions(-)

diff --git a/src/components/Nip05/index.tsx b/src/components/Nip05/index.tsx
index cc2a0367..bf416ff1 100644
--- a/src/components/Nip05/index.tsx
+++ b/src/components/Nip05/index.tsx
@@ -11,18 +11,18 @@ export default function Nip05({ pubkey }: { pubkey: string }) {
   return (
     nip05Name &&
     nip05Domain && (
-      <div className="flex items-center space-x-1">
+      <div className="flex items-center space-x-1 truncate">
         {nip05Name !== '_' ? (
           <div className="text-sm text-muted-foreground truncate">@{nip05Name}</div>
         ) : null}
         <a
           href={`https://${nip05Domain}`}
           target="_blank"
-          className={`flex items-center space-x-1 hover:underline ${nip05IsVerified ? 'text-highlight' : 'text-muted-foreground'}`}
+          className={`flex items-center space-x-1 hover:underline truncate ${nip05IsVerified ? 'text-highlight' : 'text-muted-foreground'}`}
           rel="noreferrer"
         >
           {nip05IsVerified ? <BadgeCheck size={16} /> : <BadgeAlert size={16} />}
-          <div className="text-sm">{nip05Domain}</div>
+          <div className="text-sm truncate">{nip05Domain}</div>
         </a>
       </div>
     )
diff --git a/src/components/SearchDialog/index.tsx b/src/components/SearchDialog/index.tsx
index a833e3fb..2499ed25 100644
--- a/src/components/SearchDialog/index.tsx
+++ b/src/components/SearchDialog/index.tsx
@@ -76,7 +76,7 @@ export function SearchDialog({ open, setOpen }: { open: boolean; setOpen: Dispat
   return (
     <CommandDialog open={open} onOpenChange={setOpen} classNames={{ content: 'max-sm:top-0' }}>
       <CommandInput value={input} onValueChange={setInput} />
-      <CommandList>{list}</CommandList>
+      <CommandList scrollAreaClassName="max-h-[80vh]">{list}</CommandList>
     </CommandDialog>
   )
 }
diff --git a/src/components/TextareaWithMentions.tsx/index.tsx b/src/components/TextareaWithMentions.tsx/index.tsx
index 6164ec0b..8b291278 100644
--- a/src/components/TextareaWithMentions.tsx/index.tsx
+++ b/src/components/TextareaWithMentions.tsx/index.tsx
@@ -1,10 +1,4 @@
-import {
-  Command,
-  CommandGroup,
-  CommandInput,
-  CommandItem,
-  CommandList
-} from '@/components/ui/command'
+import { Command, CommandInput, CommandItem, CommandList } from '@/components/ui/command'
 import { Textarea } from '@/components/ui/textarea'
 import { useSearchProfiles } from '@/hooks'
 import { pubkeyToNpub } from '@/lib/pubkey'
@@ -159,31 +153,29 @@ export default function TextareaWithMentions({
       <Command
         ref={dropdownRef}
         className={cn(
-          'sm:fixed hidden translate-y-2 h-auto max-h-44 w-full sm:w-[462px] z-10 overflow-auto border border-popover shadow'
+          'sm:fixed hidden translate-y-2 h-auto w-full sm:w-[462px] z-10 border border-popover shadow'
         )}
         shouldFilter={false}
       >
         <div className="hidden">
           <CommandInput ref={inputRef} value={commandValue} />
         </div>
-        <CommandList>
-          <CommandGroup>
-            {profiles.map((p) => {
-              return (
-                <CommandItem
-                  key={p.pubkey}
-                  value={`nostr:${pubkeyToNpub(p.pubkey)}`}
-                  onSelect={onCommandSelect}
-                >
-                  <div className="flex gap-2 items-center pointer-events-none">
-                    <SimpleUserAvatar userId={p.pubkey} />
-                    <SimpleUsername userId={p.pubkey} className="font-semibold" />
-                    <Nip05 pubkey={p.pubkey} />
-                  </div>
-                </CommandItem>
-              )
-            })}
-          </CommandGroup>
+        <CommandList scrollAreaClassName="h-44">
+          {profiles.map((p) => {
+            return (
+              <CommandItem
+                key={p.pubkey}
+                value={`nostr:${pubkeyToNpub(p.pubkey)}`}
+                onSelect={onCommandSelect}
+              >
+                <div className="flex gap-2 items-center pointer-events-none truncate">
+                  <SimpleUserAvatar userId={p.pubkey} />
+                  <SimpleUsername userId={p.pubkey} className="font-semibold truncate" />
+                  <Nip05 pubkey={p.pubkey} />
+                </div>
+              </CommandItem>
+            )
+          })}
         </CommandList>
       </Command>
     </div>
diff --git a/src/components/ui/command.tsx b/src/components/ui/command.tsx
index 747a03a6..2741e1fa 100644
--- a/src/components/ui/command.tsx
+++ b/src/components/ui/command.tsx
@@ -77,9 +77,9 @@ CommandInput.displayName = CommandPrimitive.Input.displayName
 
 const CommandList = React.forwardRef<
   React.ElementRef<typeof CommandPrimitive.List>,
-  React.ComponentPropsWithoutRef<typeof CommandPrimitive.List>
->(({ className, ...props }, ref) => (
-  <ScrollArea className="max-h-[80vh]">
+  React.ComponentPropsWithoutRef<typeof CommandPrimitive.List> & { scrollAreaClassName?: string }
+>(({ className, scrollAreaClassName, ...props }, ref) => (
+  <ScrollArea className={scrollAreaClassName}>
     <CommandPrimitive.List ref={ref} className={cn('overflow-x-hidden', className)} {...props} />
   </ScrollArea>
 ))
diff --git a/src/hooks/useSearchProfiles.tsx b/src/hooks/useSearchProfiles.tsx
index 50b41afa..c2b518ea 100644
--- a/src/hooks/useSearchProfiles.tsx
+++ b/src/hooks/useSearchProfiles.tsx
@@ -23,7 +23,7 @@ export function useSearchProfiles(search: string, limit: number) {
       setProfiles([])
       try {
         const profiles = await client.fetchProfiles(
-          searchableRelayUrls.length > 0 ? searchableRelayUrls : SEARCHABLE_RELAY_URLS,
+          searchableRelayUrls.concat(SEARCHABLE_RELAY_URLS).slice(0, 4),
           {
             search,
             limit