Merge pull request #38 from raralabs/disign-fix

fix: removing mentions which is selected
raralabs · Mar 29, 2023 · 6ee0a14 · 6ee0a14
2 parents 800b0c4 + 9a3c74d
commit 6ee0a14
Show file tree

Hide file tree

Showing 3 changed files with 40 additions and 34 deletions.
diff --git a/src/components/RaraEditor/RaraEditor.tsx b/src/components/RaraEditor/RaraEditor.tsx
@@ -253,44 +253,47 @@ const RaraEditor = (props: RaraEditorProps) => {
                 e.type === 'insert_node' && e?.node?.type === 'mention'
             );
 
-            const removeMentionUser = edtr.find(
+            const removeMentionUser = edtr.filter(
               (e: BaseOperation): e is RemoveNodeOperation =>
                 e.type === 'remove_node' && (e?.node?.type === 'mention' || e?.node?.text === ""),
             );
             const mentionContact = edtr.find(
               (e: BaseOperation): e is BaseInsertNodeOperation =>
                 e.type === 'insert_node' && e?.node?.type === 'mentionContact'
             );
-            const removeMentionContact = edtr.find(
+            const removeMentionContact = edtr.filter(
               (e: BaseOperation): e is RemoveNodeOperation =>
-                e.type === 'remove_node' && e?.node?.type === 'mentionContact'
+                e.type === 'remove_node' && (e?.node?.type === 'mentionContact' || e?.node?.text === "")
             );
             if (mentionUser) {
               setMentionUsers((pre: any) => [...pre, mentionUser?.node?.id]);
             }
 
-            if (removeMentionUser) {
+            if (removeMentionUser.length > 0) {
               // console.log({editor,edtr});
               let last
               let newLast
               const setSelection = edtr.filter((e:BaseOperation):e is SelectionOperation => e.type === 'set_selection')
-              console.log({setSelection});
 
-
-              setMentionUsers((pre: string[] | number[]) => [
-                ...removeById(pre, removeMentionUser?.node?.id!),
-              ]);
-              last =  removeMentionUser.path[removeMentionUser.path.length -1] - 1  ,
-              newLast = [...removeMentionUser.path],
-             newLast[removeMentionUser.path.length - 1] = last,
+              for(let i=0; i<removeMentionUser.length ; i++)
+              {
+                setMentionUsers((pre: string[]) => [
+                  ...removeById(pre, removeMentionUser[i].node.id!),
+                ]);
+              }
+
+              last =  removeMentionUser[0].path[removeMentionUser[0].path.length -1] - 1  ,
+              newLast = [...removeMentionUser[0].path],
+             newLast[removeMentionUser[0].path.length - 1] = last,
               Transforms.select(editor, {
                 anchor: Editor.end(editor, {
-                  path: setSelection ? setSelection[0]?.newProperties?.anchor?.path! : [...newLast],
+                  path: setSelection ? setSelection[0]?.newProperties?.anchor ?setSelection[0]?.newProperties?.anchor.path :setSelection[0]?.newProperties?.focus?.path! : [...newLast],
                   offset: edtr[0].type === "remove_text" ? edtr[0].offset : 0
                 }),
 
                 focus: Editor.end(editor, {
-                  path: setSelection ? setSelection[0]?.newProperties?.anchor?.path!  : [...newLast],
+                  path: setSelection ? setSelection[0]?.newProperties?.anchor ?setSelection[0]?.newProperties?.anchor.path :setSelection[0]?.newProperties?.focus?.path! : [...newLast],
+
 
                   offset: edtr[0].type === "remove_text" ? edtr[0].offset : 0
                 })
@@ -304,29 +307,33 @@ const RaraEditor = (props: RaraEditorProps) => {
               ]);
             }
 
-            if (removeMentionContact) {
+            if (removeMentionContact.length > 0) {
 
               let last
               let newLast
-              setMentionContacts((pre: string[] | number[]) => [
-                ...removeById(pre, removeMentionContact?.node?.id!),
-                last =  removeMentionContact.path[removeMentionContact.path.length -1] - 1,
-                newLast = [...removeMentionContact.path],
-               newLast[removeMentionContact.path.length - 1] = last,
-                Transforms.select(editor, {
-                  anchor: Editor.end(editor, {
-                    path: [...newLast],
-                    offset: edtr[0].type === "remove_text" ? edtr[0].offset : 0
-
-                  }),
-
-                  focus: Editor.end(editor, {
-                    path: [...newLast],
-                    offset: edtr[0].type === "remove_text" ? edtr[0].offset : 0
+              for(let i=0; i<removeMentionContact.length ; i++){
+
+                setMentionContacts((pre: string[]) => [
+                  ...removeById(pre, removeMentionContact[i].node.id!),
+
+                ]);
+              }
+              last =  removeMentionContact[0].path[removeMentionContact[0].path.length -1] - 1,
+              newLast = [...removeMentionContact[0].path],
+             newLast[removeMentionContact[0].path.length - 1] = last,
+              Transforms.select(editor, {
+                anchor: Editor.end(editor, {
+                  path: [...newLast],
+                  offset: edtr[0].type === "remove_text" ? edtr[0].offset : 0
 
-                  })
                 }),
-              ]);
+
+                focus: Editor.end(editor, {
+                  path: [...newLast],
+                  offset: edtr[0].type === "remove_text" ? edtr[0].offset : 0
+
+                })
+              });
             }
           }
         }}

diff --git a/src/components/Toolbar/TextAlignMarkers.tsx b/src/components/Toolbar/TextAlignMarkers.tsx
@@ -5,6 +5,7 @@ import { isBlockActive, toggleBlock } from '../../lib/functions';
 import { useToolbar } from './context/useLayout';
 import { MarkerItem } from './Markers';
 
+
 interface TextAlignMarkerProps {}
 
 export const TextAlignMarkers = ({}: TextAlignMarkerProps) => {

diff --git a/src/lib/functions.tsx b/src/lib/functions.tsx
@@ -32,13 +32,11 @@ export const insertMention = async(
     children: [{ text: '' }],
   };
 // setTimeout(() => {
-  console.log({editor});
   Transforms.insertText(editor," ")
 
    Transforms.insertNodes(editor, mention);
   Transforms.move(editor);
   const last = target.anchor.path[target.anchor.path.length - 1] + 2; //TODO: 2 because insert didn't update yet, i.e. it happens too fast
-  console.log({last},target.anchor.path);
 
   const newLast = [...target.anchor.path];
   newLast[target.anchor.path.length - 1] = last;