Spaces:
Sleeping
Sleeping
'use client'; | |
import { type Message } from 'ai'; | |
import { Button } from '@/components/ui/Button'; | |
import { IconCheck, IconCopy } from '@/components/ui/Icons'; | |
import { useCopyToClipboard } from '@/lib/hooks/useCopyToClipboard'; | |
import { cn } from '@/lib/utils'; | |
import { MessageBase } from '../../lib/types'; | |
interface ChatMessageActionsProps extends React.ComponentProps<'div'> { | |
message: MessageBase; | |
} | |
export function ChatMessageActions({ | |
message, | |
className, | |
...props | |
}: ChatMessageActionsProps) { | |
const { isCopied, copyToClipboard } = useCopyToClipboard({ timeout: 2000 }); | |
const onCopy = () => { | |
if (isCopied) return; | |
copyToClipboard(message.content); | |
}; | |
return ( | |
<div | |
className={cn( | |
'flex items-center justify-end transition-opacity group-hover:opacity-100 md:absolute md:-right-10 md:-top-2 md:opacity-0', | |
className, | |
)} | |
{...props} | |
> | |
<Button variant="ghost" size="icon" onClick={onCopy}> | |
{isCopied ? <IconCheck /> : <IconCopy />} | |
<span className="sr-only">Copy message</span> | |
</Button> | |
</div> | |
); | |
} | |