57 lines
1.4 KiB
TypeScript
57 lines
1.4 KiB
TypeScript
'use client'
|
|
|
|
import Link from 'next/link'
|
|
import { usePathname } from 'next/navigation'
|
|
|
|
import { type Chat } from '@/lib/types'
|
|
import { cn } from '@/lib/utils'
|
|
import { buttonVariants } from '@/components/ui/button'
|
|
import { IconMessage, IconUsers } from '@/components/ui/icons'
|
|
import {
|
|
Tooltip,
|
|
TooltipContent,
|
|
TooltipTrigger
|
|
} from '@/components/ui/tooltip'
|
|
|
|
interface SidebarItemProps {
|
|
chat: Chat
|
|
children: React.ReactNode
|
|
}
|
|
|
|
export function SidebarItem({ chat, children }: SidebarItemProps) {
|
|
const pathname = usePathname()
|
|
const isActive = pathname === chat.path
|
|
|
|
if (!chat?.id) return null
|
|
|
|
return (
|
|
<>
|
|
<Link
|
|
href={chat.path}
|
|
className={cn(
|
|
buttonVariants({ variant: 'ghost' }),
|
|
'group w-full px-2',
|
|
isActive && 'bg-accent'
|
|
)}
|
|
>
|
|
{chat.sharePath ? (
|
|
<Tooltip>
|
|
<TooltipTrigger>
|
|
<IconUsers className="mr-2" />
|
|
</TooltipTrigger>
|
|
<TooltipContent>This is a shared chat.</TooltipContent>
|
|
</Tooltip>
|
|
) : (
|
|
<IconMessage className="mr-2" />
|
|
)}
|
|
<div
|
|
className="relative max-h-5 flex-1 select-none overflow-hidden text-ellipsis break-all"
|
|
title={chat.title}
|
|
>
|
|
<span className="whitespace-nowrap">{chat.title}</span>
|
|
</div>
|
|
{isActive && children}
|
|
</Link>
|
|
</>
|
|
)
|
|
}
|