Get rid of custom components folder

2024-11-15 10:14:25 -05:00 · 2024-11-15 10:14:25 -05:00 · 6d16f67280
commit 6d16f67280
parent c493ac342b
38 changed files with 34 additions and 34 deletions
--- a/components/message-actions.tsx
+++ b/components/message-actions.tsx
@ -0,0 +1,166 @@
+import { Message } from 'ai';
+import { toast } from 'sonner';
+import { useSWRConfig } from 'swr';
+import { useCopyToClipboard } from 'usehooks-ts';
+
+import { Vote } from '@/lib/db/schema';
+import { getMessageIdFromAnnotations } from '@/lib/utils';
+
+import { CopyIcon, ThumbDownIcon, ThumbUpIcon } from './icons';
+import { Button } from './ui/button';
+import {
+  Tooltip,
+  TooltipContent,
+  TooltipProvider,
+  TooltipTrigger,
+} from './ui/tooltip';
+
+export function MessageActions({
+  chatId,
+  message,
+  vote,
+  isLoading,
+}: {
+  chatId: string;
+  message: Message;
+  vote: Vote | undefined;
+  isLoading: boolean;
+}) {
+  const { mutate } = useSWRConfig();
+  const [_, copyToClipboard] = useCopyToClipboard();
+
+  if (isLoading) return null;
+  if (message.role === 'user') return null;
+  if (message.toolInvocations && message.toolInvocations.length > 0)
+    return null;
+
+  return (
+    <TooltipProvider delayDuration={0}>
+      <div className="flex flex-row gap-2">
+        <Tooltip>
+          <TooltipTrigger asChild>
+            <Button
+              className="py-1 px-2 h-fit text-muted-foreground"
+              variant="outline"
+              onClick={async () => {
+                await copyToClipboard(message.content as string);
+                toast.success('Copied to clipboard!');
+              }}
+            >
+              <CopyIcon />
+            </Button>
+          </TooltipTrigger>
+          <TooltipContent>Copy</TooltipContent>
+        </Tooltip>
+
+        <Tooltip>
+          <TooltipTrigger asChild>
+            <Button
+              className="py-1 px-2 h-fit text-muted-foreground !pointer-events-auto"
+              disabled={vote && vote.isUpvoted}
+              variant="outline"
+              onClick={async () => {
+                const messageId = getMessageIdFromAnnotations(message);
+
+                const upvote = fetch('/api/vote', {
+                  method: 'PATCH',
+                  body: JSON.stringify({
+                    chatId,
+                    messageId,
+                    type: 'up',
+                  }),
+                });
+
+                toast.promise(upvote, {
+                  loading: 'Upvoting Response...',
+                  success: () => {
+                    mutate<Array<Vote>>(
+                      `/api/vote?chatId=${chatId}`,
+                      (currentVotes) => {
+                        if (!currentVotes) return [];
+
+                        const votesWithoutCurrent = currentVotes.filter(
+                          (vote) => vote.messageId !== message.id
+                        );
+
+                        return [
+                          ...votesWithoutCurrent,
+                          {
+                            chatId,
+                            messageId: message.id,
+                            isUpvoted: true,
+                          },
+                        ];
+                      },
+                      { revalidate: false }
+                    );
+
+                    return 'Upvoted Response!';
+                  },
+                  error: 'Failed to upvote response.',
+                });
+              }}
+            >
+              <ThumbUpIcon />
+            </Button>
+          </TooltipTrigger>
+          <TooltipContent>Upvote Response</TooltipContent>
+        </Tooltip>
+
+        <Tooltip>
+          <TooltipTrigger asChild>
+            <Button
+              className="py-1 px-2 h-fit text-muted-foreground !pointer-events-auto"
+              variant="outline"
+              disabled={vote && !vote.isUpvoted}
+              onClick={async () => {
+                const messageId = getMessageIdFromAnnotations(message);
+
+                const downvote = fetch('/api/vote', {
+                  method: 'PATCH',
+                  body: JSON.stringify({
+                    chatId,
+                    messageId,
+                    type: 'down',
+                  }),
+                });
+
+                toast.promise(downvote, {
+                  loading: 'Downvoting Response...',
+                  success: () => {
+                    mutate<Array<Vote>>(
+                      `/api/vote?chatId=${chatId}`,
+                      (currentVotes) => {
+                        if (!currentVotes) return [];
+
+                        const votesWithoutCurrent = currentVotes.filter(
+                          (vote) => vote.messageId !== message.id
+                        );
+
+                        return [
+                          ...votesWithoutCurrent,
+                          {
+                            chatId,
+                            messageId: message.id,
+                            isUpvoted: false,
+                          },
+                        ];
+                      },
+                      { revalidate: false }
+                    );
+
+                    return 'Downvoted Response!';
+                  },
+                  error: 'Failed to downvote response.',
+                });
+              }}
+            >
+              <ThumbDownIcon />
+            </Button>
+          </TooltipTrigger>
+          <TooltipContent>Downvote Response</TooltipContent>
+        </Tooltip>
+      </div>
+    </TooltipProvider>
+  );
+}