prettier

ui/components/MessageInputActions/Attach.tsx

@@ -1,4 +1,4 @@
-import { CopyPlus } from 'lucide-react';
+import { CopyPlus } from "lucide-react";
 
 const Attach = () => {
   return (

ui/components/MessageInputActions/Copilot.tsx

@@ -1,5 +1,5 @@
-import { cn } from '@/lib/utils';
-import { Switch } from '@headlessui/react';
+import { cn } from "@/lib/utils";
+import { Switch } from "@headlessui/react";
 
 const CopilotToggle = ({
   copilotEnabled,
@@ -18,20 +18,18 @@ const CopilotToggle = ({
         <span className="sr-only">Copilot</span>
         <span
           className={cn(
-            copilotEnabled
-              ? 'translate-x-6 bg-[#24A0ED]'
-              : 'translate-x-1 bg-black/50 dark:bg-white/50',
-            'inline-block h-3 w-3 sm:h-4 sm:w-4 transform rounded-full transition-all duration-200',
+            copilotEnabled ? "translate-x-6 bg-[#24A0ED]" : "translate-x-1 bg-black/50 dark:bg-white/50",
+            "inline-block h-3 w-3 sm:h-4 sm:w-4 transform rounded-full transition-all duration-200",
           )}
         />
       </Switch>
       <p
         onClick={() => setCopilotEnabled(!copilotEnabled)}
         className={cn(
-          'text-xs font-medium transition-colors duration-150 ease-in-out',
+          "text-xs font-medium transition-colors duration-150 ease-in-out",
           copilotEnabled
-            ? 'text-[#24A0ED]'
-            : 'text-black/50 dark:text-white/50 group-hover:text-black dark:group-hover:text-white',
+            ? "text-[#24A0ED]"
+            : "text-black/50 dark:text-white/50 group-hover:text-black dark:group-hover:text-white",
         )}
       >
         Copilot

ui/components/MessageInputActions/Focus.tsx

@@ -1,86 +1,63 @@
-import {
-  BadgePercent,
-  ChevronDown,
-  Globe,
-  Pencil,
-  ScanEye,
-  SwatchBook,
-} from 'lucide-react';
-import { cn } from '@/lib/utils';
-import { Popover, Transition } from '@headlessui/react';
-import { SiReddit, SiYoutube } from '@icons-pack/react-simple-icons';
-import { Fragment } from 'react';
+import { BadgePercent, ChevronDown, Globe, Pencil, ScanEye, SwatchBook } from "lucide-react";
+import { cn } from "@/lib/utils";
+import { Popover, Transition } from "@headlessui/react";
+import { SiReddit, SiYoutube } from "@icons-pack/react-simple-icons";
+import { Fragment } from "react";
 
 const focusModes = [
   {
-    key: 'webSearch',
-    title: 'All',
-    description: 'Searches across all of the internet',
+    key: "webSearch",
+    title: "All",
+    description: "Searches across all of the internet",
     icon: <Globe size={20} />,
   },
   {
-    key: 'academicSearch',
-    title: 'Academic',
-    description: 'Search in published academic papers',
+    key: "academicSearch",
+    title: "Academic",
+    description: "Search in published academic papers",
     icon: <SwatchBook size={20} />,
   },
   {
-    key: 'writingAssistant',
-    title: 'Writing',
-    description: 'Chat without searching the web',
+    key: "writingAssistant",
+    title: "Writing",
+    description: "Chat without searching the web",
     icon: <Pencil size={16} />,
   },
   {
-    key: 'wolframAlphaSearch',
-    title: 'Wolfram Alpha',
-    description: 'Computational knowledge engine',
+    key: "wolframAlphaSearch",
+    title: "Wolfram Alpha",
+    description: "Computational knowledge engine",
     icon: <BadgePercent size={20} />,
   },
   {
-    key: 'youtubeSearch',
-    title: 'Youtube',
-    description: 'Search and watch videos',
+    key: "youtubeSearch",
+    title: "Youtube",
+    description: "Search and watch videos",
     icon: (
-      <SiYoutube
-        className="h-5 w-auto mr-0.5"
-        onPointerEnterCapture={undefined}
-        onPointerLeaveCapture={undefined}
-      />
+      <SiYoutube className="h-5 w-auto mr-0.5" onPointerEnterCapture={undefined} onPointerLeaveCapture={undefined} />
     ),
   },
   {
-    key: 'redditSearch',
-    title: 'Reddit',
-    description: 'Search for discussions and opinions',
+    key: "redditSearch",
+    title: "Reddit",
+    description: "Search for discussions and opinions",
     icon: (
-      <SiReddit
-        className="h-5 w-auto mr-0.5"
-        onPointerEnterCapture={undefined}
-        onPointerLeaveCapture={undefined}
-      />
+      <SiReddit className="h-5 w-auto mr-0.5" onPointerEnterCapture={undefined} onPointerLeaveCapture={undefined} />
     ),
   },
 ];
 
-const Focus = ({
-  focusMode,
-  setFocusMode,
-}: {
-  focusMode: string;
-  setFocusMode: (mode: string) => void;
-}) => {
+const Focus = ({ focusMode, setFocusMode }: { focusMode: string; setFocusMode: (mode: string) => void }) => {
   return (
     <Popover className="fixed w-full max-w-[15rem] md:max-w-md lg:max-w-lg">
       <Popover.Button
         type="button"
         className="p-2 text-black/50 dark:text-white/50 rounded-xl hover:bg-light-secondary dark:hover:bg-dark-secondary active:scale-95 transition duration-200 hover:text-black dark:hover:text-white"
       >
-        {focusMode !== 'webSearch' ? (
+        {focusMode !== "webSearch" ? (
           <div className="flex flex-row items-center space-x-1">
-            {focusModes.find((mode) => mode.key === focusMode)?.icon}
-            <p className="text-xs font-medium">
-              {focusModes.find((mode) => mode.key === focusMode)?.title}
-            </p>
+            {focusModes.find(mode => mode.key === focusMode)?.icon}
+            <p className="text-xs font-medium">{focusModes.find(mode => mode.key === focusMode)?.title}</p>
             <ChevronDown size={20} />
           </div>
         ) : (
@@ -103,26 +80,22 @@ const Focus = ({
                 onClick={() => setFocusMode(mode.key)}
                 key={i}
                 className={cn(
-                  'p-2 rounded-lg flex flex-col items-start justify-start text-start space-y-2 duration-200 cursor-pointer transition',
+                  "p-2 rounded-lg flex flex-col items-start justify-start text-start space-y-2 duration-200 cursor-pointer transition",
                   focusMode === mode.key
-                    ? 'bg-light-secondary dark:bg-dark-secondary'
-                    : 'hover:bg-light-secondary dark:hover:bg-dark-secondary',
+                    ? "bg-light-secondary dark:bg-dark-secondary"
+                    : "hover:bg-light-secondary dark:hover:bg-dark-secondary",
                 )}
               >
                 <div
                   className={cn(
-                    'flex flex-row items-center space-x-1',
-                    focusMode === mode.key
-                      ? 'text-[#24A0ED]'
-                      : 'text-black dark:text-white',
+                    "flex flex-row items-center space-x-1",
+                    focusMode === mode.key ? "text-[#24A0ED]" : "text-black dark:text-white",
                   )}
                 >
                   {mode.icon}
                   <p className="text-sm font-medium">{mode.title}</p>
                 </div>
-                <p className="text-black/70 dark:text-white/70 text-xs">
-                  {mode.description}
-                </p>
+                <p className="text-black/70 dark:text-white/70 text-xs">{mode.description}</p>
               </Popover.Button>
             ))}
           </div>