diff --git a/src/components/CreatePromptModal.tsx b/src/components/CreatePromptModal.tsx index 338a876..70bd778 100644 --- a/src/components/CreatePromptModal.tsx +++ b/src/components/CreatePromptModal.tsx @@ -1,10 +1,10 @@ import { + ActionIcon, Button, Modal, Stack, Textarea, TextInput, - ThemeIcon, Tooltip, } from "@mantine/core"; import { useDisclosure } from "@mantine/hooks"; @@ -26,6 +26,17 @@ export function CreatePromptModal({ content }: { content?: string }) { return ( <> + {content ? ( + + + + + + ) : ( + + )}
{ @@ -87,17 +98,6 @@ export function CreatePromptModal({ content }: { content?: string }) {
- {content ? ( - - - - - - ) : ( - - )} ); } diff --git a/src/components/MessageItem.tsx b/src/components/MessageItem.tsx index a119f1e..50d5a38 100644 --- a/src/components/MessageItem.tsx +++ b/src/components/MessageItem.tsx @@ -1,5 +1,14 @@ -import { Card, Flex, Text, ThemeIcon } from "@mantine/core"; -import { IconUser } from "@tabler/icons-react"; +import { + ActionIcon, + Box, + Card, + Flex, + Text, + ThemeIcon, + Tooltip, +} from "@mantine/core"; +import { useClipboard } from "@mantine/hooks"; +import { IconCopy, IconUser } from "@tabler/icons-react"; import { Message } from "../db"; import { CreatePromptModal } from "./CreatePromptModal"; import { LogoIcon } from "./Logo"; @@ -7,6 +16,8 @@ import { LogoIcon } from "./Logo"; import { ScrollIntoView } from "./ScrollIntoView"; export function MessageItem({ message }: { message: Message }) { + const clipboard = useClipboard({ timeout: 500 }); + return ( @@ -20,7 +31,17 @@ export function MessageItem({ message }: { message: Message }) { {message.content} - + + + + clipboard.copy(message.content)}> + + + +