Implement most menu functionality

src/jsoneditor/components/TreeMode.js

@@ -24,8 +24,7 @@ import {
   insertInside,
   remove,
   removeAll,
-  replace,
+  replace
-  sort
 } from '../actions'
 import JSONNode from './JSONNode'
 import JSONNodeView from './JSONNodeView'
@@ -271,6 +270,12 @@ export default class TreeMode extends PureComponent {
   }
 
   renderMenu () {
+    const hasCursor = true // FIXME: implement hasCursor
+    const hasSelection = !!this.state.selection
+    const hasClipboard = this.state.clipboard
+        ? this.state.clipboard.length > 0
+        : false
+
     return h(TreeModeMenu, {
       key: 'menu',
 
@@ -278,13 +283,32 @@ export default class TreeMode extends PureComponent {
       modes: this.props.modes,
       onChangeMode: this.props.onChangeMode,
 
+      canCut: hasSelection,
+      canCopy: hasSelection,
+      canPaste: hasClipboard && hasCursor,
+      onCut: this.handleCut,
+      onCopy: this.handleCopy,
+      onPaste: this.handlePaste,
+
+      canInsert: hasCursor,
+      canDuplicate: hasSelection,
+      canRemove: hasSelection,
+      onInsert: this.handleInsertBefore,
+      onDuplicate: this.handleDuplicate,
+      onRemove: this.handleRemove,
+
+      canSort: hasSelection || hasCursor,
+      canTransform: hasSelection || hasCursor,
+      canSearch: this.props.search,
+      onSort: this.handleSort,
+      onTransform: this.handleTransform,
+      onToggleSearch: this.toggleSearch,
+
       enableHistory: this.props.history,
       canUndo: this.canUndo(),
       canRedo: this.canRedo(),
       onUndo: this.undo,
       onRedo: this.redo,
-
-      onToggleSearch: this.toggleSearch
     })
   }
 
@@ -541,6 +565,14 @@ export default class TreeMode extends PureComponent {
 
       // TODO: select the pasted contents
     }
+    else {
+      // TODO: paste before current line => selection must contain current line
+    }
+  }
+
+  handleInsertBefore = () => {
+    // FIXME: implement handleInsertBefore
+    console.error('Insert not yet implemented...')
   }
 
   /**
@@ -569,13 +601,15 @@ export default class TreeMode extends PureComponent {
     })
   }
 
-  /**
+  handleSort = () => {
-   * Handle sorting a path
+    // FIXME: implement handle sort from selection or caret
-   * @param {Path} path
+    console.error('sort not yet implemented...')
-   * @param {string | null} [order]
+    // this.handlePatch(sort(this.state.eson, path, order))
-   */
+  }
-  handleSort = (path, order = null) => {
+
-    this.handlePatch(sort(this.state.eson, path, order))
+  handleTransform = () => {
+    // FIXME: implement handleTransform
+    console.error('transform not yet implemented...')
   }
 
   /**

src/jsoneditor/components/menu/MenuButton.scss

@@ -20,6 +20,10 @@
 
     font-family: arial, sans-serif;
     font-size: 16px;
+
+    &.current-mode {
+      font-weight: bold;
+    }
   }
 
   button:hover {

src/jsoneditor/components/menu/ModeButton.js

@@ -29,11 +29,12 @@ export default class ModeButton extends Component {
     return h('div', {className: 'jsoneditor-modes'}, [
       h('button', {
         key: 'button',
+        className: 'current-mode',
         title: 'Switch mode',
         onClick: this.handleOpen
       }, [
           toCapital(props.mode) + '  ',
-          h('i', { className: 'fa fa-chevron-down' })
+          h('i', { key: 'icon', className: 'fa fa-chevron-down' })
       ]),
 
       h(ModeSelector, {

src/jsoneditor/components/menu/TreeModeMenu.js

@@ -41,13 +41,25 @@ export default class TreeModeMenu extends PureComponent {
     onCopy: PropTypes.func.isRequired,
     onPaste: PropTypes.func.isRequired,
 
+    canInsert: PropTypes.bool.isRequired,
+    canDuplicate: PropTypes.bool.isRequired,
+    canRemove: PropTypes.bool.isRequired,
+    onInsert: PropTypes.func.isRequired,
+    onDuplicate: PropTypes.func.isRequired,
+    onRemove: PropTypes.func.isRequired,
+
+    canSort: PropTypes.bool.isRequired,
+    canTransform: PropTypes.bool.isRequired,
+    canSearch: PropTypes.bool.isRequired,
+    onSort: PropTypes.func.isRequired,
+    onTransform: PropTypes.func.isRequired,
+    onToggleSearch: PropTypes.func,
+
     enableHistory: PropTypes.bool,
     canUndo: PropTypes.bool,
     canRedo: PropTypes.bool,
     onUndo: PropTypes.func,
-    onRedo: PropTypes.func,
+    onRedo: PropTypes.func
-
-    onToggleSearch: PropTypes.func
   }
 
   render () {
@@ -82,14 +94,14 @@ export default class TreeModeMenu extends PureComponent {
           key: 'copy',
           className: 'jsoneditor-copy',
           title: 'Copy current selection',
-          // disabled: !this.props.canPaste,
+          disabled: !this.props.canCopy,
-          onClick: this.props.onPaste
+          onClick: this.props.onCopy
         }, h('i', {className: 'fa fa-copy'})),
         h('button', {
           key: 'paste',
           className: 'jsoneditor-paste',
           title: 'Paste copied selection',
-          // disabled: !this.props.canPaste,
+          disabled: !this.props.canPaste,
           onClick: this.props.onPaste
         }, h('i', {className: 'fa fa-paste'}))
       ])
@@ -128,13 +140,14 @@ export default class TreeModeMenu extends PureComponent {
           key: 'sort',
           className: 'jsoneditor-sort',
           title: 'Sort contents',
-          onClick: this.props.onSort // TODO: implement onSort
+          // disabled: !this.props.canSort, // TODO: can sort
+          onClick: this.props.onSort
         }, h('i', {className: 'fa fa-sort-amount-down'})),
         h('button', {
           key: 'transform',
           className: 'jsoneditor-transform',
           title: 'Transform contents',
-          // disabled: !this.props.canPaste,
+          // disabled: !this.props.canTransform, // TODO canTransform
           onClick: this.props.onTransform
         }, h('i', {className: 'fa fa-filter'})),
         h('button', {