Make entire directory rows clickable for toggle

Enhanced directory interaction by making the entire table row clickable
to expand/collapse folders, improving user experience and efficiency.
- Added row-level click handlers for directories with cursor feedback
- Prevented event bubbling on checkbox and actions dropdown cells
- Simplified arrow buttons to show state only (no individual clicks)
- Preserved file download links and all existing functionality

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <[email protected]>

1 files changed, 9 insertions, 5 deletions

diff --git a/frontend/file-drive.tsx b/frontend/file-drive.tsx
index 1e14c78..2784c1a 100644
--- a/frontend/file-drive.tsx
+++ b/frontend/file-drive.tsx
@@ -306,14 +306,18 @@ export default function FileDrive() {
     const rows: React.ReactNode[] = []
 
     rows.push(
-      <TableRow key={item.path} className={`hover:bg-muted/50 ${isSelected ? "bg-muted/30" : ""}`}>
-        <TableCell className="w-[40px]">
+      <TableRow 
+        key={item.path} 
+        className={`hover:bg-muted/50 ${isSelected ? "bg-muted/30" : ""} ${item.type === "dir" ? "cursor-pointer" : ""}`}
+        onClick={item.type === "dir" ? () => toggleFolder(item.path) : undefined}
+      >
+        <TableCell className="w-[40px]" onClick={(e) => e.stopPropagation()}>
           <Checkbox checked={isSelected} onCheckedChange={() => toggleFileSelection(item.path)} />
         </TableCell>
         <TableCell className="font-medium">
           <div className="flex items-center gap-2" style={{ paddingLeft: `${level * 20}px` }}>
             {item.type === "dir" && (
-              <Button variant="ghost" size="sm" className="h-4 w-4 p-0" onClick={() => toggleFolder(item.path)}>
+              <Button variant="ghost" size="sm" className="h-4 w-4 p-0">
                 {isExpanded ? <ChevronDown className="h-3 w-3" /> : <ChevronRight className="h-3 w-3" />}
               </Button>
             )}
@@ -322,7 +326,7 @@ export default function FileDrive() {
             ) : (
               <File className="h-4 w-4 text-gray-500" />
             )}
-            {item.type === "file" && item.blob ? (
+{item.type === "file" && item.blob ? (
               <a
                 href={`/blob/${item.blob}?filename=${encodeURIComponent(item.name)}`}
                 className="text-blue-600 hover:text-blue-800 hover:underline cursor-pointer"
@@ -338,7 +342,7 @@ export default function FileDrive() {
         </TableCell>
         <TableCell>{formatFileSize(item.size || 0)}</TableCell>
         <TableCell>{formatDate(item.lastmod)}</TableCell>
-        <TableCell>
+        <TableCell onClick={(e) => e.stopPropagation()}>
           <DropdownMenu>
             <DropdownMenuTrigger asChild>
               <Button variant="ghost" size="sm" className="h-8 w-8 p-0">