From 2670ad96c8d33f5f00d375f5e84d23c78c02beb4 Mon Sep 17 00:00:00 2001
From: Anish Sarkar <104695310+AnishSarkar22@users.noreply.github.com>
Date: Tue, 7 Jul 2026 22:41:32 +0530
Subject: [PATCH] feat(sidebar): highlight active chat items for improved user
 interaction

---
 .../components/layout/ui/sidebar/ChatListItem.tsx          | 7 ++++---
 1 file changed, 4 insertions(+), 3 deletions(-)

diff --git a/surfsense_web/components/layout/ui/sidebar/ChatListItem.tsx b/surfsense_web/components/layout/ui/sidebar/ChatListItem.tsx
index e39075443..013714fcf 100644
--- a/surfsense_web/components/layout/ui/sidebar/ChatListItem.tsx
+++ b/surfsense_web/components/layout/ui/sidebar/ChatListItem.tsx
@@ -47,6 +47,7 @@ export function ChatListItem({
 	const dropdownOpen = controlledOpen ?? internalOpen;
 	const setDropdownOpen = onDropdownOpenChange ?? setInternalOpen;
 	const animatedName = useTypewriter(name);
+	const isHighlighted = isActive || dropdownOpen;
 
 	const { handlers: longPressHandlers, wasLongPress } = useLongPress(
 		useCallback(() => setDropdownOpen(true), [setDropdownOpen])
@@ -67,9 +68,9 @@ export function ChatListItem({
 				onFocus={onPrefetch}
 				{...(isMobile ? longPressHandlers : {})}
 				className={sidebarListItemClassName({
-					active: isActive,
+					active: isHighlighted,
 					className:
-						"justify-start gap-2 overflow-hidden px-2 py-1.5 font-normal focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring",
+						"justify-start gap-2 overflow-hidden px-2 py-1.5 font-normal group-hover/item:bg-accent group-hover/item:text-accent-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring",
 				})}
 			>
 				<span className="min-w-0 flex-1 truncate">{animatedName}</span>
@@ -79,7 +80,7 @@ export function ChatListItem({
 			<div
 				className={cn(
 					"pointer-events-none absolute right-0 top-0 bottom-0 flex items-center pr-1 pl-6 rounded-r-md",
-					isActive
+					isHighlighted
 						? "bg-gradient-to-l from-accent from-60% to-transparent"
 						: "bg-gradient-to-l from-sidebar from-60% to-transparent group-hover/item:from-accent",
 					isMobile