```

services/frontend/src/shared/hooks/useMascotChat.ts

@@ -1,15 +1,12 @@
 import { useCallback, useState } from "react";
 
-/**
- * useMascotChat — Hook untuk handle mascot chatbot responses
- * Dapat di-extend dengan Discord Gateway atau API backend
- */
-
-interface ChatContext {
+export interface ChatContext {
   messageCount: number;
   activeParticipants: number;
   lastActivity: string;
   topicsDiscussed: string[];
+  guildId?: string;
+  channelId?: string;
 }
 
 export function useMascotChat(context?: ChatContext) {
@@ -17,14 +14,25 @@ export function useMascotChat(context?: ChatContext) {
 
   const handleSendMessage = useCallback(
     async (message: string): Promise<string> => {
-      // Simulate API call delay
-      await new Promise((resolve) => setTimeout(resolve, 500));
+      try {
+        const response = await fetch("/api/mascot/chat", {
+          method: "POST",
+          headers: { "Content-Type": "application/json" },
+          body: JSON.stringify({ message, context }),
+        });
 
-      // For now, generate response based on keywords
-      // Later dapat di-replace dengan actual AI backend atau Discord integration
-      return generateIntelligentResponse(message, context);
+        if (!response.ok) {
+          throw new Error(`Mascot backend responded with ${response.status}`);
+        }
+
+        const data = (await response.json()) as { response?: string };
+        return data.response || fallbackResponse(message, context);
+      } catch (error) {
+        console.warn("Mascot backend unavailable, using fallback", error);
+        return fallbackResponse(message, context);
+      }
     },
-    [context]
+    [context],
   );
 
   return {
@@ -34,120 +42,20 @@ export function useMascotChat(context?: ChatContext) {
   };
 }
 
-/**
- * Intelligent response generator
- * Can be extended to call backend API, Discord Gateway, atau AI service
- */
-function generateIntelligentResponse(
-  input: string,
-  context?: ChatContext
-): string {
+function fallbackResponse(input: string, context?: ChatContext): string {
   const lower = input.toLowerCase();
 
-  // Analytics-related questions
-  if (
-    lower.includes("berapa") ||
-    lower.includes("jumlah") ||
-    lower.includes("total")
-  ) {
-    if (lower.includes("pesan")) {
-      return `📊 Ada ${context?.messageCount || 0} pesan dalam conversation. Cukup aktif ya! Mau tahu siapa yang paling banyak chat?`;
-    }
-    if (lower.includes("orang") || lower.includes("partisipan")) {
-      return `👥 Ada ${context?.activeParticipants || 0} orang yang aktif chat. Mereka bekerja sama dengan baik!`;
-    }
+  if (lower.includes("ringkasan") || lower.includes("summary")) {
+    return `Aku rangkum cepat ya ✨ Ada ${context?.messageCount || 0} pesan dari ${context?.activeParticipants || 0} user aktif. Backend belum bisa dihubungi, jadi ini ringkasan lokal sementara.`;
   }
 
-  // Insights-related questions
-  if (
-    lower.includes("insight") ||
-    lower.includes("ringkasan") ||
-    lower.includes("summary")
-  ) {
-    return `📈 Dari yang aku lihat:
-• Activity Level: ${context?.lastActivity || "Tinggi"}
-• Top Topics: ${context?.topicsDiscussed?.join(", ") || "General discussion"}
-• Engagement: Very Good! 🎯`;
+  if (lower.includes("berapa") && lower.includes("pesan")) {
+    return `Ada ${context?.messageCount || 0} pesan di konteks dashboard saat ini 📊`;
   }
 
-  // Recommendations
-  if (lower.includes("saran") || lower.includes("rekomendasi")) {
-    return `💡 Rekomendasi aku:
-1. Tingkatkan engagement dengan more interactive discussions
-2. Dokumentasikan insights untuk future reference
-3. Libatkan semua partisipan dalam decision making
-4. Monitor trends untuk continuous improvement
-
-Bagus banget perkembangannya! 🚀`;
+  if (lower.includes("berapa") && (lower.includes("orang") || lower.includes("user"))) {
+    return `Ada ${context?.activeParticipants || 0} user aktif yang terdeteksi 👥`;
   }
 
-  // Help/Info
-  if (
-    lower.includes("bantuan") ||
-    lower.includes("apa aja") ||
-    lower.includes("bisa")
-  ) {
-    return `🤖 Aku bisa membantu dengan:
-• Analytics & Insights
-• Conversation Summaries
-• Participant Analysis
-• Trend Detection
-• Recommendations
-• General Q&A
-
-Tanya aja yang pengen kamu tahu! 😊`;
-  }
-
-  // Greeting
-  if (
-    lower.includes("halo") ||
-    lower.includes("hi") ||
-    lower.includes("hey") ||
-    lower.includes("pagi")
-  ) {
-    return `Halo! 👋 Apa kabar? Ada yang bisa aku bantu tentang conversation ini?`;
-  }
-
-  // Default intelligent response
-  return `Interessant! "${input}" - itu observation yang valid. Dari analytics, ini berhubungan dengan conversation patterns yang kami track. Ada follow-up question? 🎯`;
+  return `Aku belum bisa menghubungi backend, tapi dari konteks lokal ada ${context?.messageCount || 0} pesan dan ${context?.activeParticipants || 0} user aktif. Coba tanya "ringkasan obrolan" atau "berapa pesan" ya.`;
 }
-
-/**
- * Backend integration hook
- * Uncomment dan modify untuk integrate dengan actual backend/Discord Gateway
- */
-
-/*
-export async function callMascotAIBackend(message: string, context?: ChatContext): Promise<string> {
-  try {
-    const response = await fetch('/api/mascot/chat', {
-      method: 'POST',
-      headers: { 'Content-Type': 'application/json' },
-      body: JSON.stringify({ message, context }),
-    });
-
-    if (!response.ok) throw new Error('Backend error');
-    const data = await response.json();
-    return data.response;
-  } catch (error) {
-    console.error('Error calling mascot backend:', error);
-    return generateIntelligentResponse(message, context);
-  }
-}
-
-export async function callDiscordGateway(message: string, guildId: string): Promise<string> {
-  // Call Discord Gateway untuk mendapat context lebih kaya
-  // Implementasi akan bergantung pada Discord API integration
-  try {
-    const response = await fetch('/api/discord/guild-context', {
-      method: 'POST',
-      body: JSON.stringify({ guildId, query: message }),
-    });
-    const context = await response.json();
-    return generateIntelligentResponse(message, context);
-  } catch (error) {
-    console.error('Error calling Discord Gateway:', error);
-    return generateIntelligentResponse(message);
-  }
-}
-*/