feat: F6 Move functionaliteit aangepast

webui/html/app.js

@@ -30,7 +30,7 @@ let editorState = {
   originalContent: "",
   modified: null,
 };
-let renameMoveState = {
+let moveState = {
   source: null,
   destination: "",
 };
@@ -140,14 +140,15 @@ function editorElements() {
   };
 }
 
-function renameMoveElements() {
+function moveElements() {
   return {
-    overlay: document.getElementById("rename-move-popup"),
-    source: document.getElementById("rename-move-source"),
-    input: document.getElementById("rename-move-input"),
-    error: document.getElementById("rename-move-error"),
-    applyButton: document.getElementById("rename-move-apply-btn"),
-    cancelButton: document.getElementById("rename-move-cancel-btn"),
+    overlay: document.getElementById("move-popup"),
+    source: document.getElementById("move-source"),
+    input: document.getElementById("move-input"),
+    error: document.getElementById("move-error"),
+    applyButton: document.getElementById("move-apply-btn"),
+    cancelButton: document.getElementById("move-cancel-btn"),
+    closeButton: document.getElementById("move-close-btn"),
   };
 }
 
@@ -1002,8 +1003,8 @@ function isWildcardPopupOpen() {
   return !wildcardPopupElements().overlay.classList.contains("hidden");
 }
 
-function isRenameMovePopupOpen() {
-  return !renameMoveElements().overlay.classList.contains("hidden");
+function isMovePopupOpen() {
+  return !moveElements().overlay.classList.contains("hidden");
 }
 
 function isRenamePopupOpen() {
@@ -1088,8 +1089,8 @@ function showBatchDirectoryMoveNotSupported() {
   setStatus(message);
 }
 
-function resetRenameMoveState() {
-  renameMoveState = {
+function resetMoveState() {
+  moveState = {
     source: null,
     destination: "",
   };
@@ -1134,12 +1135,12 @@ function resetBatchMoveState() {
   };
 }
 
-function closeRenameMovePopup() {
-  const elements = renameMoveElements();
+function closeMovePopup() {
+  const elements = moveElements();
   elements.overlay.classList.add("hidden");
   elements.error.textContent = "";
   elements.input.value = "";
-  resetRenameMoveState();
+  resetMoveState();
 }
 
 function closeBatchMovePopup() {
@@ -1149,16 +1150,16 @@ function closeBatchMovePopup() {
   resetBatchMoveState();
 }
 
-function openRenameMovePopup() {
+function openMovePopup() {
   const selectedItems = activePaneState().selectedItems;
   if (selectedItems.length !== 1) {
     return false;
   }
   const source = selectedItems[0];
   const destination = defaultDestination(source.path, paneState(otherPane(state.activePane)).currentPath);
-  const elements = renameMoveElements();
-  renameMoveState.source = source;
-  renameMoveState.destination = destination;
+  const elements = moveElements();
+  moveState.source = source;
+  moveState.destination = destination;
   elements.source.textContent = `Source: ${source.path}`;
   elements.input.value = destination;
   elements.error.textContent = "";
@@ -1190,7 +1191,7 @@ function openF6Flow() {
     return false;
   }
   if (selectedItems.length === 1) {
-    return openRenameMovePopup();
+    return openMovePopup();
   }
   if (selectedItems.some((item) => item.kind !== "file")) {
     const roots = uniqueRootKeysForItems(selectedItems);
@@ -1244,20 +1245,19 @@ async function submitRenamePopup() {
   }
 }
 
-async function submitRenameMovePopup() {
-  const elements = renameMoveElements();
-  const source = renameMoveState.source;
+async function submitMovePopup() {
+  const elements = moveElements();
+  const source = moveState.source;
   if (!source) {
     return;
   }
   const destination = elements.input.value.trim();
   const sourceParent = currentParentPath(source.path);
   const destinationParent = currentParentPath(destination);
-  const destinationName = baseName(destination);
 
   elements.error.textContent = "";
   if (!destination) {
-    elements.error.textContent = "Destination path is required";
+    elements.error.textContent = "Target path is required";
     return;
   }
   if (destination === source.path) {
@@ -1278,25 +1278,13 @@ async function submitRenameMovePopup() {
   }
 
   try {
-    if (destinationParent === sourceParent) {
-      await apiRequest("POST", "/api/files/rename", {
-        path: source.path,
-        new_name: destinationName,
-      });
-      closeRenameMovePopup();
-      setSelectedItem(state.activePane, null);
-      await loadBrowsePane(state.activePane);
-      setStatus(`Renamed ${source.path}`);
-      return;
-    }
-
     const result = await apiRequest("POST", "/api/files/move", {
       source: source.path,
       destination,
     });
     state.selectedTaskId = result.task_id;
     await refreshTasksSnapshot();
-    closeRenameMovePopup();
+    closeMovePopup();
     setSelectedItem(state.activePane, null);
     await Promise.all([loadBrowsePane("left"), loadBrowsePane("right")]);
     setStatus(`Move: 1 success, 0 failed`);
@@ -1656,15 +1644,15 @@ function handleKeyboardShortcuts(event) {
     }
     return;
   }
-  if (isRenameMovePopupOpen()) {
+  if (isMovePopupOpen()) {
     if (event.key === "Escape") {
       event.preventDefault();
-      closeRenameMovePopup();
+      closeMovePopup();
       return;
     }
     if (event.key === "Enter") {
       event.preventDefault();
-      submitRenameMovePopup();
+      submitMovePopup();
     }
     return;
   }
@@ -1842,23 +1830,24 @@ function setupEvents() {
     }
   };
 
-  const renameMove = renameMoveElements();
-  renameMove.cancelButton.onclick = closeRenameMovePopup;
-  renameMove.applyButton.onclick = submitRenameMovePopup;
-  renameMove.input.onkeydown = (event) => {
+  const move = moveElements();
+  move.closeButton.onclick = closeMovePopup;
+  move.cancelButton.onclick = closeMovePopup;
+  move.applyButton.onclick = submitMovePopup;
+  move.input.onkeydown = (event) => {
     if (event.key === "Enter") {
       event.preventDefault();
-      submitRenameMovePopup();
+      submitMovePopup();
       return;
     }
     if (event.key === "Escape") {
       event.preventDefault();
-      closeRenameMovePopup();
+      closeMovePopup();
     }
   };
-  renameMove.overlay.onclick = (event) => {
-    if (event.target === renameMove.overlay) {
-      closeRenameMovePopup();
+  move.overlay.onclick = (event) => {
+    if (event.target === move.overlay) {
+      closeMovePopup();
     }
   };
 

webui/html/index.html

@@ -113,16 +113,17 @@
     </div>
   </div>
 
-  <div id="rename-move-popup" class="popup-overlay hidden" role="dialog" aria-modal="true" aria-labelledby="rename-move-title">
+  <div id="move-popup" class="popup-overlay hidden" role="dialog" aria-modal="true" aria-labelledby="move-title">
     <div class="popup-card">
-      <h3 id="rename-move-title">Rename/Move</h3>
-      <div id="rename-move-source" class="popup-meta"></div>
-      <label for="rename-move-input" class="popup-label">Destination path</label>
-      <input id="rename-move-input" type="text" autocomplete="off">
-      <div id="rename-move-error" class="error"></div>
+      <button id="move-close-btn" class="viewer-close" type="button" aria-label="Close move">X</button>
+      <h3 id="move-title">Move</h3>
+      <div id="move-source" class="popup-meta"></div>
+      <label for="move-input" class="popup-label">Target path</label>
+      <input id="move-input" type="text" autocomplete="off">
+      <div id="move-error" class="error"></div>
       <div class="popup-actions">
-        <button id="rename-move-apply-btn" type="button">OK</button>
-        <button id="rename-move-cancel-btn" type="button">Cancel</button>
+        <button id="move-apply-btn" type="button">Move</button>
+        <button id="move-cancel-btn" type="button">Cancel</button>
       </div>
     </div>
   </div>

webui/html/style.css

@@ -484,13 +484,14 @@ button:disabled {
 }
 
 #wildcard-pattern-input,
-#rename-move-input {
+#move-input {
   width: 100%;
   margin-top: 4px;
   margin-bottom: 6px;
 }
 
-#rename-popup .popup-card {
+#rename-popup .popup-card,
+#move-popup .popup-card {
   width: min(520px, calc(100vw - 28px));
 }