From a54e5b6f08bc50ea49156dbedc010f757c1030ac Mon Sep 17 00:00:00 2001
From: Jos de Jong <wjosdejong@gmail.com>
Date: Mon, 27 Jul 2020 16:21:09 +0200
Subject: [PATCH] Implement menu item "Remove"

---
 src/components/JSONEditor.svelte | 25 +++++++++++++++++++++----
 src/components/Menu.svelte       | 15 ++++++++++++---
 2 files changed, 33 insertions(+), 7 deletions(-)

diff --git a/src/components/JSONEditor.svelte b/src/components/JSONEditor.svelte
index b8f28e0..56afb5f 100644
--- a/src/components/JSONEditor.svelte
+++ b/src/components/JSONEditor.svelte
@@ -129,12 +129,13 @@ import { isObjectOrArray } from '../utils/typeUtils.js'
 
   function handleCut() {
     if (selection && selection.paths) {
-      clipboard = selectionToClipboard(selection)
+      console.log('cut', { selection, clipboard })
 
+      clipboard = selectionToClipboard(selection)
+      
       const operations = removeAll(selection.paths)
       handlePatch(operations)
-
-      console.log('cut', { selection, clipboard })
+      selection = null
     }
   }
 
@@ -156,6 +157,17 @@ import { isObjectOrArray } from '../utils/typeUtils.js'
     }
   }
 
+  function handleRemove() {
+    if (selection && selection.paths) {
+      console.log('remove', { selection })
+
+      const operations = removeAll(selection.paths)
+      handlePatch(operations)
+      
+      selection = null
+    }
+  }
+
   function handleDuplicate() {
     if (selection && selection.paths) {
       console.log('duplicate', { selection })
@@ -368,7 +380,11 @@ import { isObjectOrArray } from '../utils/typeUtils.js'
         event.preventDefault()
         handleDuplicate()
       }
-      if (combo === 'Ctrl+Insert' || combo === 'Command+Insert') {
+      if (combo === 'Delete') {
+        event.preventDefault()
+        handleRemove()
+      }
+      if (combo === 'Insert' || combo === 'Insert') {
         event.preventDefault()
         handleInsert('structure')
       }
@@ -430,6 +446,7 @@ import { isObjectOrArray } from '../utils/typeUtils.js'
     onCut={handleCut}
     onCopy={handleCopy}
     onPaste={handlePaste}
+    onRemove={handleRemove}
     onDuplicate={handleDuplicate}
     onInsert={handleInsert}
     onUndo={handleUndo}
diff --git a/src/components/Menu.svelte b/src/components/Menu.svelte
index dc2e889..1040e43 100644
--- a/src/components/Menu.svelte
+++ b/src/components/Menu.svelte
@@ -1,6 +1,6 @@
 <script>
   import Icon from 'svelte-awesome'
-  import { faCut, faClone, faCopy, faPaste, faSearch, faUndo, faRedo, faPlus } from '@fortawesome/free-solid-svg-icons'
+  import { faCut, faClone, faCopy, faPaste, faSearch, faUndo, faRedo, faPlus, faTimes } from '@fortawesome/free-solid-svg-icons'
   import SearchBox from './SearchBox.svelte'
   import DropdownMenu from './DropdownMenu.svelte'
 
@@ -14,6 +14,7 @@
   export let onCut
   export let onCopy
   export let onPaste
+  export let onRemove
   export let onDuplicate
   export let onInsert
   export let onUndo
@@ -100,6 +101,15 @@
 
   <div class="separator"></div>
 
+  <button
+    class="button remove"
+    on:click={onRemove}
+    disabled={!hasSelectionContents}
+    title="remove (Delete)"
+  >
+    <Icon data={faTimes} />
+  </button>
+
   <button
     class="button duplicate"
     on:click={onDuplicate}
@@ -108,10 +118,9 @@
   >
     <Icon data={faClone} />
   </button>
-
   <DropdownMenu 
     items={insertItems} 
-    title="Insert new value (Ctrl+Insert)"
+    title="Insert new value (Insert)"
   >
     <button 
       class="button insert"