[WIKI-550] improve : make emoji suggestion configurable #7418
Conversation
WalkthroughA new Changes
Sequence Diagram(s)sequenceDiagram
participant Consumer
participant EditorComponent
participant EditorHook
participant Extensions
participant EmojiExtension
Consumer->>EditorComponent: Pass showEmojiSuggestion prop
EditorComponent->>EditorHook: Pass showEmojiSuggestion
EditorHook->>Extensions: Pass showEmojiSuggestion
Extensions->>EmojiExtension: Configure with showSuggestion=showEmojiSuggestion
EmojiExtension->>EmojiExtension: Conditionally include/exclude Suggestion plugin
Possibly related PRs
Suggested labels
Suggested reviewers
Poem
📜 Recent review detailsConfiguration used: CodeRabbit UI 📒 Files selected for processing (1)
🚧 Files skipped from review as they are similar to previous changes (1)
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (1)
✨ Finishing Touches
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. 🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
SupportNeed help? Create a ticket on our support page for assistance with any issues or questions. Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments. CodeRabbit Commands (Invoked using PR comments)
Other keywords and placeholders
CodeRabbit Configuration File (
|
|
Pull Request Linked with Plane Work Items
Comment Automatically Generated by Plane |
VipinDevelops
changed the title
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 0
🧹 Nitpick comments (1)
packages/editor/src/core/extensions/emoji/extension.ts (1)
38-49: Clarify the comment for better accuracy.The implementation logic is correct - when
showSuggestionis false, it filters out the suggestion plugin (index 0). However, the comment on line 44 could be more accurate.- // Return only the emoji plugin (second plugin from parent) + // Filter out the suggestion plugin (first plugin from parent)The current comment suggests it returns only the second plugin, but the code actually filters out the first plugin and returns all remaining plugins (which happens to be just the emoji plugin in this case).
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (9)
packages/editor/src/core/components/editors/document/collaborative-editor.tsx(2 hunks)packages/editor/src/core/components/editors/editor-wrapper.tsx(2 hunks)packages/editor/src/core/extensions/emoji/emoji.ts(3 hunks)packages/editor/src/core/extensions/emoji/extension.ts(2 hunks)packages/editor/src/core/extensions/extensions.ts(3 hunks)packages/editor/src/core/hooks/use-collaborative-editor.ts(2 hunks)packages/editor/src/core/hooks/use-editor.ts(2 hunks)packages/editor/src/core/types/editor.ts(1 hunks)packages/editor/src/core/types/hook.ts(2 hunks)
🧰 Additional context used
🧬 Code Graph Analysis (2)
packages/editor/src/core/extensions/extensions.ts (1)
packages/editor/src/core/extensions/emoji/extension.ts (1)
EmojiExtension(12-55)
packages/editor/src/core/extensions/emoji/extension.ts (1)
packages/editor/src/core/extensions/emoji/emoji.ts (2)
EmojiOptions(70-76)Emoji(89-428)
🔇 Additional comments (11)
packages/editor/src/core/types/editor.ts (1)
143-143: LGTM! Well-structured type addition.The optional
showEmojiSuggestionproperty is properly typed and positioned within the interface. This enables backward compatibility while providing the new configuration option.packages/editor/src/core/components/editors/document/collaborative-editor.tsx (1)
42-42: LGTM! Consistent prop threading implementation.The
showEmojiSuggestionprop is properly extracted and passed through to theuseCollaborativeEditorhook, following the established pattern for other configuration props.Also applies to: 76-76
packages/editor/src/core/hooks/use-collaborative-editor.ts (1)
36-36: LGTM! Proper prop threading in collaborative editor hook.The
showEmojiSuggestionprop is correctly extracted and forwarded to theuseEditorhook, maintaining consistency with the established prop threading pattern.Also applies to: 117-117
packages/editor/src/core/extensions/emoji/emoji.ts (2)
18-18: LGTM! Good use of constants for maintainability.Using the
CORE_EXTENSIONS.EMOJIconstant instead of a hardcoded string improves consistency and maintainability across the codebase.Also applies to: 90-90
194-194: Double-check HTML export fallback image behavior for inline emojisAlthough we still surface
fallbackImagein markdown serialization, suggestion UI, and the emoji picker, the recent change inrenderHTML(packages/editor/src/core/extensions/emoji/emoji.ts) now always emits a<span>(no<img>fallback). This will prevent any inline HTML export from rendering custom emoji images.Please verify:
- That HTML exports of unsupported emojis no longer need
<img>fallbacks, or update them to handlefallbackImage.- Existing tests or integrations aren’t relying on inline
<img>tags for emojis.- Whether to add a new test for HTML serialization of emojis with
fallbackImage.- If the CSS selector for
span[data-type="emoji"] imgis now unused and should be cleaned up.packages/editor/src/core/components/editors/editor-wrapper.tsx (1)
41-41: LGTM! Completes the prop threading pattern in editor wrapper.The
showEmojiSuggestionprop is properly extracted and passed through to theuseEditorhook, completing the consistent prop threading implementation across the editor components.Also applies to: 63-63
packages/editor/src/core/types/hook.ts (1)
27-27: LGTM! Type definitions properly updated.The
showEmojiSuggestionproperty has been correctly added to bothTEditorHookPropsandTCollaborativeEditorHookPropstype definitions, ensuring type safety throughout the editor stack.Also applies to: 48-48
packages/editor/src/core/hooks/use-editor.ts (1)
45-45: LGTM! Prop properly threaded through the hook.The
showEmojiSuggestionprop is correctly extracted from the hook arguments and passed toCoreEditorExtensions, following the established pattern for other configuration props.Also applies to: 71-71
packages/editor/src/core/extensions/extensions.ts (1)
52-52: LGTM! Extension configuration properly implemented.The
showEmojiSuggestionprop is correctly added to the type definition, extracted from arguments, and passed to theEmojiExtensionconfiguration with a sensible default fallback (?? true).Also applies to: 68-68, 108-110
packages/editor/src/core/extensions/emoji/extension.ts (2)
8-18: LGTM! Interface and options properly extended.The
ExtendedEmojiOptionsinterface correctly extends the baseEmojiOptionswith the newshowSuggestionproperty, and theaddOptionsmethod properly adds this option with a sensible default value oftrue.
54-54: LGTM! Configuration properly sets the default.The
showSuggestionoption is correctly set totruein the extension configuration, maintaining consistency with the default value inaddOptions.
VipinDevelops
changed the title
VipinDevelops
changed the title
Description
This PR Make the emoji suggestion showing modal completely configurable and also refactor some part of code.
Type of Change
Summary by CodeRabbit
New Features
Refactor