\n {/* Sidebar */}\n

Poe-Router

\n \n \n \n

\n \n

\n setSearchTerm(e.target.value)}\n className=\"w-full rounded-lg border border-gray-300 dark:border-gray-600 px-4 py-2 bg-gray-50 dark:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-indigo-500\"\n />\n

\n \n

\n {filteredChats.map(chat => (\n { setActiveChat(chat.id); loadMessages(chat.id); }}\n className={`p-3 cursor-pointer border-l-4 transition-colors hover:bg-gray-100 dark:hover:bg-gray-700 ${\n activeChat === chat.id ? \"bg-gray-100 dark:bg-gray-700 border-indigo-600\" : \"border-transparent\"\n } ${chat.isNotes ? \"border-l-orange-500\" : \"\"}`}\n >\n

\n {chat.name.charAt(0).toUpperCase()}\n

{chat.name}

\n {chat.isNotes && NOTES}\n

{new Date(chat.updatedAt).toLocaleDateString()}

\n { e.stopPropagation(); deleteChat(chat.id); }}\n className=\"p-1 text-gray-400 hover:text-red-500\"\n >\n \n \n

\n ))}\n

\n\n {/* Main Content */}\n

\n {/* Header */}\n

\n \n

\n {currentChat?.name.charAt(0).toUpperCase() || \"?\"}\n

{currentChat?.name || \"Select a chat\"}

\n \n {currentChat?.isNotes ? \"Local Notes\" : `${providers[provider as keyof typeof providers].name} - ${model}`}\n {!currentChat?.isNotes && GROUP CHAT}\n

\n setUsername(e.target.value)}\n placeholder=\"Your name\"\n className=\"rounded-lg border border-gray-300 dark:border-gray-600 px-3 py-1 text-sm bg-gray-50 dark:bg-gray-700 w-32\"\n />\n

\n\n {/* Messages */}\n

\n {messages.map((msg) => (\n

\n {msg.role === \"assistant\" && (\n

\n {msg.username?.charAt(0).toUpperCase() || \"A\"}\n

\n )}\n

\n {msg.username} {msg.provider && msg.provider !== \"local\" && `via ${msg.provider}`}\n

{msg.content}

\n {new Date(msg.timestamp).toLocaleTimeString()}\n

\n {msg.role === \"user\" && (\n

\n {msg.username?.charAt(0).toUpperCase() || \"U\"}\n

\n )}\n

\n ))}\n {loading && (\n

\n )}\n

\n\n {/* Input */}\n

\n { setProvider(e.target.value); setModel(providers[e.target.value as keyof typeof providers].models[0]); }}\n className=\"rounded-lg border border-gray-300 dark:border-gray-600 px-3 py-2 bg-gray-50 dark:bg-gray-700 text-sm\"\n disabled={currentChat?.isNotes}\n >\n {Object.entries(providers).map(([key, p]) => (\n \n ))}\n \n setModel(e.target.value)}\n className=\"rounded-lg border border-gray-300 dark:border-gray-600 px-3 py-2 bg-gray-50 dark:bg-gray-700 text-sm\"\n disabled={currentChat?.isNotes}\n >\n {providers[provider as keyof typeof providers].models.map(m => (\n \n ))}\n \n setInput(e.target.value)}\n onKeyDown={(e) => e.key === \"Enter\" && !e.shiftKey && sendMessage()}\n placeholder=\"Type a message...\"\n className=\"flex-1 rounded-lg border border-gray-300 dark:border-gray-600 px-4 py-2 bg-gray-50 dark:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-indigo-500\"\n disabled={!activeChat}\n />\n \n \n \n

\n\n {/* Settings Modal */}\n {showSettings && (\n

Settings

\n \n

\n Username\n setUsername(e.target.value)}\n className=\"w-full rounded-lg border border-gray-300 dark:border-gray-600 px-4 py-2 bg-gray-50 dark:bg-gray-700\"\n />\n

\n Groq API Key\n setApiKeys(prev => ({ ...prev, groq: e.target.value }))}\n placeholder=\"gsk_...\"\n className=\"w-full rounded-lg border border-gray-300 dark:border-gray-600 px-4 py-2 bg-gray-50 dark:bg-gray-700\"\n />\n

\n OpenRouter API Key\n setApiKeys(prev => ({ ...prev, openrouter: e.target.value }))}\n placeholder=\"sk-or-...\"\n className=\"w-full rounded-lg border border-gray-300 dark:border-gray-600 px-4 py-2 bg-gray-50 dark:bg-gray-700\"\n />\n

\n NVIDIA API Key\n setApiKeys(prev => ({ ...prev, nvidia: e.target.value }))}\n placeholder=\"nvapi-...\"\n className=\"w-full rounded-lg border border-gray-300 dark:border-gray-600 px-4 py-2 bg-gray-50 dark:bg-gray-700\"\n />\n

\n Poe API Key\n setApiKeys(prev => ({ ...prev, poe: e.target.value }))}\n placeholder=\"poe-...\"\n className=\"w-full rounded-lg border border-gray-300 dark:border-gray-600 px-4 py-2 bg-gray-50 dark:bg-gray-700\"\n />\n

API keys are stored locally in your browser and sent directly to the respective APIs.

\n )}\n

\n );\n}\n\n// ============== HTML RENDERER ==============\nfunction renderHTML() {\n return `\n\n\n \n \n Poe-Router - Multi-API Group Chat\n \n \n \n \n\n\n

\n \n\n`;\n}\n\nexport default serverHandler;","deleted","label",[100],"permalink","https://www.val.town/x/aibotcommander/AI-Frontend-01/code/main.ts","extension","actionData","errors"]