add shift-click range selection and selection-aware context menu for files

- Extend SelectableConfig.onSelectRow with optional shiftKey param; DataRow captures shiftKey before onCheckedChange fires via a ref so the Radix Checkbox interaction chain stays intact
- Implement shift-click range selection in files.tsx using lastSelectedIndexRef; tracks last-selected index in visibleRowIds to compute the range
- Reset lastSelectedIndexRef on deselect and select-all
- Add selectedCount prop to FileRowContextMenu; hide Open and Rename when multiple items are selected, show "Delete N items" / "Download N items" labels in multi-select mode

Author: waleedlatif1

apps/sim/app/workspace/[workspaceId]/components/resource/resource.tsx

@@ -39,7 +39,7 @@ export interface ResourceRow {
 
 export interface SelectableConfig {
   selectedIds: Set<string>
-  onSelectRow: (id: string, checked: boolean) => void
+  onSelectRow: (id: string, checked: boolean, shiftKey?: boolean) => void
   onSelectAll: (checked: boolean) => void
   isAllSelected: boolean
   disabled?: boolean
@@ -510,9 +510,17 @@ const DataRow = memo(function DataRow({
     [onRowContextMenu, row.id]
   )
 
+  const shiftKeyRef = useRef(false)
+
+  const handleSelectRowClick = useCallback((e: React.MouseEvent) => {
+    e.stopPropagation()
+    shiftKeyRef.current = e.shiftKey
+  }, [])
+
   const handleSelectRow = useCallback(
     (checked: boolean | 'indeterminate') => {
-      selectable?.onSelectRow(row.id, checked as boolean)
+      selectable?.onSelectRow(row.id, checked as boolean, shiftKeyRef.current)
+      shiftKeyRef.current = false
     },
     [selectable, row.id]
   )
@@ -585,7 +593,7 @@ const DataRow = memo(function DataRow({
             onCheckedChange={handleSelectRow}
             disabled={selectable.disabled}
             aria-label='Select row'
-            onClick={stopPropagation}
+            onClick={handleSelectRowClick}
           />
         </td>
       )}

apps/sim/app/workspace/[workspaceId]/files/components/file-row-context-menu/file-row-context-menu.tsx

@@ -22,6 +22,7 @@ interface FileRowContextMenuProps {
   onRename: () => void
   onDelete: () => void
   canEdit: boolean
+  selectedCount: number
 }
 
 export const FileRowContextMenu = memo(function FileRowContextMenu({
@@ -33,7 +34,10 @@ export const FileRowContextMenu = memo(function FileRowContextMenu({
   onRename,
   onDelete,
   canEdit,
+  selectedCount,
 }: FileRowContextMenuProps) {
+  const isMultiSelect = selectedCount > 1
+
   return (
     <DropdownMenu open={isOpen} onOpenChange={(open) => !open && onClose()} modal={false}>
       <DropdownMenuTrigger asChild>
@@ -56,26 +60,30 @@ export const FileRowContextMenu = memo(function FileRowContextMenu({
         sideOffset={4}
         onCloseAutoFocus={(e) => e.preventDefault()}
       >
-        <DropdownMenuItem onSelect={onOpen}>
-          <Eye />
-          Open
-        </DropdownMenuItem>
+        {!isMultiSelect && (
+          <DropdownMenuItem onSelect={onOpen}>
+            <Eye />
+            Open
+          </DropdownMenuItem>
+        )}
         {onDownload && (
           <DropdownMenuItem onSelect={onDownload}>
             <Download />
-            Download
+            {isMultiSelect ? `Download ${selectedCount} items` : 'Download'}
           </DropdownMenuItem>
         )}
         {canEdit && (
           <>
             <DropdownMenuSeparator />
-            <DropdownMenuItem onSelect={onRename}>
-              <Pencil />
-              Rename
-            </DropdownMenuItem>
+            {!isMultiSelect && (
+              <DropdownMenuItem onSelect={onRename}>
+                <Pencil />
+                Rename
+              </DropdownMenuItem>
+            )}
             <DropdownMenuItem onSelect={onDelete}>
               <Trash2 />
-              Delete
+              {isMultiSelect ? `Delete ${selectedCount} items` : 'Delete'}
             </DropdownMenuItem>
           </>
         )}

apps/sim/app/workspace/[workspaceId]/files/files.tsx

@@ -253,6 +253,7 @@ export function Files() {
   const [showUnsavedChangesAlert, setShowUnsavedChangesAlert] = useState(false)
   const [showDeleteConfirm, setShowDeleteConfirm] = useState(false)
   const contextMenuItemRef = useRef<FileResourceItem | null>(null)
+  const lastSelectedIndexRef = useRef<number>(-1)
   const draggedRowIdsRef = useRef<string[]>([])
   const dragGhostRef = useRef<HTMLElement | null>(null)
   const [deleteTarget, setDeleteTarget] = useState<{
@@ -498,15 +499,29 @@ export function Files() {
     () => ({
       selectedIds: selectedRowIds,
       isAllSelected,
-      onSelectRow: (rowId: string, checked: boolean) => {
-        setSelectedRowIds((prev) => {
-          const next = new Set(prev)
-          if (checked) next.add(rowId)
-          else next.delete(rowId)
-          return next
-        })
+      onSelectRow: (rowId: string, checked: boolean, shiftKey?: boolean) => {
+        const currentIndex = visibleRowIds.indexOf(rowId)
+        if (shiftKey && lastSelectedIndexRef.current !== -1 && currentIndex !== -1) {
+          const start = Math.min(lastSelectedIndexRef.current, currentIndex)
+          const end = Math.max(lastSelectedIndexRef.current, currentIndex)
+          setSelectedRowIds((prev) => {
+            const next = new Set(prev)
+            for (let i = start; i <= end; i++) next.add(visibleRowIds[i])
+            return next
+          })
+        } else {
+          setSelectedRowIds((prev) => {
+            const next = new Set(prev)
+            if (checked) next.add(rowId)
+            else next.delete(rowId)
+            return next
+          })
+          if (checked) lastSelectedIndexRef.current = currentIndex
+          else lastSelectedIndexRef.current = -1
+        }
       },
       onSelectAll: (checked: boolean) => {
+        lastSelectedIndexRef.current = -1
         setSelectedRowIds((prev) => {
           const next = new Set(prev)
           for (const rowId of visibleRowIds) {
@@ -1785,6 +1800,7 @@ export function Files() {
         onRename={handleContextMenuRename}
         onDelete={handleContextMenuDelete}
         canEdit={canEdit}
+        selectedCount={selectedRowIds.size}
       />
 
       <DeleteConfirmModal