From c151c3c6d7079d8fa2298b9c972d04cb38b49bc8 Mon Sep 17 00:00:00 2001
From: Aman Harwara <amanharwara@protonmail.com>
Date: Tue, 5 Mar 2024 19:39:49 +0530
Subject: [PATCH] chore: fix issue with sibling lists not being merged
 correctly in Super [skip e2e]

---
 packages/web/package.json                     |  1 +
 .../Components/SuperEditor/BlocksEditor.tsx   |  2 ++
 .../Plugins/MergeSiblingListsPlugin.tsx       | 23 +++++++++++++++++++
 yarn.lock                                     |  1 +
 4 files changed, 27 insertions(+)
 create mode 100644 packages/web/src/javascripts/Components/SuperEditor/Plugins/MergeSiblingListsPlugin.tsx

diff --git a/packages/web/package.json b/packages/web/package.json
index 0fc0a7683..ca618680f 100644
--- a/packages/web/package.json
+++ b/packages/web/package.json
@@ -110,6 +110,7 @@
   "dependencies": {
     "@ariakit/react": "^0.3.9",
     "@lexical/headless": "0.13.1",
+    "@lexical/list": "0.13.1",
     "@radix-ui/react-slot": "^1.0.1",
     "@react-pdf/renderer": "^3.3.2",
     "comlink": "^4.4.1",
diff --git a/packages/web/src/javascripts/Components/SuperEditor/BlocksEditor.tsx b/packages/web/src/javascripts/Components/SuperEditor/BlocksEditor.tsx
index b2014c957..b17a0f30f 100644
--- a/packages/web/src/javascripts/Components/SuperEditor/BlocksEditor.tsx
+++ b/packages/web/src/javascripts/Components/SuperEditor/BlocksEditor.tsx
@@ -35,6 +35,7 @@ import { SearchPlugin } from './Plugins/SearchPlugin/SearchPlugin'
 import AutoLinkPlugin from './Plugins/AutoLinkPlugin/AutoLinkPlugin'
 import DatetimePlugin from './Plugins/DateTimePlugin/DateTimePlugin'
 import PasswordPlugin from './Plugins/PasswordPlugin/PasswordPlugin'
+import { MergeSiblingListsPlugin } from './Plugins/MergeSiblingListsPlugin'
 
 type BlocksEditorProps = {
   onChange?: (value: string, preview: string) => void
@@ -116,6 +117,7 @@ export const BlocksEditor: FunctionComponent<BlocksEditorProps> = ({
       </div>
       {isMobile && <ToolbarPlugin />}
       <ListPlugin />
+      <MergeSiblingListsPlugin />
       <MarkdownShortcutPlugin transformers={MarkdownTransformers} />
       <TablePlugin hasCellMerge />
       <OnChangePlugin onChange={handleChange} ignoreSelectionChange={true} />
diff --git a/packages/web/src/javascripts/Components/SuperEditor/Plugins/MergeSiblingListsPlugin.tsx b/packages/web/src/javascripts/Components/SuperEditor/Plugins/MergeSiblingListsPlugin.tsx
new file mode 100644
index 000000000..deb10a664
--- /dev/null
+++ b/packages/web/src/javascripts/Components/SuperEditor/Plugins/MergeSiblingListsPlugin.tsx
@@ -0,0 +1,23 @@
+import { ListNode, $isListNode } from '@lexical/list'
+import { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext'
+import { useEffect } from 'react'
+
+function mergeListNodesTransform(node: ListNode) {
+  const nextSibling = node.getNextSibling()
+
+  if ($isListNode(nextSibling) && $isListNode(node) && nextSibling.getListType() === node.getListType()) {
+    node.append(...nextSibling.getChildren())
+    nextSibling.remove()
+  }
+}
+
+// https://github.com/facebook/lexical/issues/4618
+export function MergeSiblingListsPlugin() {
+  const [editor] = useLexicalComposerContext()
+
+  useEffect(() => {
+    return editor.registerNodeTransform(ListNode, mergeListNodesTransform)
+  }, [editor])
+
+  return null
+}
diff --git a/yarn.lock b/yarn.lock
index 7ae57a2ec..c048475f6 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -7682,6 +7682,7 @@ __metadata:
     "@babel/preset-env": "*"
     "@babel/preset-typescript": ^7.21.5
     "@lexical/headless": 0.13.1
+    "@lexical/list": 0.13.1
     "@lexical/react": 0.13.1
     "@pmmmwh/react-refresh-webpack-plugin": ^0.5.10
     "@radix-ui/react-slot": ^1.0.1