Skip to content

Conversation

@aaryan610
Copy link
Member

@aaryan610 aaryan610 commented Jan 29, 2026

Description

This PR improves the drag preview logic for table rows and columns-

  1. The earlier approach of using attributes to toggle cell visibility is removed as it had a chance to persist across sessions and also broadcasted to other users.
  2. We now add decorations to each cell as a pseudo

Type of Change

  • Improvement (change that would cause existing functionality to not work as expected)

Summary by CodeRabbit

  • New Features

    • Enhanced table cell content visibility handling during drag operations for improved responsiveness.
  • Bug Fixes

    • Improved management of temporary content visibility states in table cells during drag-and-drop interactions.
  • Refactor

    • Streamlined table cell content hiding mechanism for better performance during table manipulation.

✏️ Tip: You can customize this high-level summary in your review settings.

@coderabbitai
Copy link
Contributor

coderabbitai bot commented Jan 29, 2026

📝 Walkthrough

Walkthrough

The changes refactor table cell content visibility management in a rich text editor. Instead of persisting hideContent attributes on table nodes, the system now uses ProseMirror decorations applied via a new TableDragStatePlugin, driven by transaction metadata. Old attributes are removed from HTML validators, node definitions, and rendering logic. Drag operations now compute selected cell positions and apply temporary visibility hiding through decorations rather than persistent node attributes.

Changes

Cohort / File(s) Summary
HTML Validator Configuration
apps/api/plane/utils/content_validator.py
Removed hideContent and hidecontent attribute whitelisting for HTML table header (th) and data (td) cells, narrowing allowed attributes for those tags.
Table Node Definitions
packages/editor/src/core/extensions/table/table-cell.ts, table-header.ts
Removed the hideContent attribute definition and eliminated conditional CSS class application based on node attributes in renderHTML for both cell and header nodes.
Drag-Handle Implementations
packages/editor/src/core/extensions/table/plugins/drag-handles/column/drag-handle.tsx, row/drag-handle.tsx
Replaced updateCellContentVisibility import and calls with showCellContent utility, updating visibility management in drag finish handlers.
Drag-Handle Utilities
packages/editor/src/core/extensions/table/plugins/drag-handles/column/utils.ts, row/utils.ts
Updated to import and use getSelectedCellPositions and hideCellContent functions; replaced direct attribute-based visibility with temporary decoration-based hiding of selected cells during drag preview construction.
Core Utilities & Plugin
packages/editor/src/core/extensions/table/plugins/drag-handles/utils.ts, drag-state.ts
Introduced new utility functions (getSelectedCellPositions, hideCellContent, showCellContent) and created TableDragStatePlugin to manage cell visibility via decorations and transaction metadata instead of persisted node attributes.
Plugin Registration
packages/editor/src/core/extensions/table/table/table.ts
Registered TableDragStatePlugin in the ProseMirror plugin pipeline for the table extension.

Sequence Diagram

sequenceDiagram
    participant Editor
    participant DragHandle as Drag Handle
    participant Utils as Cell Utils
    participant Plugin as TableDragStatePlugin
    participant Decorations as Decorations

    Note over Editor,Decorations: Drag Operation Initialization
    DragHandle->>Utils: constructDragPreview()
    Utils->>Utils: getSelectedCellPositions(selection, table)
    Utils->>Plugin: hideCellContent(editor, cellPositions)
    Plugin->>Plugin: updateTransactionMeta(tr, cellPositions)
    Plugin->>Decorations: Apply decorations with "content-hidden" class
    Decorations-->>Editor: Render cells with hidden content (local only)

    Note over Editor,Decorations: Drag Operation Completion
    DragHandle->>Utils: showCellContent(editor)
    Utils->>Plugin: showCellContent clears metadata
    Plugin->>Plugin: updateTransactionMeta(tr, null)
    Plugin->>Decorations: Clear decorations
    Decorations-->>Editor: Restore normal cell rendering
Loading

Estimated Code Review Effort

🎯 3 (Moderate) | ⏱️ ~20 minutes

Poem

🐰 A hop, skip, and a drag so fine,
Where cells now hide with decoration's design,
No more attributes on the table board,
Metadata whispers what to restore!

