From 6e833b24a66db53325733f2eb3a83020b1679a7b Mon Sep 17 00:00:00 2001 From: "Khoa.vo" Date: Wed, 7 Jan 2026 19:38:27 +0700 Subject: [PATCH] fix: Remove all remaining grok references, delete GrokChat.tsx --- components/CookieExpiredDialog.tsx | 7 +- components/GrokChat.tsx | 264 ----------------------------- 2 files changed, 2 insertions(+), 269 deletions(-) delete mode 100644 components/GrokChat.tsx diff --git a/components/CookieExpiredDialog.tsx b/components/CookieExpiredDialog.tsx index 01d897d..2cb661d 100644 --- a/components/CookieExpiredDialog.tsx +++ b/components/CookieExpiredDialog.tsx @@ -15,13 +15,10 @@ export function CookieExpiredDialog() { if (!showCookieExpired) return null; - const providerName = settings.provider === 'meta' ? 'Meta AI' : - settings.provider === 'grok' ? 'Grok' : - 'Google Whisk'; + const providerName = settings.provider === 'meta' ? 'Meta AI' : 'Google Whisk'; const providerUrl = settings.provider === 'meta' ? 'https://www.meta.ai' : - settings.provider === 'grok' ? 'https://grok.com' : - 'https://labs.google/fx/tools/whisk/project'; + 'https://labs.google/fx/tools/whisk/project'; const handleFixIssues = () => { setShowCookieExpired(false); diff --git a/components/GrokChat.tsx b/components/GrokChat.tsx deleted file mode 100644 index 8a7a33e..0000000 --- a/components/GrokChat.tsx +++ /dev/null @@ -1,264 +0,0 @@ -"use client"; - -import React, { useState, useRef, useEffect } from 'react'; -import { motion, AnimatePresence } from 'framer-motion'; -import { X, Send, Maximize2, Minimize2, Loader2, Bot, Zap, Brain } from 'lucide-react'; -import { cn } from '@/lib/utils'; -import { useStore } from '@/lib/store'; - -interface Message { - role: 'user' | 'assistant'; - content: string; -} - -type AIProvider = 'grok' | 'meta'; - -const aiProviders = [ - { id: 'grok' as AIProvider, name: 'Grok', icon: Zap, color: 'text-purple-400' }, - { id: 'meta' as AIProvider, name: 'Llama 3', icon: Brain, color: 'text-blue-400' }, -]; - -export function GrokChat() { - const [isOpen, setIsOpen] = useState(false); - const [isMinimized, setIsMinimized] = useState(false); - const [messages, setMessages] = useState([]); - const [input, setInput] = useState(''); - const [isLoading, setIsLoading] = useState(false); - const [selectedAI, setSelectedAI] = useState('grok'); - const messagesEndRef = useRef(null); - const inputRef = useRef(null); - - // Auto-scroll to bottom - useEffect(() => { - messagesEndRef.current?.scrollIntoView({ behavior: 'smooth' }); - }, [messages, isOpen]); - - // Focus input when opened - useEffect(() => { - if (isOpen && !isMinimized) { - setTimeout(() => inputRef.current?.focus(), 100); - } - }, [isOpen, isMinimized]); - - const handleSend = async () => { - if (!input.trim() || isLoading) return; - - const userMsg = input.trim(); - setInput(''); - setMessages(prev => [...prev, { role: 'user', content: userMsg }]); - setIsLoading(true); - - try { - const history = messages.slice(-10).map(m => ({ role: m.role, content: m.content })); - const { settings } = useStore.getState(); - - let res: Response; - - if (selectedAI === 'grok') { - // Use Grok via xLmiler backend - const grokApiUrl = settings.grokApiUrl || 'http://localhost:3000'; - const apiKey = settings.grokApiKey; - - res = await fetch('/api/grok-chat', { - method: 'POST', - headers: { 'Content-Type': 'application/json' }, - body: JSON.stringify({ - message: userMsg, - history, - grokApiUrl, - apiKey - }) - }); - } else { - // Use Meta AI (Llama 3) - res = await fetch('/api/meta-chat', { - method: 'POST', - headers: { 'Content-Type': 'application/json' }, - body: JSON.stringify({ - message: userMsg, - history, - metaCookies: settings.metaCookies - }) - }); - } - - const data = await res.json(); - - if (data.error || data.detail) { - const errorMsg = data.error || JSON.stringify(data.detail); - throw new Error(errorMsg); - } - - setMessages(prev => [...prev, { role: 'assistant', content: data.response }]); - - } catch (error: any) { - console.error('Chat Error:', error); - setMessages(prev => [...prev, { - role: 'assistant', - content: `Error: ${error.message || 'Failed to connect.'}` - }]); - } finally { - setIsLoading(false); - } - }; - - const handleKeyDown = (e: React.KeyboardEvent) => { - if (e.key === 'Enter' && !e.shiftKey) { - e.preventDefault(); - handleSend(); - } - }; - - const currentProvider = aiProviders.find(p => p.id === selectedAI)!; - - return ( -
- - {/* Toggle Button */} - {!isOpen && ( - setIsOpen(true)} - className="pointer-events-auto bg-black border border-white/20 text-white p-4 rounded-full shadow-2xl hover:shadow-purple-500/20 hover:border-purple-500/50 transition-all group" - > - - - )} - - {/* Chat Window */} - - {isOpen && ( - - {/* Header */} -
-
- {/* AI Selector */} -
- {aiProviders.map((provider) => ( - - ))} -
-
-
- - -
-
- - {/* Messages Area */} - {!isMinimized && ( - <> -
- {messages.length === 0 && ( -
- -

Ask {currentProvider.name} anything...

-
- )} - {messages.map((msg, idx) => ( -
-
- {msg.content} -
-
- ))} - {isLoading && ( -
-
- - Thinking... -
-
- )} -
-
- - {/* Input Area */} -
-
- setInput(e.target.value)} - onKeyDown={handleKeyDown} - placeholder={`Message ${currentProvider.name}...`} - className={cn( - "flex-1 bg-black/50 border border-white/10 rounded-xl px-4 py-2.5 text-sm text-white focus:outline-none transition-all placeholder:text-white/20", - selectedAI === 'grok' - ? "focus:border-purple-500/50 focus:ring-1 focus:ring-purple-500/20" - : "focus:border-blue-500/50 focus:ring-1 focus:ring-blue-500/20" - )} - disabled={isLoading} - /> - -
-
- - )} - - )} - -
- ); -}