From 3809700f177d5587f0ddbcd15664dce5871b7da1 Mon Sep 17 00:00:00 2001
From: mgabdev <>
Date: Thu, 31 Dec 2020 18:48:35 -0500
Subject: [PATCH] Fixed issue with cursor position in Composer, fixes emoji
 picker postioning
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

• Fixed:
- issue with cursor position in Composer, fixes emoji picker postioning
---
 app/javascript/gabsocial/actions/compose.js               | 3 +--
 app/javascript/gabsocial/components/composer.js           | 8 ++++++--
 .../gabsocial/components/popover/emoji_picker_popover.js  | 2 +-
 app/javascript/gabsocial/reducers/compose.js              | 5 +++--
 4 files changed, 11 insertions(+), 7 deletions(-)

diff --git a/app/javascript/gabsocial/actions/compose.js b/app/javascript/gabsocial/actions/compose.js
index b0e0938c..f2ac547b 100644
--- a/app/javascript/gabsocial/actions/compose.js
+++ b/app/javascript/gabsocial/actions/compose.js
@@ -670,10 +670,9 @@ export const changeComposeVisibility = (value) => ({
 /**
  * 
  */
-export const insertEmojiCompose = (emoji, needsSpace) => ({
+export const insertEmojiCompose = (emoji) => ({
   type: COMPOSE_EMOJI_INSERT,
   emoji,
-  needsSpace,
 })
 
 /**
diff --git a/app/javascript/gabsocial/components/composer.js b/app/javascript/gabsocial/components/composer.js
index 9615c17c..36e81778 100644
--- a/app/javascript/gabsocial/components/composer.js
+++ b/app/javascript/gabsocial/components/composer.js
@@ -175,13 +175,17 @@ class Composer extends React.PureComponent {
       plainText: value,
     })
 
-    const selectionState = editorState.getSelection()
+    const selectionState = editorState.getSelection()  
+    const currentBlockKey = selectionState.getStartKey()
+    const currentBlockIndex = blocks.findIndex((k) => k.key === currentBlockKey)
+    const priorBlockTextLength = blocks.splice(0, currentBlockIndex).map(block => (!block.text.trim() && '') || block.text).join('\n').length
     const selectionStart = selectionState.getStartOffset()
+    const cursorPosition = priorBlockTextLength + selectionStart
 
     const rawObject = convertToRaw(content)
     const markdownString = this.props.isPro ? draftToMarkdown(rawObject,markdownOptions) : null
 
-    this.props.onChange(null, value, markdownString, selectionStart)
+    this.props.onChange(null, value, markdownString, cursorPosition)
   }
 
   handleOnFocus = () => {
diff --git a/app/javascript/gabsocial/components/popover/emoji_picker_popover.js b/app/javascript/gabsocial/components/popover/emoji_picker_popover.js
index 619dce9c..affb0129 100644
--- a/app/javascript/gabsocial/components/popover/emoji_picker_popover.js
+++ b/app/javascript/gabsocial/components/popover/emoji_picker_popover.js
@@ -285,7 +285,7 @@ const mapDispatchToProps = (dispatch) => ({
 
   onPickEmoji: (emoji) => {
     dispatch(useEmoji(emoji))
-    dispatch(insertEmojiCompose(emoji, false))
+    dispatch(insertEmojiCompose(emoji))
   },
 })
 
diff --git a/app/javascript/gabsocial/reducers/compose.js b/app/javascript/gabsocial/reducers/compose.js
index b34e207b..3af28f72 100644
--- a/app/javascript/gabsocial/reducers/compose.js
+++ b/app/javascript/gabsocial/reducers/compose.js
@@ -179,8 +179,9 @@ const updateSuggestionTags = (state, token) => {
   });
 };
 
-const insertEmoji = (state, emojiData, needsSpace) => {
+const insertEmoji = (state, emojiData) => {
   const position = state.get('caretPosition')
+  const needsSpace = !!emojiData.custom && position !== 0
   const oldText = state.get('text');
   const emoji = needsSpace ? ' ' + emojiData.native : emojiData.native;
 
@@ -365,7 +366,7 @@ export default function compose(state = initialState, action) {
       return state;
     }
   case COMPOSE_EMOJI_INSERT:
-    return insertEmoji(state, action.emoji, action.needsSpace);
+    return insertEmoji(state, action.emoji);
   case COMPOSE_UPLOAD_CHANGE_SUCCESS:
     return state
       .set('is_changing_upload', false)