xiaoxue_admin
/
Folo
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat: user menu icons and profile item

This commit is contained in:
DIYgod 2024-07-08 20:37:30 +08:00
parent ed04be028c
commit 00c5c70b53
No known key found for this signature in database
4 changed files with 27 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
icons/mgc/exit_cute_re.svg Normal file
View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><path fill="#fff" fill-opacity=".01" d="M24 0v24H0V0z"/><path stroke="#10161F" stroke-linecap="round" stroke-width="2" d="M12.5 12H20m-2.5-2.828a8.616 8.616 0 0 1 2.478 2.307.89.89 0 0 1 0 1.042A8.631 8.631 0 0 1 17.5 14.83M12.5 3.5c-3.44.002-5.21.053-6.328 1.171C5 5.843 5 7.73 5 11.5v1c0 3.771 0 5.657 1.172 6.828C7.29 20.447 9.06 20.498 12.5 20.5"/></svg>
Side by Side

After

Width:  |  Height:  |  Size: 433 B

1
icons/mgc/gift_cute_re.svg Normal file
View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><path fill="#fff" fill-opacity=".01" d="M24 0v24H0V0z"/><path stroke="#10161F" stroke-linejoin="round" stroke-width="2" d="M12 20V7m0 0V6m0 1h-1a3 3 0 0 1-3-3c0-.471 0-.707.146-.854C8.293 3 8.53 3 9 3a3 3 0 0 1 3 3m0 1h1a3 3 0 0 0 3-3c0-.471 0-.707-.146-.854C15.707 3 15.47 3 15 3a3 3 0 0 0-3 3m-7 6h14v1c0 2.809 0 4.213-.674 5.222a4.003 4.003 0 0 1-1.104 1.104C16.213 20 14.81 20 12 20c-2.809 0-4.213 0-5.222-.674a4.002 4.002 0 0 1-1.104-1.104C5 17.213 5 15.81 5 13zm.667 0h12.666c.623 0 .935 0 1.167-.134a1 1 0 0 0 .366-.366c.134-.232.134-.544.134-1.167 0-1.246 0-1.869-.268-2.333A2 2 0 0 0 19 7.268C18.536 7 17.913 7 16.667 7H7.333C6.087 7 5.464 7 5 7.268A2 2 0 0 0 4.268 8C4 8.464 4 9.087 4 10.333c0 .623 0 .935.134 1.167a1 1 0 0 0 .366.366c.232.134.544.134 1.167.134Z"/></svg>
Side by Side

After

Width:  |  Height:  |  Size: 856 B

1
icons/mgc/user_3_cute_re.svg Normal file
View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><path fill="#fff" fill-opacity=".01" d="M24 0v24H0V0z"/><path stroke="#10161F" stroke-width="2" d="M20 18.5c0 1.933-3.582 2.5-8 2.5s-8-.567-8-2.5S7.582 14 12 14s8 2.567 8 4.5ZM16 7a4 4 0 1 1-8 0 4 4 0 0 1 8 0Z"/></svg>
Side by Side

After

Width:  |  Height:  |  Size: 293 B

31
src/renderer/src/components/user-button.tsx
View File

@ -12,6 +12,7 @@ import { cn } from "@renderer/lib/utils"
import { LoginModalContent } from "@renderer/modules/auth/LoginModalContent"
import { useSettingModal } from "@renderer/modules/settings/modal/hooks"
import { useSession } from "@renderer/queries/auth"
import { WEB_URL } from "@shared/constants"
import type { FC } from "react"
import { memo } from "react"
import { Link } from "react-router-dom"
@ -82,13 +83,24 @@ export const ProfileButton: FC<LoginProps> = memo((props) => {
Account
</DropdownMenuLabel>
<DropdownMenuLabel>
<div className="-mt-2 flex items-center justify-between">
<span className="">{user?.name}</span>
<UserAvatar className="h-5 shrink-0 p-0" hideName />
<div className="-mt-1 flex items-center gap-2">
<UserAvatar className="h-7 shrink-0 p-0" hideName />
<div className="max-w-40 leading-none">
<div className="truncate">{user?.name}</div>
<div className="truncate text-xs font-medium text-zinc-500">{user?.handle}</div>
</div>
</div>
</DropdownMenuLabel>
<DropdownMenuSeparator />
<DropdownMenuItem
onClick={() => {
window.open(`${WEB_URL}/profile/${user?.handle}`, "_blank")
}}
>
<i className="i-mgc-user-3-cute-re mr-1.5" />
Profile
</DropdownMenuItem>
<DropdownMenuSeparator />
<DropdownMenuItem
onClick={() => {
// Here we need to delay one frame, so it's two raf,
@ -97,14 +109,15 @@ export const ProfileButton: FC<LoginProps> = memo((props) => {
nextFrame(() => settingModalPresent("wallet"))
}}
>
<i className="i-mgc-power-outline mr-1.5" />
Power
</DropdownMenuItem>
<DropdownMenuSeparator />
<DropdownMenuItem
onClick={() => {
nextFrame(settingModalPresent)
}}
>
<i className="i-mgc-settings-7-cute-re mr-1.5" />
Preferences
</DropdownMenuItem>
<DropdownMenuSeparator />
@ -112,15 +125,19 @@ export const ProfileButton: FC<LoginProps> = memo((props) => {
<>
<DropdownMenuItem
onClick={() => {
// TODO
// TODO
}}
>
<i className="i-mgc-gift-cute-re mr-1.5" />
Download Desktop app
</DropdownMenuItem>
<DropdownMenuSeparator />
</>
)}
<DropdownMenuItem onClick={signOut}>Log out</DropdownMenuItem>
<DropdownMenuItem onClick={signOut}>
<i className="i-mgc-exit-cute-re mr-1.5" />
Log out
</DropdownMenuItem>
</DropdownMenuContent>
</DropdownMenu>
)