Th1nkmore/workspace editor: Replace original rich text editor with tiptap support.#43
Draft
Th1nkMore wants to merge 18 commits intofeat/workspacefrom
Draft
Th1nkmore/workspace editor: Replace original rich text editor with tiptap support.#43Th1nkMore wants to merge 18 commits intofeat/workspacefrom
Th1nkMore wants to merge 18 commits intofeat/workspacefrom
Conversation
- Added new dependencies for Tiptap and Radix UI components. - Integrated Tiptap as the rich text editor in WorkspaceContainer. - Updated global styles to include SCSS variables and animations.
…tor logic and improve AI integration - Moved markdown to HTML and HTML to markdown conversion functions into a new EditorComponent. - Enhanced AI menu handling and selection updates. - Updated editor initialization and content synchronization logic. - Removed deprecated code and improved overall readability.
…files. - Added fileId prop to RichTextEditorTiptap for unique identification during editor remounting.
…ph selections and ensure proper list wrapping
…orTiptap - Introduced projectId prop in RichTextEditorTiptap for handling project-specific image uploads. - Updated image upload logic to include projectId in API requests. - Enhanced image upload node to accept projectId for better organization of uploaded images. - Implemented backend support for image uploads associated with specific projects.
…n RichTextEditorTiptap
Note: the editing state needs to be maintain more carefully later on.. - Introduced AI diff functionality with visual indicators for text changes. - Updated selection handling to use `selectionFrom` and `selectionTo` for improved clarity. - Added callbacks for editor initialization and integrated AI diff confirmation and cancellation logic. - Refactored editor component to streamline AI editing process and improve user experience.
…or better selection handling - Enhanced selection handling for empty and multi-block selections in blockquote and code block toggles. - Refactored code to streamline the toggle logic and ensure proper selection updates. - Improved user experience by maintaining focus and selection state after toggling.
- Added LineNumberGutter component to display line numbers alongside the editor content. - Updated layout to accommodate line numbers, improving the overall editing experience. - Refactored editor component structure for better readability and maintainability.
- Introduced logic to calculate the position of the AI diff button dynamically based on text insertion. - Enhanced the editor's responsiveness by ensuring the AI diff button appears correctly during text edits.
…des for improved spacing
- Introduced logic to detect AI diff marks in the document and extract relevant information for undo/redo functionality. - Added state management for restored AI edit state to improve user experience during text edits. - Updated AI diff button positioning logic to accommodate new state handling. - Refactored editor component to streamline AI editing process and ensure accurate display of AI diff indicators.
…pport, remove unnecessary complexity introduced by turndown. Also enable style rendering while AI editing diff. - Added @tiptap/markdown dependency to enable markdown parsing and serialization in the editor. - Removed TurndownService and related markdown conversion logic to streamline the editor's functionality. - Updated editor component to utilize the new markdown extension for improved handling of markdown content. - Enhanced text selection and insertion logic to support markdown formatting, ensuring a better editing experience.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
This pull request introduces a new Tiptap-based rich text editor to the workspace, replacing the previous editor component, and adds several new features and improvements to the editing experience. It also includes a new Tiptap extension for setting node background colors and a suite of SVG icon components for the editor toolbar. Additionally, it improves the file selection logic to ensure content and selection state stay in sync, and updates global styles to import new SCSS variables and animations.
Rich Text Editor Integration and Improvements
RichTextEditorwith the newRichTextEditorTiptapcomponent inWorkspaceContainer, updating props and integration logic to support the new editor and its features.Tiptap Extensions and Features
node-background-extension.ts, allowing users to set, unset, and toggle background colors for various node types (paragraphs, headings, etc.) via editor commands.Editor Toolbar Icons
Styling
globals.cssto import new SCSS variables and keyframe animations, ensuring consistent theming and animation support across the app.