fix: 🐛

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>
     )

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>
   )
 }

src/components/TextareaWithMentions.tsx/index.tsx

@@ -1,10 +1,4 @@
-import {
+import { Command, CommandInput, CommandItem, CommandList } from '@/components/ui/command'
-  Command,
-  CommandGroup,
-  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>
+        <CommandList scrollAreaClassName="h-44">
-          <CommandGroup>
+          {profiles.map((p) => {
-            {profiles.map((p) => {
+            return (
-              return (
+              <CommandItem
-                <CommandItem
+                key={p.pubkey}
-                  key={p.pubkey}
+                value={`nostr:${pubkeyToNpub(p.pubkey)}`}
-                  value={`nostr:${pubkeyToNpub(p.pubkey)}`}
+                onSelect={onCommandSelect}
-                  onSelect={onCommandSelect}
+              >
-                >
+                <div className="flex gap-2 items-center pointer-events-none truncate">
-                  <div className="flex gap-2 items-center pointer-events-none">
+                  <SimpleUserAvatar userId={p.pubkey} />
-                    <SimpleUserAvatar userId={p.pubkey} />
+                  <SimpleUsername userId={p.pubkey} className="font-semibold truncate" />
-                    <SimpleUsername userId={p.pubkey} className="font-semibold" />
+                  <Nip05 pubkey={p.pubkey} />
-                    <Nip05 pubkey={p.pubkey} />
+                </div>
-                  </div>
+              </CommandItem>
-                </CommandItem>
+            )
-              )
+          })}
-            })}
-          </CommandGroup>
         </CommandList>
       </Command>
     </div>

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>
+  React.ComponentPropsWithoutRef<typeof CommandPrimitive.List> & { scrollAreaClassName?: string }
->(({ className, ...props }, ref) => (
+>(({ className, scrollAreaClassName, ...props }, ref) => (
-  <ScrollArea className="max-h-[80vh]">
+  <ScrollArea className={scrollAreaClassName}>
     <CommandPrimitive.List ref={ref} className={cn('overflow-x-hidden', className)} {...props} />
   </ScrollArea>
 ))

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