Address code review feedback: improve key props, delete handling, and search robustness

Co-authored-by: PeterDaveHello <[email protected]>

Author: Copilot

src/pages/IndependentPanel/App.jsx

@@ -106,21 +106,27 @@ function App() {
 
   // Filter sessions based on search query (memoized for performance)
   const filteredSessions = useMemo(() => {
-    const query = searchQuery.trim().toLowerCase()
+    const query = String(searchQuery || '')
+      .trim()
+      .toLowerCase()
     if (!query) return sessions
 
+    const toSafeString = (value) =>
+      typeof value === 'string' ? value : value == null ? '' : String(value)
+
     return sessions.filter((session) => {
       // Search in session name
-      if (session.sessionName && session.sessionName.toLowerCase().includes(query)) {
+      const sessionName = toSafeString(session.sessionName).toLowerCase()
+      if (sessionName.includes(query)) {
         return true
       }
 
       // Search in conversation records
-      if (session.conversationRecords) {
+      if (Array.isArray(session.conversationRecords)) {
         return session.conversationRecords.some((record) => {
-          const questionMatch = record.question && record.question.toLowerCase().includes(query)
-          const answerMatch = record.answer && record.answer.toLowerCase().includes(query)
-          return questionMatch || answerMatch
+          const question = toSafeString(record?.question).toLowerCase()
+          const answer = toSafeString(record?.answer).toLowerCase()
+          return question.includes(query) || answer.includes(query)
         })
       }
 
@@ -156,9 +162,9 @@ function App() {
             />
           </div>
           <div className="chat-list">
-            {filteredSessions.map((session) => (
+            {filteredSessions.map((session, index) => (
               <button
-                key={session.sessionId}
+                key={session.sessionId || `session-${index}`}
                 className={`normal-button ${sessionId === session.sessionId ? 'active' : ''}`}
                 style={{
                   display: 'flex',
@@ -174,12 +180,17 @@ function App() {
                   <DeleteButton
                     size={14}
                     text={t('Delete Conversation')}
-                    onConfirm={() =>
-                      deleteSession(session.sessionId).then((sessions) => {
-                        setSessions(sessions)
-                        setSessionIdSafe(sessions[0].sessionId)
-                      })
-                    }
+                    onConfirm={async () => {
+                      const updatedSessions = await deleteSession(session.sessionId)
+                      setSessions(updatedSessions)
+                      if (updatedSessions && updatedSessions.length > 0) {
+                        await setSessionIdSafe(updatedSessions[0].sessionId)
+                      } else {
+                        // No sessions left after deletion
+                        setSessionId(null)
+                        setCurrentSession(null)
+                      }
+                    }}
                   />
                 </span>
               </button>