[WIKI-554] feat: delete multiple rows/columns from a table#7426
[WIKI-554] feat: delete multiple rows/columns from a table#7426
Conversation
WalkthroughThis update refactors table-related utilities by centralizing helper functions for cell emptiness and selection checks, removes the table selection outline plugin and its utilities, and introduces a new handler for delete key operations on tables. Several redundant or duplicate implementations are deleted, with logic consolidated into shared modules. Changes
Sequence Diagram(s)sequenceDiagram
participant User
participant Editor
participant TableUtil as Table Utilities
User->>Editor: Presses Delete/Backspace with table cell selection
Editor->>TableUtil: handleDeleteKeyOnTable(selection, state, dispatch)
TableUtil->>TableUtil: Check if selection is cell selection
TableUtil->>TableUtil: Check if selected cells are empty
alt All selected cells are empty and full rows/columns selected
TableUtil->>Editor: Delete rows/columns, reposition cursor
else
TableUtil->>Editor: No action
end
Possibly related PRs
Suggested labels
Suggested reviewers
Poem
✨ Finishing Touches
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. 🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
SupportNeed help? Create a ticket on our support page for assistance with any issues or questions. Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments. CodeRabbit Commands (Invoked using PR comments)
Other keywords and placeholders
CodeRabbit Configuration File (
|
|
Pull Request Linked with Plane Work Items
Comment Automatically Generated by Plane |
There was a problem hiding this comment.
Actionable comments posted: 1
🧹 Nitpick comments (1)
packages/editor/src/core/extensions/table/table/utilities/delete-key-shortcut.ts (1)
91-113: Remove redundant fallback searchThe manual search loop (lines 103-110) is redundant as it performs the exact same operation as
indexOf. IfindexOfreturns -1, the manual loop will also fail to find the value.const findCellCoordinate = (cellStart: number, tableInfo: TableInfo): CellCoord | null => { - // Primary method: use indexOf const cellIndex = tableInfo.map.map.indexOf(cellStart); if (cellIndex !== -1) { return { row: Math.floor(cellIndex / tableInfo.totalColumns), col: cellIndex % tableInfo.totalColumns, }; } - // Fallback: manual search - for (let i = 0; i < tableInfo.map.map.length; i++) { - if (tableInfo.map.map[i] === cellStart) { - return { - row: Math.floor(i / tableInfo.totalColumns), - col: i % tableInfo.totalColumns, - }; - } - } - return null; };
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (9)
packages/editor/src/core/extensions/table/plugins/insert-handlers/utils.ts(1 hunks)packages/editor/src/core/extensions/table/plugins/selection-outline/plugin.ts(2 hunks)packages/editor/src/core/extensions/table/plugins/table-selection-outline/plugin.ts(0 hunks)packages/editor/src/core/extensions/table/plugins/table-selection-outline/utils.ts(0 hunks)packages/editor/src/core/extensions/table/table/table-view.tsx(2 hunks)packages/editor/src/core/extensions/table/table/table.ts(2 hunks)packages/editor/src/core/extensions/table/table/utilities/delete-key-shortcut.ts(1 hunks)packages/editor/src/core/extensions/table/table/utilities/delete-table-when-all-cells-selected.ts(0 hunks)packages/editor/src/core/extensions/table/table/utilities/helpers.ts(2 hunks)
💤 Files with no reviewable changes (3)
- packages/editor/src/core/extensions/table/table/utilities/delete-table-when-all-cells-selected.ts
- packages/editor/src/core/extensions/table/plugins/table-selection-outline/plugin.ts
- packages/editor/src/core/extensions/table/plugins/table-selection-outline/utils.ts
🧰 Additional context used
🧬 Code Graph Analysis (1)
packages/editor/src/core/extensions/table/table/utilities/delete-key-shortcut.ts (2)
packages/editor/src/core/extensions/table/table/utilities/helpers.ts (2)
isCellSelection(10-10)isCellEmpty(17-35)packages/editor/src/index.ts (1)
CORE_EXTENSIONS(37-37)
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (2)
- GitHub Check: Analyze (python)
- GitHub Check: Analyze (javascript)
🔇 Additional comments (7)
packages/editor/src/core/extensions/table/table/utilities/helpers.ts (1)
12-35: Well-structured cell emptiness check with proper node type handling.The
isCellEmptyfunction correctly handles different scenarios:
- Null cells and empty content
- Paragraph nodes (checking content size)
- Other node types (checking content size or text nodes)
The centralization of this logic from the previous duplicate implementation is a good improvement.
packages/editor/src/core/extensions/table/table/table-view.tsx (1)
100-100: Good refactoring to use centralized helper function.Replacing the direct
CellSelectioninstance check withisCellSelection(selection)improves consistency across the codebase and centralizes the selection type checking logic.packages/editor/src/core/extensions/table/plugins/selection-outline/plugin.ts (1)
29-29: Consistent refactoring to use centralized selection helper.The change from
selection instanceof CellSelectiontoisCellSelection(selection)aligns with the broader refactoring effort to standardize selection type checking across the table extension.packages/editor/src/core/extensions/table/table/table.ts (1)
239-242: Significant behavioral enhancement for table delete operations.The replacement of
deleteTableWhenAllCellsSelectedwithhandleDeleteKeyOnTableimplements the new multi-row/column deletion feature described in the PR objectives. This provides more nuanced delete behavior where:
- First delete clears cell content
- Second delete removes the cells themselves
- Supports deleting multiple rows/columns when selection spans them
This change aligns well with the PR's goal to improve table editing UX.
packages/editor/src/core/extensions/table/plugins/insert-handlers/utils.ts (1)
5-5: Good refactoring to eliminate code duplication.Importing
isCellEmptyfrom the shared helpers module instead of maintaining a local implementation centralizes the logic and reduces code duplication. This aligns with the broader refactoring effort to consolidate table utilities.packages/editor/src/core/extensions/table/table/utilities/delete-key-shortcut.ts (2)
143-166: Fix row deletion logic to account for shifting indicesAfter deleting a row, all subsequent rows shift up by one position. The current implementation continues to position the cursor at the original
minRow, which could lead to deleting incorrect rows.const deleteMultipleRows = ( editor: Editor, totalRowsInSelection: number, minRow: number, initialTableInfo: TableInfo ): boolean => { - // Position cursor at the first selected row - setCursorAtPosition(editor, initialTableInfo, minRow, 0); - - // Delete rows one by one + // Always delete at the same row index as rows shift up after deletion for (let i = 0; i < totalRowsInSelection; i++) { + const updatedTableInfo = getTableInfo(editor); + if (!updatedTableInfo) return false; + + setCursorAtPosition(editor, updatedTableInfo, minRow, 0); editor.commands.deleteRow(); - - // Reposition cursor if there are more rows to delete - if (i < totalRowsInSelection - 1) { - const updatedTableInfo = getTableInfo(editor); - if (updatedTableInfo) { - setCursorAtPosition(editor, updatedTableInfo, minRow, 0); - } - } } return true; };Likely an incorrect or invalid review comment.
168-191: Fix column deletion logic to account for shifting indicesSimilar to the row deletion issue, columns shift left after deletion. The current implementation could delete incorrect columns.
const deleteMultipleColumns = ( editor: Editor, totalColumnsInSelection: number, minCol: number, initialTableInfo: TableInfo ): boolean => { - // Position cursor at the first selected column - setCursorAtPosition(editor, initialTableInfo, 0, minCol); - - // Delete columns one by one + // Always delete at the same column index as columns shift left after deletion for (let i = 0; i < totalColumnsInSelection; i++) { + const updatedTableInfo = getTableInfo(editor); + if (!updatedTableInfo) return false; + + setCursorAtPosition(editor, updatedTableInfo, 0, minCol); editor.commands.deleteColumn(); - - // Reposition cursor if there are more columns to delete - if (i < totalColumnsInSelection - 1) { - const updatedTableInfo = getTableInfo(editor); - if (updatedTableInfo) { - setCursorAtPosition(editor, updatedTableInfo, 0, minCol); - } - } } return true; };Likely an incorrect or invalid review comment.
Description
This PR introduces the ability to delete multiple rows/columns from a table by selection them and hitting Backspace/Delete. The first backspace clears the content inside the selected cells, and the second deletes the cells.
Other improvements-
CellSelectionor not.Type of Change
Media
Screen.Recording.2025-07-16.at.18.47.42.mov
Summary by CodeRabbit
Refactor
New Features
Chores