🚥 Pre-merge checks | ✅ 1 | ❌ 2
❌ Failed checks (1 warning, 1 inconclusive)
Check name Status Explanation Resolution
Docstring Coverage ⚠️ Warning Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%. Write docstrings for the functions missing them to satisfy the coverage threshold.
Description check ❓ Inconclusive The description is incomplete, cutting off mid-sentence in the second section without finishing the thought about decorations as a pseudo-element. Complete the description by finishing the sentence about decorations and providing fuller detail on the implementation approach and any behavioral changes.
✅ Passed checks (1 passed)
Check name Status Explanation
Title check ✅ Passed The title clearly and concisely describes the main refactoring change: replacing table drag preview implementation from attributes to decorations.

✏️ Tip: You can configure your own custom pre-merge checks in the settings.

✨ Finishing touches
  • 📝 Generate docstrings

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.

❤️ Share

Comment @coderabbitai help to get the list of available commands and usage tips.

Copy link
Contributor

Copilot AI left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

This PR refactors table row/column drag previews to use ProseMirror decorations instead of node attributes, ensuring drag-only visual states are local, non-persistent, and not broadcast to other users.

Changes:

  • Introduces a TableDragStatePlugin that applies a content-hidden decoration to selected table cells during drag operations.
  • Removes the hideContent attribute from table header and cell node schemas and from the HTML sanitization allowlist, relying solely on decorations and CSS for hiding content.
  • Updates row and column drag handle utilities/components to compute selected cell positions, hide them via the new plugin on drag start, and restore them on drag end.

Reviewed changes

Copilot reviewed 10 out of 10 changed files in this pull request and generated 1 comment.

Show a summary per file
File Description
packages/editor/src/core/extensions/table/table/table.ts Registers the new TableDragStatePlugin in the table extension’s ProseMirror plugins to manage drag-related decorations.
packages/editor/src/core/extensions/table/table-header.ts Simplifies TableHeader attrs and render logic by removing hideContent and the conditional content-hidden class.
packages/editor/src/core/extensions/table/table-cell.ts Removes hideContent from TableCell attrs and rendering, keeping only style-based background/text color configuration.
packages/editor/src/core/extensions/table/plugins/drag-state.ts Adds a dedicated plugin keyed by tableDragState that tracks hidden cell positions in transaction meta and applies/remaps content-hidden node decorations.
packages/editor/src/core/extensions/table/plugins/drag-handles/utils.ts Provides shared helpers to clone cells, compute selected cell positions, and hide/show cell content via transaction meta and CORE_EDITOR_META.ADD_TO_HISTORY.
packages/editor/src/core/extensions/table/plugins/drag-handles/row/utils.ts Refactors row drag preview construction to use getSelectedCellPositions/hideCellContent instead of node attribute updates.
packages/editor/src/core/extensions/table/plugins/drag-handles/row/drag-handle.tsx On row drag completion, clears drag/drop markers and restores cell visibility via showCellContent.
packages/editor/src/core/extensions/table/plugins/drag-handles/column/utils.ts Mirrors the row logic for columns, using decorations to hide selected column cells during drag preview.
packages/editor/src/core/extensions/table/plugins/drag-handles/column/drag-handle.tsx On column drag completion, removes markers and clears decoration-based hiding with showCellContent.
apps/api/plane/utils/content_validator.py Aligns HTML sanitization rules with the new model by removing hideContent/hidecontent from allowed <th>/<td> attributes.

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

export const showCellContent = (editor: Editor): void => {
const tr = editor.view.state.tr;
updateTransactionMeta(tr, null);
tr.setMeta(CORE_EDITOR_META.ADD_TO_HISTORY, true);
Copy link

Copilot AI Jan 29, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

showCellContent sets CORE_EDITOR_META.ADD_TO_HISTORY to true, whereas hideCellContent sets it to false and the previous updateCellContentVisibility helper always disabled history for these drag-only visibility changes. This makes the "show" operation behave differently from the previous implementation and from the "hide" operation, and may cause purely visual decoration updates to be recorded in the undo history. To keep drag-preview visibility changes invisible to undo/redo (as before), consider setting ADD_TO_HISTORY to false here as well.

Suggested change
tr.setMeta(CORE_EDITOR_META.ADD_TO_HISTORY, true);
tr.setMeta(CORE_EDITOR_META.ADD_TO_HISTORY, false);

Copilot uses AI. Check for mistakes.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants