Conversation
…figuration and setup
❌ Issue Linking RequiredThis PR could not be linked to an issue. All PRs must be linked to an issue for tracking purposes. How to fix this:Option 1: Add keyword to PR body (Recommended - auto-removes this comment)
Why is this required?Issue linking ensures proper tracking, documentation, and helps maintain project history. It connects your code changes to the problem they solve.--- This comment was automatically generated by the issue linking workflow |
github-actions
Bot
added
the
Area : Frontend
|
Claude finished @rjvelazco's task in 2m 9s —— View job PR Review
IssuesBlockers1. 2. readonly editor: Editor = new Editor({
extensions: createEditorExtensions(
this.menuService,
parseAllowedBlocks(this.field()), // this.field() is always undefined here
this.injector
)
});
High Risk3. Local filesystem path committed — Personal dev reference; remove before merge. 4. Experimental flag committed to workspace settings — 5. No tests — 7,000+ lines added, one broken spec. CVA contract, slash menu, upload pipeline, and all dialogs are untested. Already flagged by prior review; still a blocker per Correctness6. Null-unsafe outputToObservable(this.blockEditorCompare?.valueChange)
7. query: `+contentType:${variable} ...`The rest of the service calls 8. Minor9. 10. 11. The |
|
Rollback Safety Analysis - Safe to Roll Back. All 9 changed files are frontend Angular config only (new-block-editor library scaffold). Label AI: Safe To Rollback applied. |
… the new Block Editor V1
…older enhancements
…d error handling and empty state management
![cursor[bot]](https://avatars.githubusercontent.com/in/1210556?s=60&v=4){kind=small}
There was a problem hiding this comment.
Cursor Bugbot has reviewed your changes and found 4 potential issues.
Bugbot Autofix is kicking off a free cloud agent to fix these issues. This run is complimentary, but you can enable autofix for all future PRs in the Cursor dashboard.
Reviewed by Cursor Bugbot for commit 77fd1d1. Configure here.
| this.commandFn = null; | ||
| // isOpen and clientRectFn unchanged — menu is already visible and positioned | ||
| }); | ||
| } |
There was a problem hiding this comment.
Commented-out state updates cause stale menu display
Medium Severity
In openSubmenu(), the lines this.items.set([]), this.activeIndex.set(0), and this.isLoading.set(true) are all commented out. Similarly in setItems(), this.activeIndex.set(0) and this.isLoading.set(false) are commented out. This means the loading spinner never appears during async content-type fetches, stale items from the previous menu remain visible while loading, and activeIndex isn't reset when new sub-menu items arrive — risking an out-of-bounds selection on Enter.
Additional Locations (1)
Reviewed by Cursor Bugbot for commit 77fd1d1. Configure here.
| } | ||
| }) | ||
| ] | ||
| }; |
There was a problem hiding this comment.
Unused library files: app config, routes, and spec
Low Severity
app.config.ts, app.routes.ts, and app.spec.ts in libs/new-block-editor/src/lib/ are never imported by anything in the codebase. The app.config.ts sets up provideRouter with empty routes and PrimeNG theming that no consumer uses. The app.spec.ts tests App for an h1 containing "Hello, block-editor" which doesn't exist in the actual App template. These appear to be leftover scaffolding files.
Additional Locations (2)
Reviewed by Cursor Bugbot for commit 77fd1d1. Configure here.
| user-select: none !important; | ||
| } | ||
|
|
||
| code { |
There was a problem hiding this comment.
Shared global code CSS removed affecting other consumers
Medium Severity
The global code element styling (color, background, padding, font-family, line-break) was removed from the shared styles.scss in libs/dotcms-scss/angular/. This is a shared stylesheet imported by multiple applications, not just the block editor. Removing this rule may break code element rendering across all consuming apps that relied on this global style.
Reviewed by Cursor Bugbot for commit 77fd1d1. Configure here.
…o dialogs, enhancing search and display functionality
|
You have used all of your free Bugbot PR reviews. To receive reviews on all of your PRs, visit the Cursor dashboard to activate Pro and start your 14-day free trial. |
Rollback Safety Analysis
|
|
Rollback Safety Analysis - Safe to Roll Back. All 57 changed files are frontend Angular/TypeScript only (new-block-editor library scaffold, block-editor app refactor, SCSS, package.json). No database migrations, Elasticsearch mapping changes, API contract changes, or any backend code modified. Label AI: Safe To Rollback applied. |
…ity and image properties form
…gle grid extension and enhance resizing capabilities
Legal RiskThe following dependencies were released under a license that RecommendationWhile merging is not directly blocked, it's best to pause and consider what it means to use this license before continuing. If you are unsure, reach out to your security team or Semgrep admin to address this issue. GPL-2.0 MPL-2.0 |
…proved store management, and updated slash menu functionality - Added a comprehensive porting checklist for tracking features in the new block editor. - Introduced EditorStore for managing editor state, including allowed block types and language ID. - Updated slash menu service to utilize the new store for block type filtering. - Refactored image and video extensions to use consistent node names. - Improved editor component with additional input properties for better integration with dotCMS content types. - Cleaned up unused code and comments in editor click handling. This commit enhances the overall functionality and maintainability of the new block editor.
…ta and improved upload process
- Replaced `EditorComponent` with `DotCMSEditorComponent` across various files for consistency. - Removed unused global styles from `styles.css` and added new styles to `editor.component.css`. - Introduced a new block options constant for better management of allowed blocks in the editor settings. - Updated toolbar icons to use the correct Material Icons set. - Improved the handling of editor content normalization and state management. This refactor aims to streamline the block editor's structure and improve maintainability.
…date references - Added support for the new "Material Symbols Outlined" font, including its CSS and SCSS definitions. - Updated existing components to utilize the new font for toolbar icons, replacing legacy Material Icons references. - Renamed legacy Material Icons to clarify their status as outdated. This update enhances the iconography in the block editor, aligning with the latest design standards.
…ments - Introduced functions to stringify editor content as ProseMirror JSON and check for content matches. - Updated the editor to emit JSON on changes instead of HTML, aligning with the new data handling approach. - Enhanced the toolbar component with PrimeNG's Select for block type selection, improving user experience. - Updated slash menu icons to use Material Symbols for better visual consistency. - Adjusted styles for toolbar and menu items for improved layout and accessibility. This update improves the editor's functionality and user interface, preparing for future enhancements.
…omponents - Introduced auto-focus functionality for the first focusable element in the editor dialog after rendering. - Removed unnecessary focus methods from image, link, table, and video dialog components, centralizing focus logic in the editor dialog. - Updated documentation to reflect changes in the dialog's opened output behavior, allowing for more flexible post-open logic. This refactor improves the user experience by ensuring that dialogs are more accessible and easier to navigate upon opening.
- Introduced a new `data` attribute for the DotContentlet node, consolidating contentlet attributes into a single object for improved serialization and management. - Updated the editor component to utilize the new `ContentletData` structure, simplifying data handling and enhancing performance. - Refactored the slash menu to insert contentlets using the new data format, ensuring backward compatibility with legacy attributes. - Enhanced the editor toolbar state service to accommodate the new data structure, improving the selection and management of contentlets. This update streamlines contentlet integration within the editor, preparing for future enhancements and improving overall code maintainability.
- Introduced a new Angular node view for contentlets, enhancing the rendering and interaction within the editor. - Refactored the contentlet extension to utilize the new node view, improving the structure and maintainability of the code. - Updated the editor component and extensions to accommodate the new contentlet structure, ensuring seamless integration with existing features. - Removed the legacy contentlet extension file, consolidating functionality into the new structure. This update enhances the editor's capability to manage contentlets, paving the way for future improvements and a more robust editing experience.
…ling - Added new dialog components for image, video, link, table, and emoji selection, improving the user experience for media insertion. - Refactored existing editor components to utilize the new dialog structure, ensuring a more modular and maintainable codebase. - Updated the slash menu to support new content types and improved integration with the editor's dialog management system. - Enhanced focus handling and accessibility features across all dialog components, ensuring a smoother user interaction. This update significantly enhances the media handling capabilities of the editor, paving the way for future improvements and a more robust editing experience.
- Added a new AI content dialog component for generating text using AI, enhancing the editor's capabilities. - Integrated the AI content node into the editor, allowing users to insert AI-generated content seamlessly. - Refactored existing services to support the new AI functionality, including the addition of a dedicated AI service for handling requests. - Updated the slash menu to include an option for AI content generation, improving accessibility and user experience. This update significantly enhances the editor's functionality by enabling AI-driven content creation, paving the way for more dynamic and engaging user interactions.
Code review (AI-assisted, posted by @zJaaal via Claude)
OverviewStandalone-bootstraps What looks good
Blockers
Strong concerns
Smaller items
RecommendationDon't merge as-is (also marked WIP). Address blockers 1–3, publish a TipTap v3 round-trip plan against existing stored content, and add at minimum smoke tests over the CVA contract, the upload pipeline, and the slash menu before this becomes the default editor. 🤖 Generated with Claude Code |
…nhanced scroll handling
… options to toolbar buttons
…e drag image handling
…m element and update main.ts for demo content handling
…bility and reset margin/padding for nested elements
…tter host compatibility
2 participants
WIP
Videos
video.mov
video.mov
Note
High Risk
High risk because this is a large refactor that swaps the block editor app to a new standalone editor implementation, upgrades TipTap/ngx-tiptap major versions, and adds dotCMS upload/search integrations including a hardcoded auth token/base URL in code.
Overview
Replaces the
dotcms-block-editorapp’s NgModule-based bootstrap with Angular standalonebootstrapApplicationand points the app at the newEditorComponentexported from@dotcms/new-block-editor, alongside updated Angular build target config (new executor/outputPath structure, dev config, baseHref).Adds a new
new-block-editorlibrary implementing an experimental TipTap v3-based editor with slash menu, toolbar, drag-handle gutter, link/image/video/table dialogs, emoji picker, upload placeholders, and dotCMS-backed asset/content-type search + upload services.Updates global styling for the new editor UI (Tailwind layers, typography plugin, Material Symbols, TipTap/table/link/upload-placeholder styles) and bumps editor-related dependencies (TipTap v3,
ngx-tiptap, Floating UI, emoji-mart); also removes a shared SCSScodestyle block.Reviewed by Cursor Bugbot for commit 77fd1d1. Bugbot is set up for automated code reviews on this repo. Configure here.