From ab5a81e3a82e65f6ce68e8551d9565e064445666 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Philipp=20Ku=CC=88hn?= <kontakt@philipp-kuehn.com>
Date: Fri, 4 Jun 2021 22:26:18 +0200
Subject: [PATCH] use foreach command for imageToFigure

---
 docs/src/demos/Experiments/Figure/figure.ts | 25 ++++++++++++---------
 docs/src/demos/Experiments/Figure/index.vue | 10 +++++++--
 2 files changed, 23 insertions(+), 12 deletions(-)

diff --git a/docs/src/demos/Experiments/Figure/figure.ts b/docs/src/demos/Experiments/Figure/figure.ts
index 980d8d13..b2cb1857 100644
--- a/docs/src/demos/Experiments/Figure/figure.ts
+++ b/docs/src/demos/Experiments/Figure/figure.ts
@@ -122,31 +122,36 @@ export const Figure = Node.create<FigureOptions>({
           .run()
       },
 
-      imageToFigure: () => ({ tr }) => {
+      imageToFigure: () => ({ tr, commands }) => {
         const { doc, selection } = tr
         const { from, to } = selection
-        const range = { from, to }
-        const nodes = findChildrenInRange(doc, range, node => node.type.name === 'image')
+        const nodes = findChildrenInRange(doc, { from, to }, node => node.type.name === 'image')
 
         if (!nodes.length) {
           return false
         }
 
-        nodes.forEach(({ node, pos }, index) => {
+        return commands.forEach(nodes, ({ node, pos }, { index }) => {
           const mappedPos = tr.steps
             .slice(tr.steps.length - index)
             .reduce((newPos, step) => step.getMap().map(newPos), pos)
 
-          tr.replaceRangeWith(mappedPos, mappedPos + node.nodeSize, this.type.create({
-            src: node.attrs.src,
-          }))
-        })
+          const range = {
+            from: mappedPos,
+            to: mappedPos + node.nodeSize,
+          }
 
-        return true
+          return commands.insertContentAt(range, {
+            type: this.name,
+            attrs: {
+              src: node.attrs.src,
+            },
+          })
+        })
       },
 
       figureToImage: () => () => {
-        return true
+        return false
       },
     }
   },
diff --git a/docs/src/demos/Experiments/Figure/index.vue b/docs/src/demos/Experiments/Figure/index.vue
index 37af2a68..1943e7fd 100644
--- a/docs/src/demos/Experiments/Figure/index.vue
+++ b/docs/src/demos/Experiments/Figure/index.vue
@@ -3,10 +3,16 @@
     <button @click="addFigure">
       figure
     </button>
-    <button @click="editor.chain().focus().imageToFigure().run()">
+    <button
+      @click="editor.chain().focus().imageToFigure().run()"
+      :disabled="!editor.can().imageToFigure()"
+    >
       image to figure
     </button>
-    <button @click="editor.chain().focus().figureToImage().run()">
+    <button
+      @click="editor.chain().focus().figureToImage().run()"
+      :disabled="!editor.can().figureToImage()"
+    >
       figure to image
     </button>
     <editor-content :editor="editor" />