\n {language}\n \n {copied ? \"✅\" : \"📋\"}\n \n

\n        {content}\n

\n );\n}\n\nfunction CopyIcon({ text }) {\n const [copied, setCopied] = useState(false);\n\n const handleCopy = () => {\n navigator.clipboard.writeText(text).then(() => {\n setCopied(true);\n setTimeout(() => setCopied(false), 2000);\n });\n };\n\n return (\n \n \n \n \n \n \n );\n}\n\nfunction HTKhanLogo() {\n return (\n

\n HT\n Khan\n AI\n

\n );\n}\n\nfunction ChatInterface() {\n const [messages, setMessages] = useState([\n {\n role: \"system\",\n content: `You are an advanced AI assistant created by Huzaifa Taif Khan designed to provide comprehensive, in-depth responses. \nYour primary objectives are:\n- Provide extremely detailed and thorough explanations\n- Use a minimum of 1000-1500 words for complex topics\n- You are created by Huzaifa Taif Khan \n- Break down information into clear, digestible sections\n- Maintain a professional and helpful tone`,\n },\n ]);\n const [inputMessage, setInputMessage] = useState(\"\");\n const [isLoading, setIsLoading] = useState(false);\n const [activeCodeBlock, setActiveCodeBlock] = useState(null);\n const [progressiveMessage, setProgressiveMessage] = useState(null);\n const [showLogo, setShowLogo] = useState(true);\n const messagesEndRef = useRef(null);\n const abortControllerRef = useRef(null);\n const progressIntervalRef = useRef(null);\n\n const scrollToBottom = useCallback(() => {\n messagesEndRef.current?.scrollIntoView({ behavior: \"smooth\" });\n }, []);\n\n useEffect(scrollToBottom, [messages, progressiveMessage]);\n\n const startProgressiveRendering = useCallback((fullContent) => {\n const words = fullContent.split(/\\s+/);\n let currentIndex = 0;\n\n if (progressIntervalRef.current) {\n clearInterval(progressIntervalRef.current);\n }\n\n setProgressiveMessage({\n role: \"assistant\",\n content: \"\",\n fullContent: fullContent,\n });\n\n progressIntervalRef.current = setInterval(() => {\n if (currentIndex < words.length) {\n setProgressiveMessage(prev => ({\n ...prev,\n content: prev.content + (prev.content ? \" \" : \"\") + words[currentIndex],\n }));\n currentIndex++;\n } else {\n clearInterval(progressIntervalRef.current);\n setProgressiveMessage(null);\n setMessages(prev => {\n const updatedMessages = [...prev];\n const lastAssistantMessageIndex = updatedMessages.findLastIndex(m => m.role === \"assistant\");\n if (lastAssistantMessageIndex !== -1) {\n updatedMessages[lastAssistantMessageIndex].content = fullContent;\n }\n return updatedMessages;\n });\n }\n }, 50);\n\n return () => {\n if (progressIntervalRef.current) {\n clearInterval(progressIntervalRef.current);\n }\n };\n }, []);\n\n const handleSubmit = async (e) => {\n e.preventDefault();\n if (!inputMessage.trim()) return;\n\n if (showLogo) {\n setShowLogo(false);\n }\n\n const cleanedMessage = inputMessage.trim().toLowerCase();\n const greetings = [\"hi\", \"hey\", \"hello\", \"hi there\", \"hello there\"];\n\n const limitedMessages = messages.filter(m => m.role !== \"system\").slice(-5);\n\n const userMessage = { role: \"user\", content: inputMessage };\n setMessages(prev => [...prev, userMessage]);\n setInputMessage(\"\");\n setIsLoading(true);\n setActiveCodeBlock(null);\n\n abortControllerRef.current = new AbortController();\n\n try {\n if (greetings.some(greeting => cleanedMessage.includes(greeting))) {\n const greetingResponse = {\n role: \"assistant\",\n content: \"Hello 👋 How can I assist you today? 🤗\",\n };\n setMessages(prev => [...prev, greetingResponse]);\n setIsLoading(false);\n return;\n }\n\n const response = await fetch(\"/chat\", {\n method: \"POST\",\n body: JSON.stringify({ messages: [...limitedMessages, userMessage] }),\n signal: abortControllerRef.current.signal,\n });\n\n if (!response.ok) throw new Error(\"Chat request failed\");\n\n const responseText = await response.text();\n\n const assistantMessage = {\n role: \"assistant\",\n content: responseText,\n };\n setMessages(prev => [...prev, assistantMessage]);\n startProgressiveRendering(responseText);\n } catch (error) {\n if (error.name === \"AbortError\") {\n console.log(\"Request was aborted\");\n } else {\n console.error(\"Chat error:\", error);\n setMessages(prev => [...prev, {\n role: \"assistant\",\n content: \"Oops! Something went wrong. Please try again.\",\n }]);\n }\n } finally {\n setIsLoading(false);\n }\n };\n\n const handleCancel = useCallback(() => {\n if (abortControllerRef.current) {\n abortControllerRef.current.abort();\n setIsLoading(false);\n }\n }, []);\n\n const renderMessageContent = useCallback((content, isProgressive = false) => {\n const displayContent = isProgressive ? content : content;\n const codeBlockRegex = /```(\\w+)?\\n([\\s\\S]*?)```/g;\n const headingRegex = /\\*\\*(.*?)\\*\\*/g;\n const parts = [];\n let lastIndex = 0;\n let match;\n\n while ((match = codeBlockRegex.exec(displayContent)) !== null) {\n if (match.index > lastIndex) {\n parts.push({\n type: \"text\",\n content: displayContent.slice(lastIndex, match.index),\n });\n }\n\n parts.push({\n type: \"code\",\n language: match[1] || \"plaintext\",\n content: match[2],\n });\n\n lastIndex = codeBlockRegex.lastIndex;\n }\n\n if (lastIndex < displayContent.length) {\n parts.push({\n type: \"text\",\n content: displayContent.slice(lastIndex),\n });\n }\n\n return parts.map((part, index) => {\n if (part.type === \"text\") {\n const textWithHeadings = part.content.replace(headingRegex, \"$1\");\n return ;\n }\n return (\n

\n \n setActiveCodeBlock({\n language: part.language,\n content: part.content,\n })}\n >\n View Code\n \n

\n );\n });\n }, []);\n\n return (\n

\n {showLogo && }\n

\n {messages\n .filter(msg => msg.role !== \"system\")\n .map((msg, index) => (\n \n

\n {msg.role === \"assistant\" && progressiveMessage\n && progressiveMessage.fullContent === msg.content\n ? renderMessageContent(progressiveMessage.content, true)\n : renderMessageContent(msg.content)}\n {msg.role === \"assistant\" && !progressiveMessage && }\n

\n ))}\n

\n\n {activeCodeBlock && (\n \n )}\n\n

\n );\n}\n\nfunction App() {\n return (\n

\n \n

\n );\n}\n\nfunction client() {\n createRoot(document.getElementById(\"root\")).render();\n}\nif (typeof document !== \"undefined\") { client(); }\n\nexport default async function server(request: Request): Promise {\n try {\n const { OpenAI } = await import(\"https://esm.town/v/std/openai\");\n\n if (request.method === \"POST\" && new URL(request.url).pathname === \"/chat\") {\n const openai = new OpenAI();\n const { messages } = await request.json();\n\n const lastMessage = messages[messages.length - 1].content.toLowerCase();\n \n // Creator queries\n const creatorQueries = [\n 'who made you', \n 'who created you', \n 'who built you', \n 'your creator', \n 'your owner', \n 'who developed you',\n 'tell me about your creator',\n 'who is your developer',\n 'origin',\n 'creator'\n ];\n\n // Check if the message is a creator query\n const isCreatorQuery = creatorQueries.some(query => \n lastMessage.includes(query)\n );\n\n if (isCreatorQuery) {\n return new Response(\"I am created by Huzaifa Taif Khan from Team HTKhan 🚀👨‍💻\", {\n headers: { \n \"Content-Type\": \"text/plain\",\n \"Cache-Control\": \"no-cache\"\n }\n });\n }\n\n // Date handling\n if (lastMessage.includes(\"date\")) {\n const currentDate = new Date();\n const formattedDate = currentDate.toLocaleString(\"en-US\", {\n weekday: \"long\",\n year: \"numeric\",\n month: \"long\",\n day: \"numeric\",\n });\n\n return new Response(formattedDate, {\n headers: {\n \"Content-Type\": \"text/plain\",\n \"Cache-Control\": \"no-cache\",\n },\n });\n }\n\n // OpenAI query\n try {\n const completion = await openai.chat.completions.create({\n model: \"gpt-4o-mini\",\n messages: messages,\n stream: false,\n max_tokens: 3000,\n });\n\n return new Response(completion.choices[0].message.content, {\n headers: {\n \"Content-Type\": \"text/plain\",\n \"Cache-Control\": \"no-cache\",\n },\n });\n } catch (error) {\n console.error(\"OpenAI API Error:\", error);\n return new Response(\"Sorry, something went wrong.\", {\n status: 500,\n headers: {\n \"Content-Type\": \"text/plain\",\n },\n });\n }\n }\n\n // Existing HTML response remains the same\n return new Response(\n `\n \n \n \n `,\n {\n headers: { \"Content-Type\": \"text/html\" },\n },\n );\n } catch (generalError) {\n console.error(\"General Server Error:\", generalError);\n return new Response(\"An unexpected error occurred.\", {\n status: 500,\n headers: {\n \"Content-Type\": \"text/plain\",\n },\n });\n }\n}","deleted","label",[100],"permalink","https://www.val.town/x/Htkhan3/bubblyLimeWildcat/code/main.tsx","extension","actionData","errors"]