skatespots/SkateSpots
1
0
Fork 0
Code Issues Pull requests Projects Releases 2 Packages Wiki Activity Actions 1

ui(header): make the user avatar open the profile

Browse source
This commit is contained in:
SkateSpots 2026-10-30 20:51:21 +07:00
parent ee6db357c2
commit 601393ece3
1 changed files with 19 additions and 9 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

28
src/components/Layout.tsx
View file

@ -52,6 +52,7 @@ import {
MessagesSquare, MessagesSquare,
ChevronLeft, ChevronLeft,
ChevronRight, ChevronRight,
ChevronDown,
Search, Search,
} from 'lucide-react'; } from 'lucide-react';
import { OfflineIndicator } from '@/components/OfflineIndicator'; import { OfflineIndicator } from '@/components/OfflineIndicator';
@ -220,8 +221,12 @@ function MobileHeaderUserMenu({
return ( return (
<DropdownMenu> <DropdownMenu>
<DropdownMenuTrigger asChild> <div className="flex items-center gap-0.5">
<button className="touch-manipulation relative flex items-center gap-2 px-2 py-1.5 rounded-full bg-green-500/10 border border-green-500/30 active:scale-95 transition-transform"> <Link
to={`/${nip19.npubEncode(pubkey)}`}
aria-label={t('chromeUi.viewMyProfile')}
className="touch-manipulation relative flex items-center gap-1.5 rounded-l-full rounded-r-md border border-green-500/30 bg-green-500/10 px-1.5 py-1.5 transition-transform active:scale-95"
>
<Avatar className="h-7 w-7 border-2 border-green-500/50"> <Avatar className="h-7 w-7 border-2 border-green-500/50">
<AvatarImage src={avatar} alt={displayName} /> <AvatarImage src={avatar} alt={displayName} />
<AvatarFallback className="bg-green-500/20 text-green-400 text-[10px] font-bold"> <AvatarFallback className="bg-green-500/20 text-green-400 text-[10px] font-bold">
@ -230,14 +235,19 @@ function MobileHeaderUserMenu({
</Avatar> </Avatar>
{/* Status indicator */} {/* Status indicator */}
<UserStatusIndicator pubkey={pubkey} size="sm" /> <UserStatusIndicator pubkey={pubkey} size="sm" />
<span className="text-green-400 text-xs font-bold uppercase tracking-wide hidden xs:inline">
<CheckCircle2 className="h-3 w-3 inline mr-1" />
{t('chromeUi.inBadge')}
</span>
{/* Green online indicator dot */} {/* Green online indicator dot */}
<span className="absolute -bottom-0.5 -right-0.5 w-2.5 h-2.5 bg-green-500 border-2 border-black rounded-full xs:hidden" /> <span className="absolute -bottom-0.5 -right-0.5 h-2.5 w-2.5 rounded-full border-2 border-black bg-green-500 xs:hidden" />
</button> </Link>
</DropdownMenuTrigger> <DropdownMenuTrigger asChild>
<button
type="button"
aria-label={t('chromeUi.menu')}
className="flex h-9 w-5 items-center justify-center rounded-r-full text-green-400/80 transition-colors hover:text-green-300 active:scale-95"
>
<ChevronDown className="h-4 w-4" />
</button>
</DropdownMenuTrigger>
</div>
<DropdownMenuContent align="end" className="w-56 p-2 [&_[role=menuitem]]:min-h-11"> <DropdownMenuContent align="end" className="w-56 p-2 [&_[role=menuitem]]:min-h-11">
{/* User info header */} {/* User info header */}
<div className="px-2 py-3 mb-2 rounded-lg bg-green-500/10 border border-green-500/20"> <div className="px-2 py-3 mb-2 rounded-lg bg-green-500/10 border border-green-500/20">