update

frontend/src/composables/useChat.js

@@ -1,5 +1,10 @@
 import { ref, nextTick } from 'vue'
 
+// (Fast) am unteren Rand? Schwelle fängt Sub-Pixel und kleine Abstände ab.
+export function istUnten(el, schwelle = 60) {
+  return el.scrollHeight - el.scrollTop - el.clientHeight < schwelle
+}
+
 // Gemeinsame Chat-Mechanik: senden, abbrechen (Run-Counter), scrollen, Fokus.
 // performRequest(messages) → Promise<{ reply, … }>; send() gibt die Antwort
 // zurück, damit der Aufrufer Extras (z. B. changes) auswerten kann.
@@ -9,11 +14,17 @@ export function useChat(performRequest) {
   const loading = ref(false)
   const messagesEl = ref(null) // Template-Ref: Nachrichten-Container
   const inputEl = ref(null)    // Template-Ref: Textarea
+  const stick = ref(true)      // an den Boden „gepinnt" — nur dann auto-scrollen
   let run = 0 // laufende Anfrage identifizieren; Abbruch ignoriert ihr Ergebnis
 
+  // @scroll-Handler: pinnt nur, wenn der Nutzer (fast) unten ist.
+  function onScroll() {
+    if (messagesEl.value) stick.value = istUnten(messagesEl.value)
+  }
+
   async function scrollToBottom() {
     await nextTick()
-    if (messagesEl.value) messagesEl.value.scrollTop = messagesEl.value.scrollHeight
+    if (messagesEl.value && stick.value) messagesEl.value.scrollTop = messagesEl.value.scrollHeight
   }
 
   function autoGrow(max = 140) {
@@ -73,5 +84,5 @@ export function useChat(performRequest) {
     }
   }
 
-  return { messages, input, loading, messagesEl, inputEl, send, cancel, reset, scrollToBottom, autoGrow }
+  return { messages, input, loading, messagesEl, inputEl, stick, onScroll, send, cancel, reset, scrollToBottom, autoGrow }
 }