Skip to content

fix: disable default UI when no components context is found#2611

Merged
nperez0111 merged 2 commits intomainfrom
raw-view-default-ui-disable
Apr 13, 2026
Merged

fix: disable default UI when no components context is found#2611
nperez0111 merged 2 commits intomainfrom
raw-view-default-ui-disable

Conversation

@matthewlipski
Copy link
Copy Markdown
Collaborator

@matthewlipski matthewlipski commented Mar 31, 2026

Summary

When using BlockNoteViewRaw to create a minimal editor, errors are thrown when the editor attempts to render default UI elements as there is no components context to create them from. This PR makes it so that if no component context is found when rendering the editor, all default UI elements are disabled.

Note however that this is not a supported use case and we do not expect BlockNoteViewRaw to be used on its own.

Closes #889

Rationale

While this use case is not officially supported, BlockNoteViewRaw is exported and may be useful to some.

Changes

See above.

Impact

N/A

Testing

Because this is not something we officially support, no tests have been added.

Screenshots/Video

N/A

Checklist

  • Code follows the project's coding standards.
  • Unit tests covering the new feature have been added.
  • All existing tests pass.
  • The documentation has been updated to reflect the new feature

Additional Notes

Summary by CodeRabbit

  • Refactor
    • UI feature defaults now respect surrounding component context instead of being forcibly applied, ensuring feature toggles align with host environment.
    • Default UI settings are memoized with simplified dependencies to reduce unnecessary re-renders and improve performance.

@vercel
Copy link
Copy Markdown

vercel bot commented Mar 31, 2026

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

Project Deployment Actions Updated (UTC)
blocknote Ready Ready Preview Apr 13, 2026 11:39am
blocknote-website Ready Ready Preview Apr 13, 2026 11:39am

Request Review

@coderabbitai
Copy link
Copy Markdown

coderabbitai bot commented Mar 31, 2026

Caution

Review failed

The pull request is closed.

ℹ️ Recent review info
⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: 4832601f-804c-4188-a14b-315219882f80

📥 Commits

Reviewing files that changed from the base of the PR and between aab6e54 and 93865e5.

📒 Files selected for processing (1)
  • packages/react/src/editor/BlockNoteView.tsx

📝 Walkthrough

Walkthrough

BlockNoteViewComponent now reads the components context via useComponentsContext() and builds a memoized defaultUIProps. For several UI feature props, incoming values are forwarded when context exists; when context is absent those props are forced to false. The context memoization now depends on defaultUIProps.

Changes

Cohort / File(s) Summary
UI Prop Defaulting Logic
packages/react/src/editor/BlockNoteView.tsx
Adds useComponentsContext() and a memoized defaultUIProps. For formattingToolbar, linkToolbar, sideMenu, slashMenu, filePanel, tableHandles, emojiPicker, and comments, incoming values are forwarded if a components context exists; otherwise those props are set to false. Replaces multiple useMemo dependencies with a single defaultUIProps dependency for BlockNoteViewContext.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~10 minutes

Poem

🐇 I peeked for a context, warm and small,
If none was near, I hid each toolbar and all.
If friends were present, I left choices be —
Quiet view for reading, or full UI spree. ✨

🚥 Pre-merge checks | ✅ 3 | ❌ 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 addresses most template sections: Summary, Rationale, Changes, and Impact are provided. However, it contains a contradiction—stating no tests were added while the checklist claims tests were added and existing tests pass. Clarify the testing status: explicitly state whether tests were added or explain why the checklist items conflict with the 'no tests' statement in the Testing section.
✅ Passed checks (3 passed)
Check name Status Explanation
Title check ✅ Passed The title clearly and concisely describes the main fix: disabling default UI when no components context exists, which aligns with the primary objective of the changeset.
Linked Issues check ✅ Passed The PR addresses issue #889 by disabling default UI elements when no components context is found, preventing errors in minimal/readonly editor scenarios as requested.
Out of Scope Changes check ✅ Passed All changes are scoped to BlockNoteViewComponent's context-aware UI disabling logic, directly supporting the objective of fixing errors when BlockNoteViewRaw is used without components context.

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

✨ Finishing Touches
📝 Generate docstrings
  • Create stacked PR
  • Commit on current branch
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Commit unit tests in branch raw-view-default-ui-disable

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.

@pkg-pr-new
Copy link
Copy Markdown

pkg-pr-new bot commented Mar 31, 2026

Open in StackBlitz

@blocknote/ariakit

npm i https://pkg.pr.new/@blocknote/ariakit@2611

@blocknote/code-block

npm i https://pkg.pr.new/@blocknote/code-block@2611

@blocknote/core

npm i https://pkg.pr.new/@blocknote/core@2611

@blocknote/mantine

npm i https://pkg.pr.new/@blocknote/mantine@2611

@blocknote/react

npm i https://pkg.pr.new/@blocknote/react@2611

@blocknote/server-util

npm i https://pkg.pr.new/@blocknote/server-util@2611

@blocknote/shadcn

