From d813733f0c0a80297e5f5709147ebf1cc9876995 Mon Sep 17 00:00:00 2001
From: Deon Sanchez <69873175+deon-sanchez@users.noreply.github.com>
Date: Wed, 17 Sep 2025 18:22:42 -0600
Subject: [PATCH] Refactor SearchPage Component for Improved File Selection

- Updated the file selection UI to allow clicking on file names for selection, enhancing user interaction.
- Changed AgGrid configuration to enable row selection with clicks, improving usability.
- Removed unnecessary row click event handling to streamline the selection process.
---
 frontend/src/app/knowledge/page.tsx | 27 +++++++++++++++------------
 1 file changed, 15 insertions(+), 12 deletions(-)

diff --git a/frontend/src/app/knowledge/page.tsx b/frontend/src/app/knowledge/page.tsx
index 50f7ff56..0cd3c9f1 100644
--- a/frontend/src/app/knowledge/page.tsx
+++ b/frontend/src/app/knowledge/page.tsx
@@ -26,7 +26,7 @@ import { Input } from "@/components/ui/input";
 import { useKnowledgeFilter } from "@/contexts/knowledge-filter-context";
 import { useTask } from "@/contexts/task-context";
 import { type File, useGetSearchQuery } from "../api/queries/useGetSearchQuery";
-import { ColDef, RowClickedEvent } from "ag-grid-community";
+import { ColDef } from "ag-grid-community";
 import "@/components/AgGrid/registerAgGridModules";
 import "@/components/AgGrid/agGridStyles.css";
 import { KnowledgeActionsDropdown } from "@/components/knowledge-actions-dropdown";
@@ -99,10 +99,18 @@ function SearchPage() {
       cellRenderer: ({ data, value }: CustomCellRendererProps<File>) => {
         return (
           <div className="flex items-center gap-2 ml-2">
-            {getSourceIcon(data?.connector_type)}
-            <span className="font-medium text-foreground truncate">
-              {value}
-            </span>
+            <div
+              className="flex items-center gap-2 cursor-pointer hover:text-blue-600 transition-colors"
+              onClick={e => {
+                e.stopPropagation();
+                setSelectedFile(data?.filename ?? "");
+              }}
+            >
+              {getSourceIcon(data?.connector_type)}
+              <span className="font-medium text-foreground truncate">
+                {value}
+              </span>
+            </div>
           </div>
         );
       },
@@ -331,15 +339,10 @@ function SearchPage() {
             ref={gridRef}
             rowData={fileResults}
             rowSelection="multiple"
-            suppressRowClickSelection={true}
+            rowMultiSelectWithClick={true}
+            suppressRowClickSelection={false}
             getRowId={params => params.data.filename}
             onSelectionChanged={onSelectionChanged}
-            onRowClicked={(params: RowClickedEvent<File>) => {
-              // Only navigate to chunks if no rows are selected and not clicking on checkbox
-              if (selectedRows.length === 0) {
-                setSelectedFile(params.data?.filename ?? "");
-              }
-            }}
             noRowsOverlayComponent={() => (
               <div className="text-center">
                 <Search className="h-12 w-12 mx-auto mb-4 text-muted-foreground/50" />