Update app.py

app.py

@@ -7,7 +7,6 @@ from faster_whisper import WhisperModel
 from gtts import gTTS
 
 # --- CONFIG ---
-# Gunakan deepseek-r1:1.5b di Hugging Face agar tidak berat/lag
 MODEL_STRATEGY = {
     "deepseek": [
         {"provider": "ollama", "model": "deepseek-r1:1.5b"},
@@ -23,10 +22,9 @@ QUEUE = asyncio.Queue()
 CACHE_DIR = "./models_cache"
 os.makedirs(CACHE_DIR, exist_ok=True)
 
-# Load Whisper
-whisper_model = WhisperModel("tiny", device="cpu", compute_type="int8", download_root=CACHE_DIR)
+# UPGRADE: Menggunakan model 'base' untuk akurasi lebih tinggi
+whisper_model = WhisperModel("base", device="cpu", compute_type="int8", download_root=CACHE_DIR)
 
-# --- UTILS ---
 def remove_file(path: str):
     if os.path.exists(path):
         os.remove(path)
@@ -37,8 +35,10 @@ async def call_ollama(messages, model):
         async with httpx.AsyncClient(timeout=TIMEOUT) as client:
             res = await client.post("http://127.0.0.1:11434/api/chat", 
                                     json={"model": model, "messages": messages, "stream": False})
-            return res.json()["message"]["content"] if res.status_code == 200 else None
-    except: return None
+            if res.status_code == 200:
+                return res.json()["message"]["content"]
+    except: pass
+    return None
 
 async def call_openrouter(messages, model):
     keys = os.getenv("OPENROUTER_KEYS", "").split(",")
@@ -78,33 +78,160 @@ async def lifespan(app: FastAPI):
     for w in workers: w.cancel()
 
 app = FastAPI(title="AI Gateway", lifespan=lifespan)
-app.add_middleware(
-    CORSMiddleware, 
-    allow_origins=["*"], 
-    allow_methods=["*"], 
-    allow_headers=["*"],
-    allow_credentials=True
-)
-
-# --- ENDPOINTS ---
+app.add_middleware(CORSMiddleware, allow_origins=["*"], allow_methods=["*"], allow_headers=["*"], allow_credentials=True)
 
+# --- STARTUP UI PLAYGROUND (Premium Look) ---
 @app.get("/", response_class=HTMLResponse)
 async def home():
     return """
-    <body style="background:#0f172a; color:white; font-family:sans-serif; display:flex; flex-direction:column; align-items:center; justify-content:center; height:100vh;">
-        <h1 style="color:#38bdf8">AI Gateway Running</h1>
-        <p style="color:#94a3b8">Status: <span style="color:#4ade80">Online</span></p>
+    <!DOCTYPE html>
+    <html lang="id">
+    <head>
+        <meta charset="UTF-8">
+        <meta name="viewport" content="width=device-width, initial-scale=1.0">
+        <title>Imbecome AI Infrastructure</title>
+        <script src="https://cdn.tailwindcss.com"></script>
+        <link href="https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;600;800&display=swap" rel="stylesheet">
+        <style>
+            body { 
+                background-color: #020617; 
+                color: #f8fafc; 
+                font-family: 'Plus Jakarta Sans', sans-serif;
+                background-image: radial-gradient(circle at 50% 0%, #1e1b4b 0%, #020617 70%);
+            }
+            .glass {
+                background: rgba(30, 41, 59, 0.5);
+                backdrop-filter: blur(12px);
+                border: 1px solid rgba(255, 255, 255, 0.1);
+            }
+            .neon-border:focus {
+                border-color: #38bdf8;
+                box-shadow: 0 0 15px rgba(56, 189, 248, 0.3);
+            }
+            .btn-gradient {
+                background: linear-gradient(135deg, #38bdf8 0%, #818cf8 100%);
+                transition: all 0.2s;
+            }
+            .btn-gradient:hover { transform: translateY(-2px); filter: brightness(1.1); }
+            .status-dot { width: 8px; height: 8px; background: #4ade80; border-radius: 50%; box-shadow: 0 0 10px #4ade80; }
+        </style>
+    </head>
+    <body class="min-h-screen p-6">
+        <div class="max-w-6xl mx-auto">
+            <nav class="flex justify-between items-center mb-12 glass p-4 rounded-2xl">
+                <div class="flex items-center gap-2">
+                    <div class="bg-sky-500 w-8 h-8 rounded-lg flex items-center justify-center font-bold">I</div>
+                    <span class="text-xl font-extrabold tracking-tight">IMBECOME <span class="text-sky-400">AI</span></span>
+                </div>
+                <div class="flex items-center gap-4 text-sm text-slate-400">
+                    <div class="status-dot"></div> Gateway Online
+                </div>
+            </nav>
+
+            <div class="grid grid-cols-1 lg:grid-cols-3 gap-8">
+                <!-- Chat Completion Card -->
+                <div class="lg:col-span-2 glass rounded-3xl p-8 flex flex-col">
+                    <div class="flex justify-between items-center mb-6">
+                        <h3 class="text-xl font-bold flex items-center gap-2">Smart AI Chat</h3>
+                        <select id="chatModel" class="bg-slate-900 border border-slate-700 text-sm rounded-xl px-3 py-1 outline-none neon-border">
+                            <option value="deepseek">DeepSeek R1</option>
+                            <option value="gpt">GPT-4o Mini</option>
+                            <option value="gemini">Gemini 2.0</option>
+                        </select>
+                    </div>
+                    <div id="chatBox" class="bg-slate-900/50 border border-slate-800 rounded-2xl p-4 mb-4 overflow-y-auto h-[350px] text-sm space-y-4"></div>
+                    <div class="relative">
+                        <input id="chatInput" type="text" placeholder="Tanya sesuatu..." class="w-full bg-slate-900 border border-slate-700 rounded-2xl px-5 py-4 pr-16 outline-none neon-border">
+                        <button onclick="testChat()" id="btnChat" class="absolute right-2 top-2 bottom-2 bg-sky-500 px-4 rounded-xl font-bold btn-gradient">Kirim</button>
+                    </div>
+                </div>
+
+                <div class="space-y-8">
+                    <!-- TTS Card -->
+                    <div class="glass rounded-3xl p-6">
+                        <h3 class="text-lg font-bold mb-4">Voice Engine (TTS)</h3>
+                        <textarea id="ttsInput" rows="2" class="w-full bg-slate-900 border border-slate-700 rounded-xl p-3 text-sm outline-none mb-3" placeholder="Teks ke suara..."></textarea>
+                        <button onclick="testTTS()" id="btnTTS" class="w-full bg-emerald-500 py-3 rounded-xl font-bold btn-gradient">Generate Suara</button>
+                        <div id="ttsPlayer" class="hidden mt-4">
+                            <audio id="audioElement" controls class="w-full h-8"></audio>
+                        </div>
+                    </div>
+
+                    <!-- Whisper Card -->
+                    <div class="glass rounded-3xl p-6">
+                        <h3 class="text-lg font-bold mb-4">Whisper AI (STT)</h3>
+                        <input type="file" id="whisperFile" class="text-xs text-slate-400 mb-4 w-full">
+                        <button onclick="testWhisper()" id="btnWhisper" class="w-full bg-purple-600 py-3 rounded-xl font-bold btn-gradient">Transkripsi (Model Base)</button>
+                        <div id="whisperResult" class="hidden mt-4 p-3 bg-slate-900 rounded-xl border border-slate-800 text-xs text-slate-300 max-h-32 overflow-y-auto"></div>
+                    </div>
+                </div>
+            </div>
+        </div>
+
+        <script>
+            async function testChat() {
+                const input = document.getElementById('chatInput');
+                const box = document.getElementById('chatBox');
+                if(!input.value) return;
+                
+                const userDiv = document.createElement('div');
+                userDiv.className = 'ml-auto bg-sky-500/20 p-3 rounded-2xl max-w-[80%] text-right border border-sky-500/30';
+                userDiv.innerText = input.value;
+                box.appendChild(userDiv);
+                
+                const text = input.value;
+                input.value = '';
+                
+                const res = await fetch('/v1/chat/completions', {
+                    method: 'POST',
+                    headers: {'Content-Type': 'application/json'},
+                    body: JSON.stringify({ model: document.getElementById('chatModel').value, messages: [{role: 'user', content: text}] })
+                });
+                const data = await res.json();
+                
+                const botDiv = document.createElement('div');
+                botDiv.className = 'mr-auto bg-slate-800 p-3 rounded-2xl max-w-[80%] border border-slate-700';
+                botDiv.innerText = data.choices[0].message.content;
+                box.appendChild(botDiv);
+                box.scrollTop = box.scrollHeight;
+            }
+
+            async function testTTS() {
+                const res = await fetch('/v1/audio/speech', {
+                    method: 'POST',
+                    headers: {'Content-Type': 'application/json'},
+                    body: JSON.stringify({ input: document.getElementById('ttsInput').value, voice: 'id' })
+                });
+                const blob = await res.blob();
+                document.getElementById('audioElement').src = URL.createObjectURL(blob);
+                document.getElementById('ttsPlayer').classList.remove('hidden');
+            }
+
+            async function testWhisper() {
+                const file = document.getElementById('whisperFile').files[0];
+                if(!file) return;
+                document.getElementById('whisperResult').classList.remove('hidden');
+                document.getElementById('whisperResult').innerText = "Sedang memproses (Model Base)...";
+                
+                const fd = new FormData();
+                fd.append('file', file);
+                const res = await fetch('/v1/audio/transcriptions', { method: 'POST', body: fd });
+                const data = await res.json();
+                document.getElementById('whisperResult').innerText = data.text || "Gagal transkripsi.";
+            }
+        </script>
     </body>
+    </html>
     """
 
+# --- API ENDPOINTS ---
+
 @app.get("/v1/models")
 async def list_models():
     return {
         "object": "list",
         "data": [
             {"id": "deepseek", "object": "model", "owned_by": "ollama"},
-            {"id": "gpt", "object": "model", "owned_by": "openrouter"},
-            {"id": "gemini", "object": "model", "owned_by": "openrouter"},
             {"id": "whisper-1", "object": "model", "owned_by": "openai-style"},
             {"id": "tts-1", "object": "model", "owned_by": "openai-style"}   
         ]
@@ -114,17 +241,9 @@ async def list_models():
 async def chat(request: Request):
     body = await request.json()
     model_input = body.get("model", "deepseek")
-    
-    alias = "deepseek"
-    if "gpt" in model_input.lower(): alias = "gpt"
-    elif "gemini" in model_input.lower(): alias = "gemini"
-
     future = asyncio.get_event_loop().create_future()
-    await QUEUE.put((body.get("messages", []), alias, future))
+    await QUEUE.put((body.get("messages", []), "deepseek", future))
     result = await future
-    
-    if not result: return JSONResponse({"error": "Failed to get response"}, status_code=500)
-    
     return {
         "id": f"chatcmpl-{uuid.uuid4()}",
         "object": "chat.completion",
@@ -133,44 +252,29 @@ async def chat(request: Request):
         "choices": [{"message": {"role": "assistant", "content": result}, "finish_reason": "stop"}]
     }
 
-# --- AUDIO ENDPOINTS (WHISPER-1) ---
 @app.post("/v1/audio/transcriptions")
 async def transcribe(background_tasks: BackgroundTasks, file: UploadFile = File(...)):
-    # Buat file sementara
     tmp_path = os.path.join(tempfile.gettempdir(), f"{uuid.uuid4()}_{file.filename}")
-    
     with open(tmp_path, "wb") as buffer:
         shutil.copyfileobj(file.file, buffer)
-        
     try:
-        segments, _ = whisper_model.transcribe(tmp_path)
+        # PERBAIKAN: Gunakan beam_size=5 dan vad_filter=True untuk hasil akurat
+        segments, _ = whisper_model.transcribe(tmp_path, beam_size=5, language="id", vad_filter=True)
         text = " ".join([s.text for s in segments])
-        
-        # Hapus file setelah diproses
         background_tasks.add_task(remove_file, tmp_path)
-        
         return {"text": text.strip()}
     except Exception as e:
         remove_file(tmp_path)
         return JSONResponse({"error": str(e)}, status_code=500)
 
-# --- AUDIO ENDPOINTS (TTS-1) ---
 @app.post("/v1/audio/speech")
 async def tts(request: Request, background_tasks: BackgroundTasks):
     body = await request.json()
-    text = body.get("input", "")
-    
-    lang = "id" 
-    voice_input = body.get("voice", "id").lower()
-    if "en" in voice_input: lang = "en"
-
+    text, lang = body.get("input", ""), body.get("voice", "id")
     tmp_path = os.path.join(tempfile.gettempdir(), f"{uuid.uuid4()}.mp3")
-    
     try:
-        tts_engine = gTTS(text=text, lang=lang)
-        tts_engine.save(tmp_path)
+        gTTS(text=text, lang=lang).save(tmp_path)
         background_tasks.add_task(remove_file, tmp_path)
-
         return FileResponse(tmp_path, media_type="audio/mpeg", filename="speech.mp3")
     except Exception as e:
         return JSONResponse({"error": str(e)}, status_code=500)