Upload 5 files

chat-engine.jsx

@@ -36,18 +36,22 @@ const FALLBACKS = [
 
 const INTENTS = [
   {
+    label: "greeting",
     patterns: [/\b(hi|hello|hey)\b/i, /good (morning|afternoon|evening)/i],
     response: "Hi! I'm Fetch Pup. Ask me something about dogs, or try the suggestions below.",
   },
   {
+    label: "small talk",
     patterns: [/how are you/i, /how('s| is) it going/i, /what'?s up/i],
     response: "Tail's wagging, thanks for asking! Got a dog question for me?",
   },
   {
+    label: "capability",
     patterns: [/what can you do/i, /what do you (know|do)/i, /\bhelp\b/i],
     response: "I know a bunch of dog facts. Ask a question or try the suggestions — I'll do my best.",
   },
   {
+    label: "identity",
     patterns: [/who are you/i, /what are you/i],
     response: "I'm Fetch Pup — a static chatbot demo. No model running, just intent matching and keyword lookup. But I know my dogs!",
   },
@@ -56,7 +60,7 @@ const INTENTS = [
 function matchIntent(query) {
   const q = query || "";
   for (const intent of INTENTS) {
-    if (intent.patterns.some(p => p.test(q))) return intent.response;
+    if (intent.patterns.some(p => p.test(q))) return intent;
   }
   return null;
 }
@@ -121,7 +125,7 @@ function buildPrompt(history, userInput, fact, personality) {
 
 async function generateReply({ userInput, history, backend, personality }) {
   const intent = matchIntent(userInput);
-  if (intent) return { text: intent, fact: null };
+  if (intent) return { text: intent.response, fact: null, source: "intent", label: intent.label };
 
   const fact = retrieveFact(userInput);
 
@@ -131,9 +135,9 @@ async function generateReply({ userInput, history, backend, personality }) {
       const raw = await window.claude.complete(prompt);
       const text = (raw || "").trim().replace(/^Bot:\s*/i, "").split("\nUser:")[0].trim();
       if (!text || text.split(/\s+/).length <= 2) {
-        return { text: pickFallback(), fact };
+        return { text: pickFallback(), fact, source: "fallback" };
       }
-      return { text, fact };
+      return { text, fact, source: "model" };
     } catch (err) {
       console.warn("Fetch: claude backend failed, falling back.", err);
       // fall through to local path
@@ -141,8 +145,8 @@ async function generateReply({ userInput, history, backend, personality }) {
   }
 
   // Local / offline / HF-static path: keyword fact wins, else fallback.
-  if (fact) return { text: fact.fact, fact };
-  return { text: pickFallback(), fact };
+  if (fact) return { text: fact.fact, fact, source: "fact" };
+  return { text: pickFallback(), fact: null, source: "fallback" };
 }
 
 // Hook: owns conversation state + send/clear + rotating suggestions.
@@ -171,12 +175,14 @@ function useFetchChat({ backend = "claude", personality = "subtle" } = {}) {
     setPending(true);
 
     const t0 = performance.now();
-    const { text, fact } = await generateReply({
-      userInput,
-      history: priorHistory,
-      backend,
-      personality,
-    });
+    let result;
+    try {
+      result = await generateReply({ userInput, history: priorHistory, backend, personality });
+    } catch (err) {
+      console.error("Fetch: generateReply failed.", err);
+      result = { text: "Something went wrong. Please try again.", fact: null, source: "error" };
+    }
+    const { text, fact, source, label } = result;
     const ms = Math.round(performance.now() - t0);
 
     setMessages(prev => prev.map(m =>
@@ -185,7 +191,7 @@ function useFetchChat({ backend = "claude", personality = "subtle" } = {}) {
         : m
     ));
     setDebug(prev => [
-      { t: Date.now(), user: userInput, reply: text, fact, ms, backend },
+      { t: Date.now(), user: userInput, reply: text, fact, source, label, ms, backend },
       ...prev,
     ].slice(0, 20));
     setPending(false);
@@ -228,4 +234,5 @@ Object.assign(window, {
   retrieveFact,
   FETCH_KNOWLEDGE_BASE: KNOWLEDGE_BASE,
   FETCH_SUGGESTIONS: SUGGESTIONS,
+  FETCH_INTENTS: INTENTS,
 });

debug-panel.jsx

@@ -41,6 +41,7 @@ function DebugPanel({ debug, onClose, palette, font }) {
       }}>
         {[
           { id: "turns", label: "turns" },
+          { id: "intents", label: "intents" },
           { id: "keywords", label: "keywords" },
           { id: "about", label: "about" },
         ].map(t => (
@@ -57,6 +58,7 @@ function DebugPanel({ debug, onClose, palette, font }) {
 
       <div style={{ flex: 1, overflowY: "auto", padding: 12 }}>
         {tab === "turns" && <DebugLog debug={debug} palette={palette} />}
+        {tab === "intents" && <DebugIntents palette={palette} />}
         {tab === "keywords" && <DebugKB palette={palette} />}
         {tab === "about" && <DebugAbout palette={palette} />}
       </div>
@@ -92,8 +94,17 @@ function DebugLog({ debug, palette }) {
             <span style={{ color: palette.accent }}>reply&gt; </span>
             {d.reply}
           </div>
-          <div style={{ color: palette.dim, fontSize: 10 }}>
-            fact: {d.fact ? <span style={{ color: palette.accent }}>matched "{d.fact.keyword}"</span> : "none"}
+          <div style={{ color: palette.dim, fontSize: 11 }}>
+            {"source: "}
+            <span style={{
+              color: d.source === "error" ? "#ff6b6b"
+                   : d.source === "fallback" ? palette.dim
+                   : palette.accent,
+            }}>
+              {d.source === "fact"   ? `fact · ${d.fact?.keyword}`
+             : d.source === "intent" ? `intent · ${d.label}`
+             : d.source || "unknown"}
+            </span>
           </div>
         </div>
       ))}
@@ -121,6 +132,26 @@ function DebugKB({ palette }) {
   );
 }
 
+function DebugIntents({ palette }) {
+  return (
+    <div style={{ display: "flex", flexDirection: "column", gap: 8 }}>
+      <div style={{ color: palette.dim, marginBottom: 4 }}>
+        {FETCH_INTENTS.length} intents · first match wins
+      </div>
+      {FETCH_INTENTS.map(intent => (
+        <div key={intent.label} style={{
+          border: `1px solid ${palette.muted}`,
+          borderRadius: 6,
+          padding: 8,
+        }}>
+          <div style={{ color: palette.accent, marginBottom: 3 }}>{intent.label}</div>
+          <div style={{ color: palette.fg, lineHeight: 1.4 }}>{intent.response}</div>
+        </div>
+      ))}
+    </div>
+  );
+}
+
 function DebugAbout({ palette }) {
   return (
     <div style={{ lineHeight: 1.6, color: palette.fg, display: "flex", flexDirection: "column", gap: 10 }}>