Skip to content

feat: add block-editor app with BlockNote and Tiptap UI components#7

Open
Nihallllll wants to merge 1 commit intoAOSSIE-Org:mainfrom
Nihallllll:notion-edior
Open

feat: add block-editor app with BlockNote and Tiptap UI components#7
Nihallllll wants to merge 1 commit intoAOSSIE-Org:mainfrom
Nihallllll:notion-edior

Conversation

@Nihallllll
Copy link

Addressed Issues:

Added a notion-like editor
for the smart notes project

Screenshots/Recordings:

Screen.Recording.2026-03-03.095810.mp4

@coderabbitai
Copy link

coderabbitai bot commented Mar 3, 2026

Important

Review skipped

Too many files!

This PR contains 154 files, which is 4 over the limit of 150.

📥 Commits

Reviewing files that changed from the base of the PR and between 9e4e83e and 3993787.

⛔ Files ignored due to path filters (2)
  • apps/block-editor/public/vite.svg is excluded by !**/*.svg
  • apps/block-editor/src/assets/react.svg is excluded by !**/*.svg
📒 Files selected for processing (154)
  • apps/block-editor/.gitignore
  • apps/block-editor/@/components/tiptap-extension/node-background-extension.ts
  • apps/block-editor/@/components/tiptap-icons/align-center-icon.tsx
  • apps/block-editor/@/components/tiptap-icons/align-justify-icon.tsx
  • apps/block-editor/@/components/tiptap-icons/align-left-icon.tsx
  • apps/block-editor/@/components/tiptap-icons/align-right-icon.tsx
  • apps/block-editor/@/components/tiptap-icons/arrow-left-icon.tsx
  • apps/block-editor/@/components/tiptap-icons/ban-icon.tsx
  • apps/block-editor/@/components/tiptap-icons/blockquote-icon.tsx
  • apps/block-editor/@/components/tiptap-icons/bold-icon.tsx
  • apps/block-editor/@/components/tiptap-icons/chevron-down-icon.tsx
  • apps/block-editor/@/components/tiptap-icons/close-icon.tsx
  • apps/block-editor/@/components/tiptap-icons/code-block-icon.tsx
  • apps/block-editor/@/components/tiptap-icons/code2-icon.tsx
  • apps/block-editor/@/components/tiptap-icons/corner-down-left-icon.tsx
  • apps/block-editor/@/components/tiptap-icons/external-link-icon.tsx
  • apps/block-editor/@/components/tiptap-icons/heading-five-icon.tsx
  • apps/block-editor/@/components/tiptap-icons/heading-four-icon.tsx
  • apps/block-editor/@/components/tiptap-icons/heading-icon.tsx
  • apps/block-editor/@/components/tiptap-icons/heading-one-icon.tsx
  • apps/block-editor/@/components/tiptap-icons/heading-six-icon.tsx
  • apps/block-editor/@/components/tiptap-icons/heading-three-icon.tsx
  • apps/block-editor/@/components/tiptap-icons/heading-two-icon.tsx
  • apps/block-editor/@/components/tiptap-icons/highlighter-icon.tsx
  • apps/block-editor/@/components/tiptap-icons/image-plus-icon.tsx
  • apps/block-editor/@/components/tiptap-icons/italic-icon.tsx
  • apps/block-editor/@/components/tiptap-icons/link-icon.tsx
  • apps/block-editor/@/components/tiptap-icons/list-icon.tsx
  • apps/block-editor/@/components/tiptap-icons/list-ordered-icon.tsx
  • apps/block-editor/@/components/tiptap-icons/list-todo-icon.tsx
  • apps/block-editor/@/components/tiptap-icons/moon-star-icon.tsx
  • apps/block-editor/@/components/tiptap-icons/redo2-icon.tsx
  • apps/block-editor/@/components/tiptap-icons/strike-icon.tsx
  • apps/block-editor/@/components/tiptap-icons/subscript-icon.tsx
  • apps/block-editor/@/components/tiptap-icons/sun-icon.tsx
  • apps/block-editor/@/components/tiptap-icons/superscript-icon.tsx
  • apps/block-editor/@/components/tiptap-icons/trash-icon.tsx
  • apps/block-editor/@/components/tiptap-icons/underline-icon.tsx
  • apps/block-editor/@/components/tiptap-icons/undo2-icon.tsx
  • apps/block-editor/@/components/tiptap-node/blockquote-node/blockquote-node.scss
  • apps/block-editor/@/components/tiptap-node/code-block-node/code-block-node.scss
  • apps/block-editor/@/components/tiptap-node/heading-node/heading-node.scss
  • apps/block-editor/@/components/tiptap-node/horizontal-rule-node/horizontal-rule-node-extension.ts
  • apps/block-editor/@/components/tiptap-node/horizontal-rule-node/horizontal-rule-node.scss
  • apps/block-editor/@/components/tiptap-node/image-node/image-node.scss
  • apps/block-editor/@/components/tiptap-node/image-upload-node/image-upload-node-extension.ts
  • apps/block-editor/@/components/tiptap-node/image-upload-node/image-upload-node.scss
  • apps/block-editor/@/components/tiptap-node/image-upload-node/image-upload-node.tsx
  • apps/block-editor/@/components/tiptap-node/image-upload-node/index.tsx
  • apps/block-editor/@/components/tiptap-node/list-node/list-node.scss
  • apps/block-editor/@/components/tiptap-node/paragraph-node/paragraph-node.scss
  • apps/block-editor/@/components/tiptap-templates/simple/data/content.json
  • apps/block-editor/@/components/tiptap-templates/simple/simple-editor.scss
  • apps/block-editor/@/components/tiptap-templates/simple/simple-editor.tsx
  • apps/block-editor/@/components/tiptap-templates/simple/theme-toggle.tsx
  • apps/block-editor/@/components/tiptap-ui-primitive/badge/badge-colors.scss
  • apps/block-editor/@/components/tiptap-ui-primitive/badge/badge-group.scss
  • apps/block-editor/@/components/tiptap-ui-primitive/badge/badge.scss
  • apps/block-editor/@/components/tiptap-ui-primitive/badge/badge.tsx
  • apps/block-editor/@/components/tiptap-ui-primitive/badge/index.tsx
  • apps/block-editor/@/components/tiptap-ui-primitive/button/button-colors.scss
  • apps/block-editor/@/components/tiptap-ui-primitive/button/button-group.scss
  • apps/block-editor/@/components/tiptap-ui-primitive/button/button.scss
  • apps/block-editor/@/components/tiptap-ui-primitive/button/button.tsx
  • apps/block-editor/@/components/tiptap-ui-primitive/button/index.tsx
  • apps/block-editor/@/components/tiptap-ui-primitive/card/card.scss
  • apps/block-editor/@/components/tiptap-ui-primitive/card/card.tsx
  • apps/block-editor/@/components/tiptap-ui-primitive/card/index.tsx
  • apps/block-editor/@/components/tiptap-ui-primitive/dropdown-menu/dropdown-menu.scss
  • apps/block-editor/@/components/tiptap-ui-primitive/dropdown-menu/dropdown-menu.tsx
  • apps/block-editor/@/components/tiptap-ui-primitive/dropdown-menu/index.tsx
  • apps/block-editor/@/components/tiptap-ui-primitive/input/index.tsx
  • apps/block-editor/@/components/tiptap-ui-primitive/input/input.scss
  • apps/block-editor/@/components/tiptap-ui-primitive/input/input.tsx
  • apps/block-editor/@/components/tiptap-ui-primitive/popover/index.tsx
  • apps/block-editor/@/components/tiptap-ui-primitive/popover/popover.scss
  • apps/block-editor/@/components/tiptap-ui-primitive/popover/popover.tsx
  • apps/block-editor/@/components/tiptap-ui-primitive/separator/index.tsx
  • apps/block-editor/@/components/tiptap-ui-primitive/separator/separator.scss
  • apps/block-editor/@/components/tiptap-ui-primitive/separator/separator.tsx
  • apps/block-editor/@/components/tiptap-ui-primitive/spacer/index.tsx
  • apps/block-editor/@/components/tiptap-ui-primitive/spacer/spacer.tsx
  • apps/block-editor/@/components/tiptap-ui-primitive/toolbar/index.tsx
  • apps/block-editor/@/components/tiptap-ui-primitive/toolbar/toolbar.scss
  • apps/block-editor/@/components/tiptap-ui-primitive/toolbar/toolbar.tsx
  • apps/block-editor/@/components/tiptap-ui-primitive/tooltip/index.tsx
  • apps/block-editor/@/components/tiptap-ui-primitive/tooltip/tooltip.scss
  • apps/block-editor/@/components/tiptap-ui-primitive/tooltip/tooltip.tsx
  • apps/block-editor/@/components/tiptap-ui/blockquote-button/blockquote-button.tsx
  • apps/block-editor/@/components/tiptap-ui/blockquote-button/index.tsx
  • apps/block-editor/@/components/tiptap-ui/blockquote-button/use-blockquote.ts
  • apps/block-editor/@/components/tiptap-ui/code-block-button/code-block-button.tsx
  • apps/block-editor/@/components/tiptap-ui/code-block-button/index.tsx
  • apps/block-editor/@/components/tiptap-ui/code-block-button/use-code-block.ts
  • apps/block-editor/@/components/tiptap-ui/color-highlight-button/color-highlight-button.scss
  • apps/block-editor/@/components/tiptap-ui/color-highlight-button/color-highlight-button.tsx
  • apps/block-editor/@/components/tiptap-ui/color-highlight-button/index.tsx
  • apps/block-editor/@/components/tiptap-ui/color-highlight-button/use-color-highlight.ts
  • apps/block-editor/@/components/tiptap-ui/color-highlight-popover/color-highlight-popover.tsx
  • apps/block-editor/@/components/tiptap-ui/color-highlight-popover/index.tsx
  • apps/block-editor/@/components/tiptap-ui/heading-button/heading-button.tsx
  • apps/block-editor/@/components/tiptap-ui/heading-button/index.tsx
  • apps/block-editor/@/components/tiptap-ui/heading-button/use-heading.ts
  • apps/block-editor/@/components/tiptap-ui/heading-dropdown-menu/heading-dropdown-menu.tsx
  • apps/block-editor/@/components/tiptap-ui/heading-dropdown-menu/index.tsx
  • apps/block-editor/@/components/tiptap-ui/heading-dropdown-menu/use-heading-dropdown-menu.ts
  • apps/block-editor/@/components/tiptap-ui/image-upload-button/image-upload-button.tsx
  • apps/block-editor/@/components/tiptap-ui/image-upload-button/index.tsx
  • apps/block-editor/@/components/tiptap-ui/image-upload-button/use-image-upload.ts
  • apps/block-editor/@/components/tiptap-ui/link-popover/index.tsx
  • apps/block-editor/@/components/tiptap-ui/link-popover/link-popover.tsx
  • apps/block-editor/@/components/tiptap-ui/link-popover/use-link-popover.ts
  • apps/block-editor/@/components/tiptap-ui/list-button/index.tsx
  • apps/block-editor/@/components/tiptap-ui/list-button/list-button.tsx
  • apps/block-editor/@/components/tiptap-ui/list-button/use-list.ts
  • apps/block-editor/@/components/tiptap-ui/list-dropdown-menu/index.tsx
  • apps/block-editor/@/components/tiptap-ui/list-dropdown-menu/list-dropdown-menu.tsx
  • apps/block-editor/@/components/tiptap-ui/list-dropdown-menu/use-list-dropdown-menu.ts
  • apps/block-editor/@/components/tiptap-ui/mark-button/index.tsx
  • apps/block-editor/@/components/tiptap-ui/mark-button/mark-button.tsx
  • apps/block-editor/@/components/tiptap-ui/mark-button/use-mark.ts
  • apps/block-editor/@/components/tiptap-ui/text-align-button/index.tsx
  • apps/block-editor/@/components/tiptap-ui/text-align-button/text-align-button.tsx
  • apps/block-editor/@/components/tiptap-ui/text-align-button/use-text-align.ts
  • apps/block-editor/@/components/tiptap-ui/undo-redo-button/index.tsx
  • apps/block-editor/@/components/tiptap-ui/undo-redo-button/undo-redo-button.tsx
  • apps/block-editor/@/components/tiptap-ui/undo-redo-button/use-undo-redo.ts
  • apps/block-editor/@/hooks/use-composed-ref.ts
  • apps/block-editor/@/hooks/use-cursor-visibility.ts
  • apps/block-editor/@/hooks/use-element-rect.ts
  • apps/block-editor/@/hooks/use-is-breakpoint.ts
  • apps/block-editor/@/hooks/use-menu-navigation.ts
  • apps/block-editor/@/hooks/use-scrolling.ts
  • apps/block-editor/@/hooks/use-throttled-callback.ts
  • apps/block-editor/@/hooks/use-tiptap-editor.ts
  • apps/block-editor/@/hooks/use-unmount.ts
  • apps/block-editor/@/hooks/use-window-size.ts
  • apps/block-editor/@/lib/tiptap-utils.ts
  • apps/block-editor/@/styles/_keyframe-animations.scss
  • apps/block-editor/@/styles/_variables.scss
  • apps/block-editor/README.md
  • apps/block-editor/eslint.config.js
  • apps/block-editor/index.html
  • apps/block-editor/package.json
  • apps/block-editor/src/App.css
  • apps/block-editor/src/App.tsx
  • apps/block-editor/src/editors/BlockNoteEditor.tsx
  • apps/block-editor/src/index.css
  • apps/block-editor/src/main.tsx
  • apps/block-editor/src/scss.d.ts
  • apps/block-editor/tsconfig.app.json
  • apps/block-editor/tsconfig.json
  • apps/block-editor/tsconfig.node.json
  • apps/block-editor/vite.config.ts

You can disable this status message by setting the reviews.review_status to false in the CodeRabbit configuration file.

Use the checkbox below for a quick retry:

  • 🔍 Trigger review
✨ Finishing Touches
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Post copyable unit tests in a comment

Tip

Try Coding Plans. Let us write the prompt for your AI agent so you can ship faster (with fewer bugs).
Share your feedback on Discord.


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.

@Chethan-Regala
Copy link

Thanks for the detailed block editor implementation — the UI and TipTap integration look very comprehensive.

One architectural question I had while reading the code: SmartNotes is designed around a filesystem vault with Markdown notes, but the current editor path initializes internal block structures and doesn’t yet show a clear Markdown serialization pipeline.

Do we expect Markdown to remain the canonical storage format, or will the editor JSON become the primary persisted representation?

It might help to define a small adapter boundary early (e.g. loadMarkdown → editorState → getMarkdown) so the editor layer can integrate cleanly with the vault storage and future indexing pipeline.

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