119 lines
3.3 KiB
TypeScript
119 lines
3.3 KiB
TypeScript
'use client'
|
|
|
|
import * as React from 'react'
|
|
import { useTheme } from 'next-themes'
|
|
|
|
import { Button, buttonVariants } from '@/components/ui/button'
|
|
import {
|
|
IconCog,
|
|
IconGitHub,
|
|
IconTelegram,
|
|
IconTwitter
|
|
} from '@/components/ui/icons'
|
|
import {
|
|
DropdownMenu,
|
|
DropdownMenuTrigger,
|
|
DropdownMenuContent,
|
|
DropdownMenuItem
|
|
} from '@/components/ui/dropdown-menu'
|
|
import { Tooltip, TooltipContent, TooltipTrigger } from './ui/tooltip'
|
|
import Link from 'next/link'
|
|
import { cn } from '@/lib/utils'
|
|
|
|
export function SettingsDropDown() {
|
|
const { setTheme } = useTheme()
|
|
const [_, startTransition] = React.useTransition()
|
|
|
|
return (
|
|
<DropdownMenu>
|
|
<DropdownMenuTrigger asChild>
|
|
<Button variant="ghost" size="icon">
|
|
<>
|
|
<IconCog />
|
|
<span className="sr-only">Toggle theme</span>
|
|
</>
|
|
</Button>
|
|
</DropdownMenuTrigger>
|
|
<DropdownMenuContent className="mr-2" sideOffset={8} align="start">
|
|
<DropdownMenuItem
|
|
onClick={() => {
|
|
startTransition(() => {
|
|
setTheme('light')
|
|
})
|
|
}}
|
|
>
|
|
Light
|
|
</DropdownMenuItem>
|
|
<DropdownMenuItem
|
|
onClick={() => {
|
|
startTransition(() => {
|
|
setTheme('dark')
|
|
})
|
|
}}
|
|
>
|
|
Dark
|
|
</DropdownMenuItem>
|
|
<DropdownMenuItem
|
|
onClick={() => {
|
|
startTransition(() => {
|
|
setTheme('system')
|
|
})
|
|
}}
|
|
>
|
|
System
|
|
</DropdownMenuItem>
|
|
<div className="mx-1 flex flex-row justify-between border-t pt-1">
|
|
<Tooltip>
|
|
<TooltipTrigger asChild>
|
|
<Link
|
|
className={cn(
|
|
buttonVariants({ variant: 'ghost', size: 'icon' })
|
|
)}
|
|
href="https://twitter.com/w3gpt_ai"
|
|
target="_blank"
|
|
rel="nofollow"
|
|
>
|
|
<IconTwitter />
|
|
<span className="sr-only">Twitter</span>
|
|
</Link>
|
|
</TooltipTrigger>
|
|
<TooltipContent>Twitter</TooltipContent>
|
|
</Tooltip>
|
|
<Tooltip>
|
|
<TooltipTrigger asChild>
|
|
<Link
|
|
className={cn(
|
|
buttonVariants({ variant: 'ghost', size: 'icon' })
|
|
)}
|
|
href="https://t.me/+Lt21CyCEO0k0Nzcx"
|
|
target="_blank"
|
|
rel="nofollow"
|
|
>
|
|
<IconTelegram />
|
|
<span className="sr-only">Telegram</span>
|
|
</Link>
|
|
</TooltipTrigger>
|
|
<TooltipContent>Telegram</TooltipContent>
|
|
</Tooltip>
|
|
<Tooltip>
|
|
<TooltipTrigger asChild>
|
|
<Link
|
|
className={cn(
|
|
buttonVariants({ variant: 'ghost', size: 'icon' })
|
|
)}
|
|
href="https://github.com/markeljan/web3gpt"
|
|
target="_blank"
|
|
rel="nofollow"
|
|
>
|
|
<IconGitHub />
|
|
<span className="sr-only">Github</span>
|
|
</Link>
|
|
</TooltipTrigger>
|
|
<TooltipContent>Github</TooltipContent>
|
|
</Tooltip>
|
|
</div>
|
|
</DropdownMenuContent>
|
|
</DropdownMenu>
|
|
)
|
|
}
|