Add manual log refresh and clear log buttons; ensured level filtering works

backend/main.py

@@ -215,6 +215,12 @@ def get_logs(limit: int = Query(200, le=500), level: Optional[str] = None):
     """Get structured logs with optional level filter."""
     return memory_handler.get_logs(limit=limit, level=level)
 
+@app.post("/clear-logs", dependencies=[Depends(verify_token)])
+def clear_logs():
+    """Clear all in-memory logs."""
+    memory_handler.clear_logs()
+    return {"success": True, "message": "Log berhasil dihapus."}
+
 # ── Komoditas ─────────────────────────────────────────────────────────────────
 @app.get("/komoditas", dependencies=[Depends(verify_token)])
 def list_komoditas():

frontend/app/dashboard/forecast/page.tsx

@@ -124,6 +124,14 @@ export default function ForecastPage() {
     } catch (e: any) { alert(`❌ ${e.message}`) }
   }
 
+  async function handleClearLogs() {
+    if (!confirm('Hapus semua log di server?')) return
+    try {
+      await api.clearLogs()
+      setLogs([])
+    } catch (e: any) { alert(`❌ ${e.message}`) }
+  }
+
   const anyRunning = status?.any_forecast_running || runAllLoading || Object.keys(runningIds).length > 0
 
   return (
@@ -300,14 +308,26 @@ export default function ForecastPage() {
 
       {/* RIGHT: Terminal Logs */}
       <div className="glass-panel rounded-2xl p-6 border border-white/5 flex flex-col h-[500px] lg:h-[calc(100vh-180px)] lg:sticky lg:top-24">
-        <div className="flex items-center justify-between pb-4 mb-4 border-b border-white/5">
-          <h2 className="text-sm font-bold text-slate-100 flex items-center gap-2">
-            <Terminal className="w-4 h-4 text-indigo-400" /> Log Real-time
-          </h2>
+        <div className="flex flex-col gap-3 pb-4 mb-4 border-b border-white/5">
+          <div className="flex items-center justify-between">
+            <h2 className="text-sm font-bold text-slate-100 flex items-center gap-2">
+              <Terminal className="w-4 h-4 text-indigo-400" /> Log Real-time
+            </h2>
+            <div className="flex gap-1.5">
+              <button onClick={() => fetchData()} title="Refresh Log"
+                className="p-1.5 bg-slate-800 hover:bg-slate-700 text-slate-300 rounded-lg transition">
+                <RefreshCw className="w-3.5 h-3.5" />
+              </button>
+              <button onClick={handleClearLogs} title="Hapus Semua Log"
+                className="p-1.5 bg-rose-500/10 hover:bg-rose-500/20 text-rose-400 rounded-lg transition border border-rose-500/10">
+                <Trash2 className="w-3.5 h-3.5" />
+              </button>
+            </div>
+          </div>
           <div className="flex bg-slate-900/80 rounded-lg p-0.5 border border-white/5">
             {['ALL', 'INFO', 'WARNING', 'ERROR'].map(lvl => (
               <button key={lvl} onClick={() => setLogLevelFilter(lvl)}
-                className={`px-2 py-1 rounded-md text-[10px] font-bold transition ${logLevelFilter === lvl ? 'bg-slate-700 text-white' : 'text-slate-500 hover:text-slate-300'}`}>
+                className={`flex-1 px-2 py-1.5 rounded-md text-[10px] font-bold transition ${logLevelFilter === lvl ? 'bg-slate-700 text-white' : 'text-slate-500 hover:text-slate-300'}`}>
                 {lvl}
               </button>
             ))}

frontend/lib/api.ts

@@ -38,6 +38,7 @@ export const api = {
   // Status & Logs (realtime)
   getStatus: () => req('/status'),
   getLogs: (limit = 200, level?: string) => req(`/logs?limit=${limit}${level && level !== 'ALL' ? `&level=${level}` : ''}`),
+  clearLogs: () => req('/clear-logs', { method: 'POST' }),
 
   // Scheduler (multiple schedules)
   getSchedules: () => req('/schedules'),