feat: consolidate insert context/shortcut actions (#247)

This consolidates the behaviors for the insert context menu and shortcut
actions to behave the same (a behavior change for the insert shorcut)
and updates the code behavior to match the delete action for simplicity.

Author: BenHenning

src/actions/clipboard.ts

@@ -12,7 +12,7 @@ import {
   ICopyData,
 } from 'blockly';
 import * as Constants from '../constants';
-import type {BlockSvg, Workspace, WorkspaceSvg} from 'blockly';
+import type {BlockSvg, WorkspaceSvg} from 'blockly';
 import {Navigation} from '../navigation';
 
 const KeyCodes = blocklyUtils.KeyCodes;

src/actions/delete.ts

@@ -90,7 +90,7 @@ export class DeleteAction {
 
     if (!this.oldContextMenuItem) return;
 
-    // Unregister the original item..
+    // Unregister the original item.
     ContextMenuRegistry.registry.unregister(this.oldContextMenuItem.id);
 
     const deleteItem: ContextMenuRegistry.RegistryItem = {

src/actions/insert.ts

@@ -0,0 +1,144 @@
+/**
+ * @license
+ * Copyright 2025 Google LLC
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+import {
+  Connection,
+  ContextMenuRegistry,
+  ShortcutRegistry,
+  comments,
+  utils as BlocklyUtils,
+} from 'blockly';
+import * as Constants from '../constants';
+import type {BlockSvg, WorkspaceSvg} from 'blockly';
+import {Navigation} from '../navigation';
+
+const KeyCodes = BlocklyUtils.KeyCodes;
+
+interface Scope {
+  block?: BlockSvg;
+  workspace?: WorkspaceSvg;
+  comment?: comments.RenderedWorkspaceComment;
+  connection?: Connection;
+}
+
+/**
+ * Action to insert a block into the workspace.
+ *
+ * This action registers itself as both a keyboard shortcut and a context menu
+ * item.
+ */
+export class InsertAction {
+  /**
+   * Function provided by the navigation controller to say whether editing
+   * is allowed.
+   */
+  private canCurrentlyEdit: (ws: WorkspaceSvg) => boolean;
+
+  /**
+   * Registration name for the keyboard shortcut.
+   */
+  private insertShortcutName = Constants.SHORTCUT_NAMES.INSERT;
+
+  constructor(
+    private navigation: Navigation,
+    canEdit: (ws: WorkspaceSvg) => boolean,
+  ) {
+    this.canCurrentlyEdit = canEdit;
+  }
+
+  /**
+   * Install this action as both a keyboard shortcut and a context menu item.
+   */
+  install() {
+    this.registerShortcut();
+    this.registerContextMenuAction();
+  }
+
+  /**
+   * Uninstall this action as both a keyboard shortcut and a context menu item.
+   * Reinstall the original context menu action if possible.
+   */
+  uninstall() {
+    ContextMenuRegistry.registry.unregister('insert');
+    ShortcutRegistry.registry.unregister(this.insertShortcutName);
+  }
+
+  /**
+   * Create and register the keyboard shortcut for this action.
+   */
+  private registerShortcut() {
+    const insertShortcut: ShortcutRegistry.KeyboardShortcut = {
+      name: this.insertShortcutName,
+      preconditionFn: this.insertPrecondition.bind(this),
+      callback: this.insertCallback.bind(this),
+      keyCodes: [KeyCodes.I],
+    };
+    ShortcutRegistry.registry.register(insertShortcut);
+  }
+
+  /**
+   * Register the insert block action as a context menu item on blocks.
+   * This function mixes together the keyboard and context menu preconditions
+   * but only calls the keyboard callback.
+   */
+  private registerContextMenuAction() {
+    const insertAboveItem: ContextMenuRegistry.RegistryItem = {
+      displayText: (scope) => {
+        if (scope.block?.previousConnection) {
+          return 'Insert Block Above (I)'
+        } else {
+          return 'Insert Block (I)'
+        }
+      },
+      preconditionFn: (scope: Scope) => {
+        const block = scope.block ?? scope.connection?.getSourceBlock();
+        const ws = block?.workspace as WorkspaceSvg | null;
+        if (!ws) return 'hidden';
+
+        return this.insertPrecondition(ws) ? 'enabled' : 'hidden';
+      },
+      callback: (scope: Scope) => {
+        let ws =
+          scope.block?.workspace ??
+          (scope.connection?.getSourceBlock().workspace as WorkspaceSvg);
+        if (!ws) return false;
+        this.insertCallback(ws);
+      },
+      scopeType: ContextMenuRegistry.ScopeType.BLOCK,
+      id: 'insert',
+      weight: 9,
+    };
+
+    ContextMenuRegistry.registry.register(insertAboveItem);
+  }
+
+  /**
+   * Precondition function for inserting a block from keyboard navigation. This
+   * precondition is shared between keyboard shortcuts and context menu items.
+   *
+   * @param workspace The `WorkspaceSvg` where the shortcut was
+   *     invoked.
+   * @returns True iff `insertCallback` function should be called.
+   */
+  private insertPrecondition(workspace: WorkspaceSvg): boolean {
+    return this.canCurrentlyEdit(workspace);
+  }
+
+  /**
+   * Callback function for inserting a block from keyboard navigation. This
+   * callback is shared between keyboard shortcuts and context menu items.
+   *
+   * @param workspace The `WorkspaceSvg` where the shortcut was invoked.
+   * @returns Whether the toolbox or flyout is successfully opened.
+   */
+  private insertCallback(workspace: WorkspaceSvg): boolean {
+    if (this.navigation.getState(workspace) === Constants.STATE.WORKSPACE) {
+      this.navigation.openToolboxOrFlyout(workspace);
+      return true;
+    }
+    return false;
+  }
+}

src/navigation_controller.ts

@@ -15,12 +15,6 @@ import './gesture_monkey_patch';
 import * as Blockly from 'blockly/core';
 import {
   ASTNode,
-  BlockSvg,
-  comments,
-  Connection,
-  ConnectionType,
-  ContextMenuRegistry,
-  ICopyData,
   ShortcutRegistry,
   Toolbox,
   utils as BlocklyUtils,
@@ -33,20 +27,14 @@ import {Announcer} from './announcer';
 import {LineCursor} from './line_cursor';
 import {ShortcutDialog} from './shortcut_dialog';
 import {DeleteAction} from './actions/delete';
+import {InsertAction} from './actions/insert';
 import {Clipboard} from './actions/clipboard';
 
 const KeyCodes = BlocklyUtils.KeyCodes;
 const createSerializedKey = ShortcutRegistry.registry.createSerializedKey.bind(
   ShortcutRegistry.registry,
 );
 
-interface Scope {
-  block?: BlockSvg;
-  workspace?: WorkspaceSvg;
-  comment?: comments.RenderedWorkspaceComment;
-  connection?: Connection;
-}
-
 /**
  * Class for registering shortcuts for keyboard navigation.
  */
@@ -55,12 +43,18 @@ export class NavigationController {
   announcer: Announcer = new Announcer();
   shortcutDialog: ShortcutDialog = new ShortcutDialog();
 
-  /** Context menu and keyboard action for delete. */
+  /** Context menu and keyboard action for deletion. */
   deleteAction: DeleteAction = new DeleteAction(
     this.navigation,
     this.canCurrentlyEdit.bind(this),
   );
 
+  /** Context menu and keyboard action for insertion. */
+  insertAction: InsertAction = new InsertAction(
+    this.navigation,
+    this.canCurrentlyEdit.bind(this),
+  );
+
   clipboard: Clipboard = new Clipboard(
     this.navigation,
     this.canCurrentlyEdit.bind(this),
@@ -400,21 +394,6 @@ export class NavigationController {
       keyCodes: [KeyCodes.RIGHT],
     },
 
-    /** Connect a block to a marked location. */
-    insert: {
-      name: Constants.SHORTCUT_NAMES.INSERT,
-      preconditionFn: (workspace) => this.canCurrentlyEdit(workspace),
-      callback: (workspace) => {
-        switch (this.navigation.getState(workspace)) {
-          case Constants.STATE.WORKSPACE:
-            return this.navigation.connectMarkerAndCursor(workspace);
-          default:
-            return false;
-        }
-      },
-      keyCodes: [KeyCodes.I],
-    },
-
     /**
      * Enter key:
      *
@@ -722,39 +701,6 @@ export class NavigationController {
     },
   };
 
-  /**
-   * Register the action for inserting above a block.
-   */
-  protected registerInsertAction() {
-    const insertAboveAction: ContextMenuRegistry.RegistryItem = {
-      displayText: (scope: Scope) =>
-        scope.block?.previousConnection ? 'Insert Block Above' : 'Insert Block',
-      preconditionFn: (scope: Scope) => {
-        const block = scope.block ?? scope.connection?.getSourceBlock();
-        const ws = block?.workspace as WorkspaceSvg | null;
-        if (!ws) return 'hidden';
-
-        return this.canCurrentlyEdit(ws) ? 'enabled' : 'hidden';
-      },
-      callback: (scope: Scope) => {
-        let ws =
-          scope.block?.workspace ??
-          (scope.connection?.getSourceBlock().workspace as WorkspaceSvg);
-        if (!ws) return false;
-
-        if (this.navigation.getState(ws) === Constants.STATE.WORKSPACE) {
-          this.navigation.openToolboxOrFlyout(ws);
-          return true;
-        }
-        return false;
-      },
-      scopeType: ContextMenuRegistry.ScopeType.BLOCK,
-      id: 'insert',
-      weight: 9,
-    };
-    ContextMenuRegistry.registry.register(insertAboveAction);
-  }
-
   /**
    * Registers all default keyboard shortcut items for keyboard
    * navigation. This should be called once per instance of
@@ -765,11 +711,10 @@ export class NavigationController {
       ShortcutRegistry.registry.register(shortcut);
     }
     this.deleteAction.install();
+    this.insertAction.install();
 
     this.clipboard.install();
 
-    this.registerInsertAction();
-
     // Initalise the shortcut modal with available shortcuts.  Needs
     // to be done separately rather at construction, as many shortcuts
     // are not registered at that point.
@@ -785,6 +730,7 @@ export class NavigationController {
     }
 
     this.deleteAction.uninstall();
+    this.insertAction.uninstall();
     this.clipboard.uninstall();
 
     this.removeShortcutHandlers();