fixed styling & bus in searchbar

Author: bnmunesh

src/Pages/Executive/CustomerSupportChat.jsx

@@ -83,6 +83,7 @@ const CustomerSupportChat = ({socket}) => {
       handleSendMessage();
     }
   };
+
   useEffect(()=>{
     console.log({selectedConversation})
   }, [selectedConversation])
@@ -162,18 +163,9 @@ const CustomerSupportChat = ({socket}) => {
 
   // Function to filter conversations based on search term and status filters
   const filteredConversations = OriginalListOfConvos.filter((conversation) => {
-    const hasSearchTerm = conversation._id.toString().includes(searchTerm);
-    // const isFiltered =
-    //   (statusFilters.ongoing && conversation.status === "ongoing") ||
-    //   (statusFilters.waiting && conversation.status === "waiting") ||
-    //   (statusFilters.closed && conversation.status === "closed");
-
+    const hasSearchTerm = conversation._id.toString().toLowerCase().includes(searchTerm.toLowerCase());
     return (
       hasSearchTerm
-      // (isFiltered ||
-      //   (!statusFilters.ongoing &&
-      //     !statusFilters.waiting &&
-      //     !statusFilters.closed))
     );
   });
 
@@ -312,7 +304,7 @@ const CustomerSupportChat = ({socket}) => {
                 <div className="conversation-box">
                     <ul className="conversation-list">
                       {convos.length===0?<p>No chats found</p> :
-                        convos.length > 0 && convos.map((conversation, i) => (
+                        convos.length > 0 && convos.map /*&& filteredConversations.map*/ ((conversation, i) => (
                           <div
                             key={conversation._id}
                             className={`conversation-item ${

src/Pages/Executive/customer-support-chat.css

@@ -1,8 +1,3 @@
-/* customer-support-chat.css */
-/* body {
-  margin: 0;
-  font-family: Arial, sans-serif;
-} */
 
 .chat-container{
   display: flex;
@@ -97,9 +92,13 @@ border-radius: 10px;
 
 /* no data found */
 .conversation-list p{
+    height: 73.5vh;
     font-size: 16px;
     color: #667781;
     font-family: inherit;
+    display: flex;
+    justify-content: center;
+    align-items: center;
 }
 
 
@@ -132,36 +131,13 @@ border-radius: 10px;
 
 .status-filter input{
   margin-right: 5px;
-  appearance: none;
-  -webkit-appearance: none;
-  -moz-appearance: none;
-  width: 13px;
-  height: 13px;
-  border: 2px solid #f8f8fd; /* Checkbox border color */
-  border-radius: 2px;
-  outline: none;
-  transition: background-color 0.3s, border-color 0.3s;
-  
-}
-
-.status-filter input:checked{
-  background-color: #eb1818; /* Checked background color */
-  border-color: #eb1818; /* Checked border color */
-}
-
-.conversation-item:hover:not(.selected){
-  background-color: #f5f5f5;
+  cursor: pointer;
 }
 
 .selected{
   background-color: rgb(212, 212, 212);
 }
 
-
-
-
-
-
 /* Right Column */
 .Rightcol{
   width: 73%;
@@ -208,14 +184,11 @@ padding: 8px;
 
 
 .message-container {
-  /* border: 1px solid #ccc; */
-  /* min-height: 300px; */
   padding: 20px 40px;
   height: 80vh;
   overflow-y: scroll;
   background: #dcdaf8;
   background: #e6dddd;
-  /* background-color: #c2b8b8; */
 }
 
 .message-item {