From f467db2ea09ff5fda2f79f1d1f67ee8fdd10cb83 Mon Sep 17 00:00:00 2001
From: Benjamin Admin <benjaminadmin@MacBookPro.fritz.box>
Date: Fri, 6 Mar 2026 09:39:19 +0100
Subject: [PATCH] fix(pitch-deck): Waiting-Indicator in ChatFAB (richtiges
 Komponente)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

ChatInterface.tsx war falsch — der echte Investor Agent laeuft in
ChatFAB.tsx. Animierte Punkte + firstChunk-Logik dort implementiert.
Session-History laeuft bereits korrekt (FAB permanent gemountet).

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
---
 pitch-deck/components/ChatFAB.tsx | 52 ++++++++++++++++++++++++++-----
 1 file changed, 44 insertions(+), 8 deletions(-)

diff --git a/pitch-deck/components/ChatFAB.tsx b/pitch-deck/components/ChatFAB.tsx
index fe65677..4be309c 100644
--- a/pitch-deck/components/ChatFAB.tsx
+++ b/pitch-deck/components/ChatFAB.tsx
@@ -88,6 +88,7 @@ export default function ChatFAB({ lang, currentSlide, currentIndex, visitedSlide
   const [messages, setMessages] = useState<ChatMessage[]>([])
   const [input, setInput] = useState('')
   const [isStreaming, setIsStreaming] = useState(false)
+  const [isWaiting, setIsWaiting] = useState(false)
   const [parsedResponses, setParsedResponses] = useState<Map<number, ParsedMessage>>(new Map())
   const messagesEndRef = useRef<HTMLDivElement>(null)
   const inputRef = useRef<HTMLInputElement>(null)
@@ -126,6 +127,7 @@ export default function ChatFAB({ lang, currentSlide, currentIndex, visitedSlide
     setInput('')
     setMessages(prev => [...prev, { role: 'user', content: message }])
     setIsStreaming(true)
+    setIsWaiting(true)
 
     abortRef.current = new AbortController()
 
@@ -152,24 +154,31 @@ export default function ChatFAB({ lang, currentSlide, currentIndex, visitedSlide
       const reader = res.body!.getReader()
       const decoder = new TextDecoder()
       let content = ''
-
-      setMessages(prev => [...prev, { role: 'assistant', content: '' }])
+      let firstChunk = true
 
       while (true) {
         const { done, value } = await reader.read()
         if (done) break
 
         content += decoder.decode(value, { stream: true })
-        const currentText = content
-        setMessages(prev => {
-          const updated = [...prev]
-          updated[updated.length - 1] = { role: 'assistant', content: currentText }
-          return updated
-        })
+
+        if (firstChunk) {
+          firstChunk = false
+          setIsWaiting(false)
+          setMessages(prev => [...prev, { role: 'assistant', content }])
+        } else {
+          const currentText = content
+          setMessages(prev => {
+            const updated = [...prev]
+            updated[updated.length - 1] = { role: 'assistant', content: currentText }
+            return updated
+          })
+        }
       }
     } catch (err: unknown) {
       if (err instanceof Error && err.name === 'AbortError') return
       console.error('Chat error:', err)
+      setIsWaiting(false)
       setMessages(prev => [
         ...prev,
         { role: 'assistant', content: lang === 'de'
@@ -179,6 +188,7 @@ export default function ChatFAB({ lang, currentSlide, currentIndex, visitedSlide
       ])
     } finally {
       setIsStreaming(false)
+      setIsWaiting(false)
       abortRef.current = null
     }
   }
@@ -344,6 +354,32 @@ export default function ChatFAB({ lang, currentSlide, currentIndex, visitedSlide
                 </div>
               )}
 
+              {/* Waiting indicator */}
+              <AnimatePresence>
+                {isWaiting && (
+                  <motion.div
+                    initial={{ opacity: 0, y: 6 }}
+                    animate={{ opacity: 1, y: 0 }}
+                    exit={{ opacity: 0 }}
+                    className="flex gap-2.5"
+                  >
+                    <div className="w-7 h-7 rounded-full bg-indigo-500/20 flex items-center justify-center shrink-0 mt-0.5">
+                      <Bot className="w-3.5 h-3.5 text-indigo-400" />
+                    </div>
+                    <div className="bg-white/[0.06] rounded-2xl px-3.5 py-3 flex items-center gap-1">
+                      {[0, 1, 2].map(i => (
+                        <motion.span
+                          key={i}
+                          className="block w-1.5 h-1.5 rounded-full bg-indigo-400/70"
+                          animate={{ opacity: [0.3, 1, 0.3], y: [0, -3, 0] }}
+                          transition={{ duration: 0.7, repeat: Infinity, delay: i * 0.15 }}
+                        />
+                      ))}
+                    </div>
+                  </motion.div>
+                )}
+              </AnimatePresence>
+
               {messages.map((msg, idx) => (
                 <div
                   key={idx}