npm i https://pkg.pr.new/@blocknote/shadcn@2611

@blocknote/xl-ai

npm i https://pkg.pr.new/@blocknote/xl-ai@2611

@blocknote/xl-docx-exporter

npm i https://pkg.pr.new/@blocknote/xl-docx-exporter@2611

@blocknote/xl-email-exporter

npm i https://pkg.pr.new/@blocknote/xl-email-exporter@2611

@blocknote/xl-multi-column

npm i https://pkg.pr.new/@blocknote/xl-multi-column@2611

@blocknote/xl-odt-exporter

npm i https://pkg.pr.new/@blocknote/xl-odt-exporter@2611

@blocknote/xl-pdf-exporter

npm i https://pkg.pr.new/@blocknote/xl-pdf-exporter@2611

commit: aab6e54

Copy link
Copy Markdown
Contributor

@nperez0111 nperez0111 left a comment

Choose a reason for hiding this comment

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

I think this is fine default

Copy link
Copy Markdown

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

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

Actionable comments posted: 1

🧹 Nitpick comments (1)
packages/react/src/editor/BlockNoteView.tsx (1)

142-167: Please add regression coverage for the no-components-context path.

This behavior is subtle and easy to regress. A focused test for BlockNoteViewRaw without ComponentsContext (including explicit UI-prop toggles) would lock the fix in.

I can draft the test cases if you want.

🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed.

In `@packages/react/src/editor/BlockNoteView.tsx` around lines 142 - 167, Add a
regression test that mounts/renders BlockNoteViewRaw (the raw component used in
BlockNoteView) without wrapping it in ComponentsContext (i.e., ensure
useComponentsContext returns undefined) and verify the computed default UI props
from the BlockNoteDefaultUIProps logic: assert that when individual UI props
(formattingToolbar, linkToolbar, sideMenu, slashMenu, filePanel, tableHandles,
emojiPicker, comments) are left undefined they resolve to false in the
no-components-context path, and that explicitly passed true/false prop values
are respected; create focused cases for all toggles so the behavior in
useComponentsContext and the defaultUIProps memo block is covered and guarded
against regressions.
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.

Inline comments:
In `@packages/react/src/editor/BlockNoteView.tsx`:
- Around line 146-154: The current nullish-coalescing logic (e.g.,
formattingToolbar: formattingToolbar ?? (componentsContext ? undefined : false))
still allows an explicit true prop to enable UI when componentsContext is
missing; update each entry (formattingToolbar, linkToolbar, sideMenu, slashMenu,
filePanel, tableHandles, emojiPicker, comments) to first check componentsContext
and force false when it's absent, otherwise use the prop (or undefined) — i.e.,
if componentsContext is falsy return false unconditionally, else return the prop
(or undefined) so passing true cannot re-enable controllers without a
componentsContext.

---

Nitpick comments:
In `@packages/react/src/editor/BlockNoteView.tsx`:
- Around line 142-167: Add a regression test that mounts/renders
BlockNoteViewRaw (the raw component used in BlockNoteView) without wrapping it
in ComponentsContext (i.e., ensure useComponentsContext returns undefined) and
verify the computed default UI props from the BlockNoteDefaultUIProps logic:
assert that when individual UI props (formattingToolbar, linkToolbar, sideMenu,
slashMenu, filePanel, tableHandles, emojiPicker, comments) are left undefined
they resolve to false in the no-components-context path, and that explicitly
passed true/false prop values are respected; create focused cases for all
toggles so the behavior in useComponentsContext and the defaultUIProps memo
block is covered and guarded against regressions.
🪄 Autofix (Beta)

❌ Autofix failed (check again to retry)

Fix all unresolved CodeRabbit comments on this PR:

  • Push a commit to this branch (recommended)
  • Create a new PR with the fixes

ℹ️ Review info
⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: 8fe448a5-f87d-478f-8062-286ec17d644d

📥 Commits

Reviewing files that changed from the base of the PR and between 4bb2d64 and aab6e54.

📒 Files selected for processing (1)
  • packages/react/src/editor/BlockNoteView.tsx

@coderabbitai
Copy link
Copy Markdown

coderabbitai bot commented Apr 13, 2026

Note

Autofix is a beta feature. Expect some limitations and changes as we gather feedback and continue to improve it.

❌ Failed to clone repository into sandbox. Please try again.

…ntext

The previous nullish-coalescing logic allowed an explicit `true` prop to
bypass the componentsContext check. Now componentsContext is checked first
so UI controllers are always disabled when no components context exists.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
@nperez0111 nperez0111 changed the title fix: Disable default UI when no components context is found fix: disable default UI when no components context is found Apr 13, 2026
@nperez0111 nperez0111 merged commit de956e8 into main Apr 13, 2026
1 of 5 checks passed
@nperez0111 nperez0111 deleted the raw-view-default-ui-disable branch April 13, 2026 11:35
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.

Error on readonly editor - TypeError: Cannot read properties of undefined (reading 'FormattingToolbar')

2 participants