From faee10ee5ca58e7fef0283c76ec70ead370b8111 Mon Sep 17 00:00:00 2001
From: Jeev-Sampath <jeev.sampath10@gmail.com>
Date: Wed, 25 Feb 2026 18:45:16 -0500
Subject: [PATCH 1/2] Update chatPreviewList.tsx

---
 web-app/app/(chat)/chat/_components/chatPreviewList.tsx | 1 +
 1 file changed, 1 insertion(+)

diff --git a/web-app/app/(chat)/chat/_components/chatPreviewList.tsx b/web-app/app/(chat)/chat/_components/chatPreviewList.tsx
index 4910a5e..617fa77 100644
--- a/web-app/app/(chat)/chat/_components/chatPreviewList.tsx
+++ b/web-app/app/(chat)/chat/_components/chatPreviewList.tsx
@@ -10,6 +10,7 @@ const AVATAR_COLORS = [
   "bg-amber-500",
 ]
 
+
 export interface Conversation {
   id: string
   name: string

From 7908dbfb7f30bd26c4dbb67d6a4fe7333e4e9ae5 Mon Sep 17 00:00:00 2001
From: Jeev-Sampath <jeev.sampath10@gmail.com>
Date: Mon, 2 Mar 2026 19:17:57 -0500
Subject: [PATCH 2/2] Added Chat Preview List search bar functionality

---
 .../chat/_components/chatPreviewList.tsx      | 39 ++++++++++++++++++-
 web-app/app/(chat)/chat/chat-client.tsx       |  5 +++
 2 files changed, 42 insertions(+), 2 deletions(-)

diff --git a/web-app/app/(chat)/chat/_components/chatPreviewList.tsx b/web-app/app/(chat)/chat/_components/chatPreviewList.tsx
index 617fa77..ad42da3 100644
--- a/web-app/app/(chat)/chat/_components/chatPreviewList.tsx
+++ b/web-app/app/(chat)/chat/_components/chatPreviewList.tsx
@@ -27,6 +27,32 @@ function getInitials(name: string) {
     .toUpperCase()
 }
 
+function nameMatchesSearch(name: string, searchEntry: string) {
+  const search = searchEntry.toLowerCase().trim()
+  if (!search) return true
+  if(search.length > name.trim().length) return false
+
+  let matches = true;
+
+  let searchArr = search.split(" ")
+  searchArr.forEach(searchTerm => {
+    if(!name.toLowerCase()
+    .trim()
+    .split(/\s+/)
+    .some(part => part.startsWith(searchTerm)) && 
+    !name
+    .toLowerCase()
+    .startsWith(searchEntry.toLowerCase())){
+      matches = false
+      return
+    }
+    
+  })
+
+  return matches
+
+}
+
 export function ChatPreviewItem({
   conversation,
   isSelected,
@@ -83,11 +109,19 @@ export function ChatPreviewList({
   conversations,
   selectedId,
   onSelect,
+  searchEntry,
+  setSearchEntry
 }: {
   conversations: Conversation[]
   selectedId: string
   onSelect: (id: string) => void
+  searchEntry: string
+  setSearchEntry: (id: string) => void
 }) {
+
+  //Filters conversations in the preview list based on search term entered in the search bar
+  let filteredConversations = conversations.filter(conversations => nameMatchesSearch(conversations.name, searchEntry))
+
   return (
     <div className="flex h-full flex-col">
       <div className="flex flex-col gap-2 border-b px-4 py-4">
@@ -98,7 +132,8 @@ export function ChatPreviewList({
         <Input
           type="text"
           placeholder="Search conversations..."
-          readOnly
+          value = {searchEntry}
+          onChange = {e => setSearchEntry(e.target.value)}
         />
       </div>
 
@@ -109,7 +144,7 @@ export function ChatPreviewList({
             <p>Create one to get started.</p>
           </div>
         ) : (
-          conversations.map((conversation, index) => (
+          filteredConversations.map((conversation, index) => (
             <ChatPreviewItem
               key={conversation.id}
               conversation={conversation}
diff --git a/web-app/app/(chat)/chat/chat-client.tsx b/web-app/app/(chat)/chat/chat-client.tsx
index 22901c2..c5ee572 100644
--- a/web-app/app/(chat)/chat/chat-client.tsx
+++ b/web-app/app/(chat)/chat/chat-client.tsx
@@ -104,6 +104,9 @@ export function ChatClient({
       .finally(() => setLoading(false))
   }, [selectedId, currentUserId])
 
+  //value for the search bar
+  const [searchEntry, setSearchEntry] = useState("");
+
   return (
     <div className="flex h-[calc(100vh-80px)]">
       <aside className="w-80 shrink-0 border-r">
@@ -111,6 +114,8 @@ export function ChatClient({
           conversations={initialConversations}
           selectedId={selectedId}
           onSelect={setSelectedId}
+          searchEntry = {searchEntry}
+          setSearchEntry = {setSearchEntry}
         />
       </aside>