Add Redo command

packages/fileeditor-extension/src/commands.ts

@@ -38,12 +38,13 @@ import {
 import { ISettingRegistry } from '@jupyterlab/settingregistry';
 
 import {
-  markdownIcon,
-  textEditorIcon,
-  undoIcon,
   cutIcon,
   copyIcon,
-  pasteIcon
+  markdownIcon,
+  pasteIcon,
+  redoIcon,
+  textEditorIcon,
+  undoIcon
 } from '@jupyterlab/ui-components';
 
 import { CommandRegistry } from '@lumino/commands';
@@ -84,6 +85,8 @@ export namespace CommandIDs {
 
   export const undo = 'fileeditor:undo';
 
+  export const redo = 'fileeditor:redo';
+
   export const cut = 'fileeditor:cut';
 
   export const copy = 'fileeditor:copy';
@@ -218,6 +221,8 @@ export namespace Commands {
 
     addUndoCommand(commands, tracker, isEnabled);
 
+    addRedoCommand(commands, tracker, isEnabled);
+
     addCutCommand(commands, tracker, isEnabled);
 
     addCopyCommand(commands, tracker, isEnabled);
@@ -613,6 +618,42 @@ export namespace Commands {
     });
   }
 
+  /**
+   * Add redo command
+   */
+  export function addRedoCommand(
+    commands: CommandRegistry,
+    tracker: WidgetTracker<IDocumentWidget<FileEditor>>,
+    isEnabled: () => boolean
+  ) {
+    commands.addCommand(CommandIDs.redo, {
+      execute: () => {
+        const widget = tracker.currentWidget?.content;
+
+        if (!widget) {
+          return;
+        }
+
+        widget.editor.redo();
+      },
+      isEnabled: () => {
+        if (!isEnabled()) {
+          return false;
+        }
+
+        const widget = tracker.currentWidget?.content;
+
+        if (!widget) {
+          return false;
+        }
+        // TODO: Enable based if any undo events are stored
+        return true;
+      },
+      icon: redoIcon.bindprops({ stylesheet: 'menuItem' }),
+      label: 'Redo'
+    });
+  }
+
   /**
    * Add cut command
    */
@@ -1155,6 +1196,7 @@ export namespace Commands {
     addCreateConsoleToContextMenu(app);
     addMarkdownPreviewToContextMenu(app);
     addUndoCommandToContextMenu(app);
+    addRedoCommandToContextMenu(app);
     addCutCommandToContextMenu(app);
     addCopyCommandToContextMenu(app);
     addPasteCommandToContextMenu(app);
@@ -1192,6 +1234,17 @@ export namespace Commands {
     });
   }
 
+  /**
+   * Add a Redo item to the File Editor context menu
+   */
+  export function addRedoCommandToContextMenu(app: JupyterFrontEnd) {
+    app.contextMenu.addItem({
+      command: CommandIDs.redo,
+      selector: '.jp-FileEditor',
+      rank: 0
+    });
+  }
+
   /**
    * Add a Cut item to the File Editor context menu
    */

packages/ui-components/src/icon/iconimports.ts

@@ -59,6 +59,7 @@ import pasteSvgstr from '../../style/icons/toolbar/paste.svg';
 import pythonSvgstr from '../../style/icons/filetype/python.svg';
 import rKernelSvgstr from '../../style/icons/filetype/r-kernel.svg';
 import reactSvgstr from '../../style/icons/filetype/react.svg';
+import redoSvgstr from '../../style/icons/toolbar/redo.svg';
 import refreshSvgstr from '../../style/icons/toolbar/refresh.svg';
 import regexSvgstr from '../../style/icons/search/regex.svg';
 import runSvgstr from '../../style/icons/toolbar/run.svg';
@@ -128,6 +129,7 @@ export const pasteIcon = new LabIcon({ name: 'ui-components:paste', svgstr: past
 export const pythonIcon = new LabIcon({ name: 'ui-components:python', svgstr: pythonSvgstr });
 export const rKernelIcon = new LabIcon({ name: 'ui-components:r-kernel', svgstr: rKernelSvgstr });
 export const reactIcon = new LabIcon({ name: 'ui-components:react', svgstr: reactSvgstr });
+export const redoIcon = new LabIcon({ name: 'ui-components:redo', svgstr: redoSvgstr });
 export const refreshIcon = new LabIcon({ name: 'ui-components:refresh', svgstr: refreshSvgstr });
 export const regexIcon = new LabIcon({ name: 'ui-components:regex', svgstr: regexSvgstr });
 export const runIcon = new LabIcon({ name: 'ui-components:run', svgstr: runSvgstr });

packages/ui-components/style/deprecated.css

@@ -63,6 +63,7 @@
   --jp-icon-python: url('icons/filetype/python.svg');
   --jp-icon-r-kernel: url('icons/filetype/r-kernel.svg');
   --jp-icon-react: url('icons/filetype/react.svg');
+  --jp-icon-redo: url('icons/toolbar/redo.svg');
   --jp-icon-refresh: url('icons/toolbar/refresh.svg');
   --jp-icon-regex: url('icons/search/regex.svg');
   --jp-icon-run: url('icons/toolbar/run.svg');
@@ -236,6 +237,9 @@
 .jp-ReactIcon {
   background-image: var(--jp-icon-react);
 }
+.jp-RedoIcon {
+  background-image: var(--jp-icon-redo);
+}
 .jp-RefreshIcon {
   background-image: var(--jp-icon-refresh);
 }

packages/ui-components/style/icons/toolbar/redo.svg

@@ -0,0 +1,5 @@
+<svg viewBox="0 0 24 24" width="16" xmlns="http://www.w3.org/2000/svg" style="transform:rotateY(180deg);">
+  <g class="jp-icon3" fill="#616161">
+    <path d="M12.5 8c-2.65 0-5.05.99-6.9 2.6L2 7v9h9l-3.62-3.62c1.39-1.16 3.16-1.88 5.12-1.88 3.54 0 6.55 2.31 7.6 5.5l2.37-.78C21.08 11.03 17.15 8 12.5 8z"/>
+  </g>
+</svg>