diff --git a/webapp/channels/src/components/advanced_text_editor/advanced_text_editor.tsx b/webapp/channels/src/components/advanced_text_editor/advanced_text_editor.tsx index dd172778bd..3d572815ad 100644 --- a/webapp/channels/src/components/advanced_text_editor/advanced_text_editor.tsx +++ b/webapp/channels/src/components/advanced_text_editor/advanced_text_editor.tsx @@ -311,11 +311,13 @@ const AdvancedTextEditor = ({ setServerError, isInEditMode, ); + + const emojiPickerOffset = isInEditMode ? {right: 40} : undefined; const { emojiPicker, enableEmojiPicker, toggleEmojiPicker, - } = useEmojiPicker(isDisabled, draft, caretPosition, setCaretPosition, handleDraftChange, showPreview, focusTextbox); + } = useEmojiPicker(isDisabled, draft, caretPosition, setCaretPosition, handleDraftChange, showPreview, focusTextbox, emojiPickerOffset); const { labels: priorityLabels, additionalControl: priorityAdditionalControl, diff --git a/webapp/channels/src/components/advanced_text_editor/use_emoji_picker.tsx b/webapp/channels/src/components/advanced_text_editor/use_emoji_picker.tsx index 2970249241..0f617deaab 100644 --- a/webapp/channels/src/components/advanced_text_editor/use_emoji_picker.tsx +++ b/webapp/channels/src/components/advanced_text_editor/use_emoji_picker.tsx @@ -32,6 +32,7 @@ const useEmojiPicker = ( handleDraftChange: (draft: PostDraft) => void, shouldShowPreview: boolean, focusTextbox: () => void, + emojiPickerOffset?: {right?: number}, ) => { const intl = useIntl(); @@ -127,6 +128,7 @@ const useEmojiPicker = ( onGifClick={handleGifClick} enableGifPicker={enableGifPicker} topOffset={-7} + rightOffset={emojiPickerOffset?.right} />