Fix export issue regarding clone

standardnotes · Dec 31, 2024 · c008278 · c008278
1 parent 110c9f2
commit c008278
Show file tree

Hide file tree

Showing 8 changed files with 135 additions and 121 deletions.
diff --git a/packages/web/src/javascripts/Components/SuperEditor/Lexical/Nodes/FileExportNode.tsx b/packages/web/src/javascripts/Components/SuperEditor/Lexical/Nodes/FileExportNode.tsx
@@ -1,6 +1,6 @@
 import { DecoratorBlockNode, SerializedDecoratorBlockNode } from '@lexical/react/LexicalDecoratorBlockNode'
 import { parseAndCreateZippableFileName } from '@standardnotes/utils'
-import { DOMExportOutput, Spread } from 'lexical'
+import { DOMExportOutput, ElementFormatType, NodeKey, Spread } from 'lexical'
 
 type SerializedFileExportNode = Spread<
   {
@@ -20,14 +20,14 @@ export class FileExportNode extends DecoratorBlockNode {
     return 'file-export'
   }
 
-  constructor(name: string, mimeType: string) {
-    super()
+  constructor(name: string, mimeType: string, format?: ElementFormatType, key?: NodeKey) {
+    super(format, key)
     this.__name = name
     this.__mimeType = mimeType
   }
 
   static clone(node: FileExportNode): FileExportNode {
-    return new FileExportNode(node.__name, node.__mimeType)
+    return new FileExportNode(node.__name, node.__mimeType, node.__format, node.__key)
   }
 
   static importJSON(serializedNode: SerializedFileExportNode): FileExportNode {

diff --git a/packages/web/src/javascripts/Components/SuperEditor/Lexical/Nodes/TweetNode.tsx b/packages/web/src/javascripts/Components/SuperEditor/Lexical/Nodes/TweetNode.tsx
@@ -127,6 +127,11 @@ export class TweetNode extends DecoratorBlockNode {
     return 'tweet'
   }
 
+  constructor(id: string, format?: ElementFormatType, key?: NodeKey) {
+    super(format, key)
+    this.__id = id
+  }
+
   static override clone(node: TweetNode): TweetNode {
     return new TweetNode(node.__id, node.__format, node.__key)
   }
@@ -168,11 +173,6 @@ export class TweetNode extends DecoratorBlockNode {
     return { element }
   }
 
-  constructor(id: string, format?: ElementFormatType, key?: NodeKey) {
-    super(format, key)
-    this.__id = id
-  }
-
   getId(): string {
     return this.__id
   }

diff --git a/packages/web/src/javascripts/Components/SuperEditor/Lexical/Nodes/YouTubeNode.tsx b/packages/web/src/javascripts/Components/SuperEditor/Lexical/Nodes/YouTubeNode.tsx
@@ -72,6 +72,11 @@ export class YouTubeNode extends DecoratorBlockNode {
     return 'youtube'
   }
 
+  constructor(id: string, format?: ElementFormatType, key?: NodeKey) {
+    super(format, key)
+    this.__id = id
+  }
+
   static clone(node: YouTubeNode): YouTubeNode {
     return new YouTubeNode(node.__id, node.__format, node.__key)
   }
@@ -121,11 +126,6 @@ export class YouTubeNode extends DecoratorBlockNode {
     }
   }
 
-  constructor(id: string, format?: ElementFormatType, key?: NodeKey) {
-    super(format, key)
-    this.__id = id
-  }
-
   updateDOM(): false {
     return false
   }

diff --git a/.../javascripts/Components/SuperEditor/Plugins/CollapsiblePlugin/CollapsibleContainerNode.ts b/.../javascripts/Components/SuperEditor/Plugins/CollapsiblePlugin/CollapsibleContainerNode.ts
@@ -44,14 +44,14 @@ export class CollapsibleContainerNode extends ElementNode {
     this.__open = open ?? false
   }
 
-  static override getType(): string {
-    return 'collapsible-container'
-  }
-
   static override clone(node: CollapsibleContainerNode): CollapsibleContainerNode {
     return new CollapsibleContainerNode(node.__open, node.__key)
   }
 
+  static override getType(): string {
+    return 'collapsible-container'
+  }
+
   override createDOM(_: EditorConfig, editor: LexicalEditor): HTMLElement {
     const dom = document.createElement('details')
     dom.classList.add('Collapsible__container')

diff --git a/...web/src/javascripts/Components/SuperEditor/Plugins/EncryptedFilePlugin/Nodes/FileNode.tsx b/...web/src/javascripts/Components/SuperEditor/Plugins/EncryptedFilePlugin/Nodes/FileNode.tsx
@@ -13,6 +13,12 @@ export class FileNode extends DecoratorBlockNode implements ItemNodeInterface {
     return 'snfile'
   }
 
+  constructor(id: string, format?: ElementFormatType, key?: NodeKey, zoomLevel?: number) {
+    super(format, key)
+    this.__id = id
+    this.__zoomLevel = zoomLevel || 100
+  }
+
   static clone(node: FileNode): FileNode {
     return new FileNode(node.__id, node.__format, node.__key, node.__zoomLevel)
   }
@@ -56,12 +62,6 @@ export class FileNode extends DecoratorBlockNode implements ItemNodeInterface {
     return { element }
   }
 
-  constructor(id: string, format?: ElementFormatType, key?: NodeKey, zoomLevel?: number) {
-    super(format, key)
-    this.__id = id
-    this.__zoomLevel = zoomLevel || 100
-  }
-
   getId(): string {
     return this.__id
   }

diff --git a/...es/web/src/javascripts/Components/SuperEditor/Plugins/InlineFilePlugin/InlineFileNode.tsx b/...es/web/src/javascripts/Components/SuperEditor/Plugins/InlineFilePlugin/InlineFileNode.tsx
@@ -1,5 +1,14 @@
 import { DecoratorBlockNode, SerializedDecoratorBlockNode } from '@lexical/react/LexicalDecoratorBlockNode'
-import { DOMConversionMap, DOMExportOutput, EditorConfig, LexicalEditor, LexicalNode, Spread } from 'lexical'
+import {
+  DOMConversionMap,
+  DOMExportOutput,
+  EditorConfig,
+  ElementFormatType,
+  LexicalEditor,
+  LexicalNode,
+  NodeKey,
+  Spread,
+} from 'lexical'
 import InlineFileComponent from './InlineFileComponent'
 
 type SerializedInlineFileNode = Spread<
@@ -22,15 +31,15 @@ export class InlineFileNode extends DecoratorBlockNode {
     return 'inline-file'
   }
 
-  constructor(src: string, mimeType: string, fileName: string | undefined) {
-    super()
+  constructor(src: string, mimeType: string, fileName: string | undefined, format?: ElementFormatType, key?: NodeKey) {
+    super(format, key)
     this.__src = src
     this.__mimeType = mimeType
     this.__fileName = fileName
   }
 
   static clone(node: InlineFileNode): InlineFileNode {
-    return new InlineFileNode(node.__src, node.__mimeType, node.__fileName)
+    return new InlineFileNode(node.__src, node.__mimeType, node.__fileName, node.__format, node.__key)
   }
 
   static importJSON(serializedNode: SerializedInlineFileNode): InlineFileNode {

diff --git a/.../web/src/javascripts/Components/SuperEditor/Plugins/RemoteImagePlugin/RemoteImageNode.tsx b/.../web/src/javascripts/Components/SuperEditor/Plugins/RemoteImagePlugin/RemoteImageNode.tsx
@@ -1,5 +1,14 @@
 import { DecoratorBlockNode, SerializedDecoratorBlockNode } from '@lexical/react/LexicalDecoratorBlockNode'
-import { DOMConversionMap, DOMExportOutput, EditorConfig, LexicalEditor, LexicalNode, Spread } from 'lexical'
+import {
+  DOMConversionMap,
+  DOMExportOutput,
+  EditorConfig,
+  ElementFormatType,
+  LexicalEditor,
+  LexicalNode,
+  NodeKey,
+  Spread,
+} from 'lexical'
 import RemoteImageComponent from './RemoteImageComponent'
 
 type SerializedRemoteImageNode = Spread<
@@ -20,14 +29,14 @@ export class RemoteImageNode extends DecoratorBlockNode {
     return 'unencrypted-image'
   }
 
-  constructor(src: string, alt?: string) {
-    super()
+  constructor(src: string, alt?: string, format?: ElementFormatType, key?: NodeKey) {
+    super(format, key)
     this.__src = src
     this.__alt = alt
   }
 
   static clone(node: RemoteImageNode): RemoteImageNode {
-    return new RemoteImageNode(node.__src, node.__alt)
+    return new RemoteImageNode(node.__src, node.__alt, node.__format, node.__key)
   }
 
   static importJSON(serializedNode: SerializedRemoteImageNode): RemoteImageNode {

diff --git a/packages/web/src/javascripts/Components/SuperEditor/Tools/HeadlessSuperConverter.tsx b/packages/web/src/javascripts/Components/SuperEditor/Tools/HeadlessSuperConverter.tsx
@@ -73,107 +73,103 @@ export class HeadlessSuperConverter implements SuperConverterServiceInterface {
     let content: string | undefined
 
     await new Promise<void>((resolve) => {
-      this.exportEditor.update(
-        () => {
-          if (embedBehavior === 'reference') {
-            resolve()
-            return
-          }
-          if (!getFileItem) {
-            resolve()
-            return
-          }
-          const filenameCounts: Record<string, number> = {}
-          Promise.all(
-            $dfs().map(async ({ node: fileNode }) => {
-              if (!$isFileNode(fileNode)) {
-                return
-              }
-              const fileItem = getFileItem(fileNode.getId())
-              if (!fileItem) {
+      const handleFileNodes = () => {
+        if (embedBehavior === 'reference') {
+          resolve()
+          return
+        }
+        if (!getFileItem) {
+          resolve()
+          return
+        }
+        const filenameCounts: Record<string, number> = {}
+        Promise.all(
+          $dfs().map(async ({ node: fileNode }) => {
+            if (!$isFileNode(fileNode)) {
+              return
+            }
+            const fileItem = getFileItem(fileNode.getId())
+            if (!fileItem) {
+              return
+            }
+            const canInlineFileType = toFormat === 'pdf' ? fileItem.mimeType.startsWith('image/') : true
+            if (embedBehavior === 'inline' && getFileBase64 && canInlineFileType) {
+              const fileBase64 = await getFileBase64(fileNode.getId())
+              if (!fileBase64) {
                 return
               }
-              const canInlineFileType = toFormat === 'pdf' ? fileItem.mimeType.startsWith('image/') : true
-              if (embedBehavior === 'inline' && getFileBase64 && canInlineFileType) {
-                const fileBase64 = await getFileBase64(fileNode.getId())
-                if (!fileBase64) {
-                  return
-                }
-                this.exportEditor.update(
-                  () => {
-                    const inlineFileNode = $createInlineFileNode(fileBase64, fileItem.mimeType, fileItem.name)
-                    fileNode.replace(inlineFileNode)
-                  },
-                  { discrete: true },
-                )
-              } else {
-                this.exportEditor.update(
-                  () => {
-                    filenameCounts[fileItem.name] =
-                      filenameCounts[fileItem.name] == undefined ? 0 : filenameCounts[fileItem.name] + 1
+              this.exportEditor.update(
+                () => {
+                  const inlineFileNode = $createInlineFileNode(fileBase64, fileItem.mimeType, fileItem.name)
+                  fileNode.replace(inlineFileNode)
+                },
+                { discrete: true },
+              )
+            } else {
+              this.exportEditor.update(
+                () => {
+                  filenameCounts[fileItem.name] =
+                    filenameCounts[fileItem.name] == undefined ? 0 : filenameCounts[fileItem.name] + 1
 
-                    let name = fileItem.name
+                  let name = fileItem.name
 
-                    if (filenameCounts[name] > 0) {
-                      const { name: _name, ext } = parseFileName(name)
-                      name = `${_name}-${fileItem.uuid}.${ext}`
-                    }
+                  if (filenameCounts[name] > 0) {
+                    const { name: _name, ext } = parseFileName(name)
+                    name = `${_name}-${fileItem.uuid}.${ext}`
+                  }
 
-                    const fileExportNode = $createFileExportNode(name, fileItem.mimeType)
-                    fileNode.replace(fileExportNode)
-                  },
-                  { discrete: true },
-                )
-              }
-            }),
-          )
-            .then(() => resolve())
-            .catch(console.error)
-        },
-        { discrete: true },
-      )
+                  const fileExportNode = $createFileExportNode(name, fileItem.mimeType)
+                  fileNode.replace(fileExportNode)
+                },
+                { discrete: true },
+              )
+            }
+          }),
+        )
+          .then(() => resolve())
+          .catch(console.error)
+      }
+      this.exportEditor.update(handleFileNodes, { discrete: true })
     })
 
     await new Promise<void>((resolve) => {
-      this.exportEditor.update(
-        () => {
-          switch (toFormat) {
-            case 'txt':
-            case 'md': {
-              for (const { node: paragraph } of $dfs()) {
-                if (!$isParagraphNode(paragraph)) {
-                  continue
-                }
-                if (paragraph.isEmpty()) {
-                  paragraph.remove()
-                }
+      const convertToFormat = () => {
+        switch (toFormat) {
+          case 'txt':
+          case 'md': {
+            for (const { node: paragraph } of $dfs()) {
+              if (!$isParagraphNode(paragraph)) {
+                continue
+              }
+              if (paragraph.isEmpty()) {
+                paragraph.remove()
               }
-              content = $convertToMarkdownString(MarkdownTransformers)
-              resolve()
-              break
             }
-            case 'html':
-              content = $generateHtmlFromNodes(this.exportEditor)
-              resolve()
-              break
-            case 'pdf': {
-              void import('../Lexical/Utils/PDFExport/PDFExport').then(({ $generatePDFFromNodes }): void => {
-                void $generatePDFFromNodes(this.exportEditor, config?.pdf?.pageSize || 'A4').then((pdf) => {
-                  content = pdf
-                  resolve()
-                })
+            content = $convertToMarkdownString(MarkdownTransformers)
+            resolve()
+            break
+          }
+          case 'html':
+            content = $generateHtmlFromNodes(this.exportEditor)
+            resolve()
+            break
+          case 'pdf': {
+            void import('../Lexical/Utils/PDFExport/PDFExport').then(({ $generatePDFFromNodes }): void => {
+              void $generatePDFFromNodes(this.exportEditor, config?.pdf?.pageSize || 'A4').then((pdf) => {
+                content = pdf
+                resolve()
               })
-              break
-            }
-            case 'json':
-            default:
-              content = superString
-              resolve()
-              break
+            })
+            break
           }
-        },
-        { discrete: true },
-      )
+          case 'json':
+          default:
+            content = superString
+            resolve()
+            break
+        }
+      }
+      this.exportEditor.update(convertToFormat, { discrete: true })
     })
 
     if (typeof content !== 'string') {