From 0f2f82b3ace1aef141529e001f55122aa9765e78 Mon Sep 17 00:00:00 2001
From: codytseng <codytseng@outlook.com>
Date: Thu, 23 Jan 2025 12:17:04 +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/Embedded/EmbeddedMention.tsx | 9 ++++++++-
 src/components/Username/index.tsx           | 9 +++++++--
 src/pages/secondary/NotePage/index.tsx      | 8 ++++++--
 3 files changed, 21 insertions(+), 5 deletions(-)

diff --git a/src/components/Embedded/EmbeddedMention.tsx b/src/components/Embedded/EmbeddedMention.tsx
index ef5b90e5..a11095fe 100644
--- a/src/components/Embedded/EmbeddedMention.tsx
+++ b/src/components/Embedded/EmbeddedMention.tsx
@@ -2,7 +2,14 @@ import Username from '../Username'
 import { TEmbeddedRenderer } from './types'
 
 export function EmbeddedMention({ userId }: { userId: string }) {
-  return <Username userId={userId} showAt className="text-highlight font-normal inline-block" />
+  return (
+    <Username
+      userId={userId}
+      showAt
+      className="text-highlight font-normal inline-block"
+      withoutSkeleton
+    />
+  )
 }
 
 export const embeddedNostrNpubRenderer: TEmbeddedRenderer = {
diff --git a/src/components/Username/index.tsx b/src/components/Username/index.tsx
index 9b96a7aa..3ae224ec 100644
--- a/src/components/Username/index.tsx
+++ b/src/components/Username/index.tsx
@@ -10,15 +10,20 @@ export default function Username({
   userId,
   showAt = false,
   className,
-  skeletonClassName
+  skeletonClassName,
+  withoutSkeleton = false
 }: {
   userId: string
   showAt?: boolean
   className?: string
   skeletonClassName?: string
+  withoutSkeleton?: boolean
 }) {
   const { profile } = useFetchProfile(userId)
-  if (!profile) return <Skeleton className={cn('w-16 my-1', skeletonClassName)} />
+  if (!profile && !withoutSkeleton) {
+    return <Skeleton className={cn('w-16 my-1', skeletonClassName)} />
+  }
+  if (!profile) return null
 
   const { username, pubkey } = profile
 
diff --git a/src/pages/secondary/NotePage/index.tsx b/src/pages/secondary/NotePage/index.tsx
index 03904d5f..b9a42301 100644
--- a/src/pages/secondary/NotePage/index.tsx
+++ b/src/pages/secondary/NotePage/index.tsx
@@ -81,8 +81,12 @@ function ParentNote({ eventId }: { eventId?: string }) {
         className="flex space-x-1 p-1 items-center clickable text-sm text-muted-foreground hover:text-foreground"
         onClick={() => push(toNote(event))}
       >
-        <UserAvatar userId={event.pubkey} size="tiny" />
-        <Username userId={event.pubkey} className="font-semibold" skeletonClassName="h-4" />
+        <UserAvatar userId={event.pubkey} size="tiny" className="shrink-0" />
+        <Username
+          userId={event.pubkey}
+          className="font-semibold"
+          skeletonClassName="h-4 shrink-0"
+        />
         <div className="truncate">{event.content}</div>
       </Card>
       <div className="ml-5 w-px h-2 bg-border" />