File size: 4,100 Bytes
b8fe090 |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 |
'use client'
import { useEffect, useState } from 'react'
import Image from 'next/image'
import { toast } from 'react-hot-toast'
import { Button } from '@/components/ui/button'
import pkg from '../../package.json'
import {
DropdownMenu,
DropdownMenuContent,
DropdownMenuItem,
DropdownMenuSeparator,
DropdownMenuTrigger
} from '@/components/ui/dropdown-menu'
import { IconCopy, IconExternalLink, IconGitHub } from '@/components/ui/icons'
import SettingIcon from '@/assets/images/settings.svg'
import { useCopyToClipboard } from '@/lib/hooks/use-copy-to-clipboard'
export function UserMenu() {
const [host, setHost] = useState('')
const { isCopied, copyToClipboard } = useCopyToClipboard({ timeout: 2000 })
useEffect(() => {
setHost(location.host)
}, [])
useEffect(() => {
if (isCopied) {
toast.success('复制成功')
}
}, [isCopied])
return (
<div className="flex items-center justify-between">
<DropdownMenu>
<DropdownMenuTrigger asChild>
<Button className="pl-0">
<div className="flex items-center justify-center text-xs font-medium uppercase rounded-full select-none h-7 w-7 shrink-0 bg-muted/50 text-muted-foreground">
<Image alt="settings" src={SettingIcon} width={20} />
</div>
<span className="ml-2">设置</span>
</Button>
</DropdownMenuTrigger>
<DropdownMenuContent sideOffset={8} align="start" className="w-[180px] bg-background">
<DropdownMenuItem
onClick={() =>
location.href='#dialog="settings"'
}
className="cursor-pointer"
>
设置用户
</DropdownMenuItem>
<DropdownMenuSeparator />
<DropdownMenuItem
onClick={() =>
location.href='#dialog="voice"'
}
className="cursor-pointer"
>
语音设置
</DropdownMenuItem>
<DropdownMenuSeparator />
<DropdownMenuItem asChild>
<a
href="https://github.com/weaigc/bingo/"
target="_blank"
rel="noopener noreferrer"
className="inline-flex items-center justify-between w-full gap-2 cursor-pointer"
>
开源地址
<IconGitHub />
<IconExternalLink className="w-3 h-3 ml-auto" />
</a>
</DropdownMenuItem>
<DropdownMenuSeparator />
<DropdownMenuItem asChild>
<a
href="https://huggingface.co/spaces/hf4all/bingo"
target="_blank"
rel="noopener noreferrer"
className="inline-flex items-center justify-between w-full gap-2 cursor-pointer"
>
托管地址
🤗
<IconExternalLink className="w-3 h-3 ml-auto" />
</a>
</DropdownMenuItem>
<DropdownMenuSeparator />
<DropdownMenuItem asChild>
<a
href="https://huggingface.co/login?next=%2Fspaces%2Fhf4all%2Fbingo%3Fduplicate%3Dtrue%26visibility%3Dpublic"
target="_blank"
rel="noopener noreferrer"
className="inline-flex items-center justify-between w-full gap-2 cursor-pointer"
>
复制站点
<IconExternalLink className="w-3 h-3 ml-auto" />
</a>
</DropdownMenuItem>
<DropdownMenuSeparator />
<DropdownMenuItem className="flex-col items-start">
<div className="font-medium">版本信息 {pkg.version}</div>
</DropdownMenuItem>
<DropdownMenuSeparator />
<DropdownMenuItem className="flex-col items-start">
<div className="font-medium">站点域名</div>
<div onClick={() => copyToClipboard(host)} className="flex gap-1 text-xs text-zinc-500 cursor-pointer">
{host} <IconCopy />
</div>
</DropdownMenuItem>
</DropdownMenuContent>
</DropdownMenu>
</div>
)
}
|