Skip to content

fix(files): render the file-viewer placeholder through the live node views - #6379

Merged
waleedlatif1 merged 2 commits into
stagingfrom
fix/file-viewer-reflow-on-load
Aug 7, 2026
Merged

fix(files): render the file-viewer placeholder through the live node views#6379
waleedlatif1 merged 2 commits into
stagingfrom
fix/file-viewer-reflow-on-load

Conversation

@waleedlatif1

@waleedlatif1 waleedlatif1 commented Aug 7, 2026

Copy link
Copy Markdown
Collaborator

Summary

  • The collaborative markdown viewer painted a static generateHTML placeholder while the Yjs doc seeded, then swapped to the live editor. generateHTML runs only schema renderHTML — never the React node views or decoration plugins — so content repainted on the swap: syntax highlighting popped in, mention-chip icons shifted their labels, mermaid blocks jumped from source to diagram, and media embeds appeared out of nowhere.
  • Render the placeholder through a read-only editor that shares the live editor's extension set instead. It uses the same node views and decoration plugins, so the placeholder is pixel-identical to the live editor and the swap neither repaints nor reflows.
  • Highlighting, mention icons, images, mermaid (via its existing SVG cache), and embeds (which already reserve their aspect-ratio box) all render up front. The placeholder carries no Collaboration extension, Y.Doc, or awareness, so it structurally cannot write to the shared document (seed-only-on-server preserved); editable={false} disables every editing affordance.

Type of Change

  • Bug fix

Testing

  • 521 rich-markdown-editor unit tests pass; type-check clean.
  • Known inherent residual: the very first render of a never-before-rendered mermaid diagram is async (one bounded reflow); every render after that is instant via the process-lifetime SVG cache.

Checklist

  • Code follows project style guidelines
  • Self-reviewed my changes
  • Tests added/updated and passing
  • No new warnings introduced
  • I confirm that I have read and agree to the terms outlined in the Contributor License Agreement (CLA)

…views

The collaborative markdown viewer painted a static generateHTML placeholder while
the Yjs doc seeded, then swapped to the live editor. generateHTML runs only schema
renderHTML — never the React node views or the ProseMirror decoration plugins — so
every node whose live appearance comes from a node view or a decoration rendered
differently in the placeholder and visibly repainted on the swap: syntax highlighting
popped in, mention-chip icons shifted their labels, mermaid blocks jumped from source
to diagram, and media embeds appeared out of nowhere.

Render the placeholder through a read-only editor that shares the live editor's
extension set instead. It uses the same node views and decoration plugins, so the
placeholder is pixel-identical to the live editor and the swap neither repaints nor
reflows — highlighting, mention icons, images, mermaid (via its existing SVG cache),
and embeds (which already reserve their aspect-ratio box) all render up front. The
placeholder editor carries no Collaboration extension, Y.Doc, or awareness, so it
structurally cannot write to the shared document, preserving the seed-only-on-server
invariant; editable={false} disables every editing affordance.
@vercel

vercel Bot commented Aug 7, 2026

Copy link
Copy Markdown

The latest updates on your projects. Learn more about Vercel for GitHub.

1 Skipped Deployment
Project Deployment Actions Updated (UTC)
docs Skipped Skipped Aug 7, 2026 5:53pm

Request Review

@cursor

cursor Bot commented Aug 7, 2026

Copy link
Copy Markdown

PR Summary

Low Risk
Localized UI rendering change in the file markdown viewer; no persistence, auth, or collaboration protocol changes beyond avoiding duplicate client seeding (already an invariant).

Overview
Fixes a visual jump when collaborative markdown files switch from the pre-seed placeholder to the live editor. The placeholder no longer uses generateHTML static markup (which skips React node views and decoration plugins).

While the Yjs doc seeds, content is shown through a new ReadOnlyPlaceholder — a read-only TipTap instance using the same EXTENSIONS as the live editor (syntax highlighting, mention chips, mermaid, embeds). It has no Collaboration/Y.Doc, so it cannot seed or write the shared document. EDITOR_SURFACE_CLASS keeps layout identical between placeholder and live EditorContent so the swap does not reflow.

Placeholder state moves from placeholderHtml to parsed placeholderContent (JSONContent); the live editor stays hidden until collabReady.

Reviewed by Cursor Bugbot for commit 98ed8bc. Configure here.

@greptile-apps

greptile-apps Bot commented Aug 7, 2026

Copy link
Copy Markdown
Contributor

Greptile Summary

The PR replaces the collaborative markdown file viewer’s static HTML placeholder with a read-only TipTap editor using the live editor’s extensions and shared surface styling.

  • Adds a named props interface for the read-only placeholder.
  • Uses shared node views and decoration plugins during collaboration startup.
  • Consolidates placeholder and live-editor layout classes to minimize swap reflow.

Confidence Score: 5/5

The PR appears safe to merge.

No blocking failure remains.

Important Files Changed

Filename Overview
apps/sim/app/workspace/[workspaceId]/files/components/file-viewer/rich-markdown-editor/rich-markdown-editor.tsx Replaces static generated placeholder HTML with a non-editable editor and correctly resolves the previous named-props-interface feedback.

Reviews (2): Last reviewed commit: "fix(files): address review on the placeh..." | Re-trigger Greptile

- Give ReadOnlyPlaceholder a named props interface (repo component convention).
- Render the placeholder synchronously (immediatelyRender: true) so it paints
  instantly like the static HTML it replaced instead of blanking for a frame
  while the editor mounts — safe because this surface is client-only, never SSR'd.
- Hoist the editor reading-column classes into a shared EDITOR_SURFACE_CLASS so
  the placeholder and live editor stay geometrically identical (drop the now
  redundant placeholderContent term from the live editor's hidden class).
@waleedlatif1

Copy link
Copy Markdown
Collaborator Author

@greptile

@waleedlatif1

Copy link
Copy Markdown
Collaborator Author

@cursor review

@cursor cursor Bot left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

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

✅ Bugbot reviewed your changes and found no new issues!

Comment @cursor review or bugbot run to trigger another review on this PR

Reviewed by Cursor Bugbot for commit 98ed8bc. Configure here.

@waleedlatif1
waleedlatif1 merged commit eec3c35 into staging Aug 7, 2026
31 checks passed
@waleedlatif1
waleedlatif1 deleted the fix/file-viewer-reflow-on-load branch August 7, 2026 18:02
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant