Refactor item selection

packages/base/src/commands/index.ts

@@ -508,13 +508,7 @@ export function addCommands(
     label: trans.__('Rename Layer'),
     execute: async () => {
       const model = tracker.currentWidget?.model;
-      await Private.renameSelectedItem(model, 'layer', (layerId, newName) => {
-        const layer = model?.getLayer(layerId);
-        if (layer) {
-          layer.name = newName;
-          model?.sharedModel.updateLayer(layerId, layer);
-        }
-      });
+      await Private.renameSelectedItem(model, 'layer');
     },
   });
 
@@ -532,9 +526,7 @@ export function addCommands(
     label: trans.__('Rename Group'),
     execute: async () => {
       const model = tracker.currentWidget?.model;
-      await Private.renameSelectedItem(model, 'group', (groupName, newName) => {
-        model?.renameLayerGroup(groupName, newName);
-      });
+      await Private.renameSelectedItem(model, 'group');
     },
   });
 
@@ -635,13 +627,7 @@ export function addCommands(
     label: trans.__('Rename Source'),
     execute: async () => {
       const model = tracker.currentWidget?.model;
-      await Private.renameSelectedItem(model, 'source', (sourceId, newName) => {
-        const source = model?.getSource(sourceId);
-        if (source) {
-          source.name = newName;
-          model?.sharedModel.updateSource(sourceId, source);
-        }
-      });
+      await Private.renameSelectedItem(model, 'source');
     },
   });
 
@@ -1146,39 +1132,6 @@ namespace Private {
     };
   }
 
-  export async function getUserInputForRename(
-    text: HTMLElement,
-    input: HTMLInputElement,
-    original: string,
-  ): Promise<string> {
-    const parent = text.parentElement as HTMLElement;
-    parent.replaceChild(input, text);
-    input.value = original;
-    input.select();
-    input.focus();
-
-    return new Promise<string>(resolve => {
-      input.addEventListener('blur', () => {
-        parent.replaceChild(text, input);
-        resolve(input.value);
-      });
-
-      input.addEventListener('keydown', (event: KeyboardEvent) => {
-        if (event.key === 'Enter') {
-          event.stopPropagation();
-          event.preventDefault();
-          input.blur();
-        } else if (event.key === 'Escape') {
-          event.stopPropagation();
-          event.preventDefault();
-          input.value = original;
-          input.blur();
-          text.focus();
-        }
-      });
-    });
-  }
-
   export function removeSelectedItems(
     model: IJupyterGISModel | undefined,
     itemTypeToRemove: SelectionType,
@@ -1201,11 +1154,10 @@ namespace Private {
   export async function renameSelectedItem(
     model: IJupyterGISModel | undefined,
     itemType: SelectionType,
-    callback: (itemId: string, newName: string) => void,
   ) {
     const selectedItems = model?.localState?.selected.value;
 
-    if (!selectedItems) {
+    if (!selectedItems || !model) {
       console.error(`No ${itemType} selected`);
       return;
     }
@@ -1224,34 +1176,8 @@ namespace Private {
       return;
     }
 
-    const nodeId = selectedItems[itemId].selectedNodeId;
-    if (!nodeId) {
-      return;
-    }
-
-    const node = document.getElementById(nodeId);
-    if (!node) {
-      console.warn(`Node with ID ${nodeId} not found`);
-      return;
-    }
-
-    const edit = document.createElement('input');
-    edit.classList.add('jp-gis-left-panel-input');
-    const originalName = node.innerText;
-    const newName = await Private.getUserInputForRename(
-      node,
-      edit,
-      originalName,
-    );
-
-    if (!newName) {
-      console.warn('New name cannot be empty');
-      return;
-    }
-
-    if (newName !== originalName) {
-      callback(itemId, newName);
-    }
+    // Set editing state - component will show inline input
+    model.setEditingItem(itemType, itemId);
   }
 
   export function executeConsole(tracker: JupyterGISTracker): void {