import { BadgePercent, ChevronDown, CopyPlus, Globe, Pencil, ScanEye, SwatchBook, } from 'lucide-react'; import { cn } from '@/lib/utils'; import { Popover, Switch, Transition } from '@headlessui/react'; import { SiReddit, SiYoutube } from '@icons-pack/react-simple-icons'; import { Fragment } from 'react'; export const Attach = () => { return ( ); }; const focusModes = [ { key: 'webSearch', title: 'All', description: 'Searches across all of the internet', icon: , }, { key: 'academicSearch', title: 'Academic', description: 'Search in published academic papers', icon: , }, { key: 'writingAssistant', title: 'Writing', description: 'Chat without searching the web', icon: , }, { key: 'wolframAlphaSearch', title: 'Wolfram Alpha', description: 'Computational knowledge engine', icon: , }, { key: 'youtubeSearch', title: 'Youtube', description: 'Search and watch videos', icon: ( ), }, { key: 'redditSearch', title: 'Reddit', description: 'Search for discussions and opinions', icon: ( ), }, ]; export const Focus = ({ focusMode, setFocusMode, }: { focusMode: string; setFocusMode: (mode: string) => void; }) => { return ( {focusMode !== 'webSearch' ? (
{focusModes.find((mode) => mode.key === focusMode)?.icon}

{focusModes.find((mode) => mode.key === focusMode)?.title}

) : ( )}
{focusModes.map((mode, i) => ( 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', focusMode === mode.key ? 'bg-[#111111]' : 'hover:bg-[#111111]', )} >
{mode.icon}

{mode.title}

{mode.description}

))}
); }; export const CopilotToggle = ({ copilotEnabled, setCopilotEnabled, }: { copilotEnabled: boolean; setCopilotEnabled: (enabled: boolean) => void; }) => { return (
Copilot

setCopilotEnabled(!copilotEnabled)} className={cn( 'text-xs font-medium transition-colors duration-150 ease-in-out', copilotEnabled ? 'text-[#24A0ED]' : 'text-white/50 group-hover:text-white', )} > Copilot

); };