fix(tables): classify a remote selection as pinned only when both endpoints resolve

Author: waleedlatif1

apps/sim/app/workspace/[workspaceId]/tables/[tableId]/components/table-grid/data-row.tsx

@@ -306,6 +306,11 @@ export const DataRow = React.memo(function DataRow({
         const isRightEdge = inRange ? colIndex === sel!.endCol : colIndex === columns.length - 1
 
         const pinnedLeft = pinnedOffsets?.get(column.key)
+        /**
+         * Whether this cell is frozen in the sticky left zone. Drives the sticky offset and,
+         * via the `data-pinned` attribute below, tells overlays measured off these cells
+         * (see `remote-selection-overlay.tsx`) a frozen cell from one scrolled behind the zone.
+         */
         const isPinnedCell = pinnedLeft !== undefined
         const isPinnedSeparator = column.key === lastPinnedColKey
 
@@ -315,8 +320,6 @@ export const DataRow = React.memo(function DataRow({
             data-row={rowIndex}
             data-row-id={row.id}
             data-col={colIndex}
-            // Read by overlays measured off these cells (see remote-selection-overlay.tsx)
-            // to tell a cell frozen in the sticky zone from one scrolled behind it.
             data-pinned={isPinnedCell ? '' : undefined}
             className={cn(
               CELL,

apps/sim/app/workspace/[workspaceId]/tables/[tableId]/components/table-grid/remote-selection-overlay.tsx

@@ -172,15 +172,20 @@ export function RemoteSelectionOverlay({
       const focusCol = columnIndexByIdRef.current.get(focus.columnId)
       const anchorRow = rowIndexByIdRef.current.get(anchor.rowId)
       const focusRow = rowIndexByIdRef.current.get(focus.rowId)
-      const cells = [
-        cellElement(scrollEl, anchor.rowId, anchorCol),
-        cellElement(scrollEl, focus.rowId, focusCol),
-      ].filter((cell): cell is HTMLElement => cell !== null)
+      const anchorCell = cellElement(scrollEl, anchor.rowId, anchorCol)
+      const focusCell = cellElement(scrollEl, focus.rowId, focusCol)
+      const cells = [anchorCell, focusCell].filter((cell): cell is HTMLElement => cell !== null)
       if (cells.length === 0) continue
       const rects = cells.map((cell) => cell.getBoundingClientRect())
-      // A range straddling the boundary defers to the frozen zone, so its scrolled-away half
-      // can't bleed over the gutter — the conservative half of the trade, and the rarer case.
-      const pinned = cells.every((cell) => cell.hasAttribute('data-pinned'))
+      // Both endpoints must be resolved AND pinned. Anything else — a range straddling the
+      // boundary, or one whose other endpoint is virtualized off-window and so can't be
+      // classified — defers to the frozen zone, where the worst case is a selection the zone
+      // hides rather than one painting over the gutter.
+      const pinned =
+        anchorCell !== null &&
+        focusCell !== null &&
+        anchorCell.hasAttribute('data-pinned') &&
+        focusCell.hasAttribute('data-pinned')
 
       const viewportTop = Math.min(...rects.map((r) => r.top))
       const viewportLeft = Math.min(...rects.map((r) => r.left))