From 310370ef6627130e7e2875b8076a3f5248651cf2 Mon Sep 17 00:00:00 2001
From: Roberto Musso <rmusso@neuraldesk.local>
Date: Sat, 28 Feb 2026 07:59:24 +0100
Subject: [PATCH] fix(floating-ai): replace ScrollArea with div for message
 container in FloatingChat

---
 src/renderer/components/ai/FloatingChat.tsx | 11 +++++------
 1 file changed, 5 insertions(+), 6 deletions(-)

diff --git a/src/renderer/components/ai/FloatingChat.tsx b/src/renderer/components/ai/FloatingChat.tsx
index 43944fe..7e1bb3d 100644
--- a/src/renderer/components/ai/FloatingChat.tsx
+++ b/src/renderer/components/ai/FloatingChat.tsx
@@ -11,7 +11,6 @@ import {
 } from '@/context/FloatingChatContext';
 import { useAIChat, type ChatContext } from '@/hooks/useAIChat';
 import { ChatMarkdown } from '@/components/ai/AIChatPanel';
-import { ScrollArea } from '@/components/ui/scroll-area';
 import { Skeleton } from '@/components/ui/skeleton';
 
 function FloatingChatInner() {
@@ -160,11 +159,11 @@ function FloatingChatInner() {
                 animate={{ opacity: 1, height: 'auto', scale: 1 }}
                 exit={{ opacity: 0, height: 0, scale: 0.97 }}
                 transition={{ type: 'spring', stiffness: 400, damping: 30 }}
-                className="rounded-2xl overflow-hidden"
+                className="rounded-2xl"
               >
-                <ScrollArea
-                  className="max-h-[300px]"
-                  viewportRef={scrollRef}
+                <div
+                  ref={scrollRef}
+                  className="max-h-[300px] overflow-y-auto rounded-2xl [&::-webkit-scrollbar]:w-2.5 [&::-webkit-scrollbar-track]:bg-transparent [&::-webkit-scrollbar-thumb]:rounded-full [&::-webkit-scrollbar-thumb]:bg-border"
                 >
                   <div className="flex flex-col gap-2.5 p-3">
                     {messages.map((msg) => {
@@ -221,7 +220,7 @@ function FloatingChatInner() {
                       </div>
                     )}
                   </div>
-                </ScrollArea>
+                </div>
               </motion.div>
             )}
           </AnimatePresence>