diff --git a/src/element/chat-message.tsx b/src/element/chat-message.tsx index 0320f87..934b229 100644 --- a/src/element/chat-message.tsx +++ b/src/element/chat-message.tsx @@ -101,7 +101,15 @@ export function ChatMessage({ ref={ref} onClick={() => setShowZapDialog(true)} > - + + ) + } + pubkey={ev.pubkey} + profile={profile} + /> {(hasReactions || hasZaps) && (
diff --git a/src/element/profile.tsx b/src/element/profile.tsx index 08d1ef7..bdedd95 100644 --- a/src/element/profile.tsx +++ b/src/element/profile.tsx @@ -1,4 +1,5 @@ import "./profile.css"; +import type { ReactNode } from "react"; import { Link } from "react-router-dom"; import { useUserProfile } from "@snort/system-react"; import { UserMetadata } from "@snort/system"; @@ -28,17 +29,20 @@ export function getName(pk: string, user?: UserMetadata) { export function Profile({ pubkey, + icon, avatarClassname, options, profile, }: { pubkey: string; + icon?: ReactNode; avatarClassname?: string; options?: ProfileOptions; - profile?: UserMetadata + profile?: UserMetadata; }) { const { inView, ref } = useInView(); - const pLoaded = useUserProfile(System, inView && !profile ? pubkey : undefined) || profile; + const pLoaded = + useUserProfile(System, inView && !profile ? pubkey : undefined) || profile; const showAvatar = options?.showAvatar ?? true; const showName = options?.showName ?? true; @@ -54,6 +58,7 @@ export function Profile({ src={pLoaded?.picture ?? ""} /> ))} + {icon} {showName && ( {options?.overrideName ?? pubkey === "anon" @@ -65,9 +70,15 @@ export function Profile({ ); return pubkey === "anon" ? ( -
{content}
+
+ {content} +
) : ( - + {content} );