(feat): add navbar profile popover (fix): chat input box click area to slim (qol): format
34 lines
1.3 KiB
TypeScript
34 lines
1.3 KiB
TypeScript
import type { User } from "@tensamin/user/context";
|
|
import { Avatar, AvatarFallback, AvatarImage } from "@tensamin/ui";
|
|
import Text from "@tensamin/markdown/text";
|
|
|
|
export default function Profile({ user }: { user: User }) {
|
|
return (
|
|
<div className="flex flex-col gap-2">
|
|
<div className="flex gap-2 items-center">
|
|
<Avatar className="size-10">
|
|
<AvatarImage src={user.avatar} />
|
|
<AvatarFallback className="text-lg">
|
|
{user.display.slice(0, 2).toUpperCase()}
|
|
</AvatarFallback>
|
|
</Avatar>
|
|
<div className="flex flex-col">
|
|
<p className="text-lg font-semibold">{user.display}</p>
|
|
<p className="text-muted-foreground">{user.username}</p>
|
|
</div>
|
|
</div>
|
|
<Text value={user.about || ""} />
|
|
<div className="flex flex-col">
|
|
<p className="text-muted-foreground text-xs overflow-hidden text-ellipsis whitespace-nowrap">
|
|
iota: {user.iota_id}
|
|
</p>
|
|
<p className="text-muted-foreground text-xs overflow-hidden text-ellipsis whitespace-nowrap">
|
|
user: {user.user_id}
|
|
</p>
|
|
<p className="text-muted-foreground text-xs overflow-hidden text-ellipsis whitespace-nowrap">
|
|
pub key: {user.public_key}
|
|
</p>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|