From 93fc562c44a5d1e9749a31ca66781519678f3202 Mon Sep 17 00:00:00 2001 From: Bruno Charest Date: Mon, 14 Sep 2026 16:39:37 -0400 Subject: [PATCH] =?UTF-8?q?fix(dragdrop):=20arborescence=20r=C3=A9cursive,?= =?UTF-8?q?=20recherche/filtre=20de=20dossiers=20et=20saisie=20de=20sous-d?= =?UTF-8?q?ossier=20(#89)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- frontend/js/upload.js | 64 +++++++++++++++++++++++++++++++++------- frontend/locales/en.json | 2 ++ frontend/locales/fr.json | 2 ++ 3 files changed, 58 insertions(+), 10 deletions(-) diff --git a/frontend/js/upload.js b/frontend/js/upload.js index d7f39b4..7d0012f 100644 --- a/frontend/js/upload.js +++ b/frontend/js/upload.js @@ -250,8 +250,9 @@ export async function promptTargetFolder(initialVault, initialDir = '', items = if (vaultFoldersMap[v]) return vaultFoldersMap[v]; try { const res = await api(`/api/vault/${encodeURIComponent(v)}/paths?limit=5000`); - if (res && Array.isArray(res.paths)) { - vaultFoldersMap[v] = res.paths + const list = res?.results || res?.paths || []; + if (Array.isArray(list)) { + vaultFoldersMap[v] = list .filter((p) => p.type === 'directory') .map((p) => p.path) .sort(); @@ -275,6 +276,8 @@ export async function promptTargetFolder(initialVault, initialDir = '', items = const fileCount = items.filter((x) => !x.isDir).length; const dirCount = items.filter((x) => x.isDir).length; + let filterText = ''; + function renderVaultOptions() { return vaultsList.map((v) => { const vName = typeof v === 'string' ? v : v.name; @@ -283,17 +286,26 @@ export async function promptTargetFolder(initialVault, initialDir = '', items = }).join(''); } - function renderFolderOptions(folders, curDir) { + function renderFolderOptions(folders, curDir, filter = '') { + let filtered = folders; + if (filter.trim()) { + const q = filter.trim().toLowerCase(); + filtered = folders.filter((f) => f.toLowerCase().includes(q)); + } + let html = ``; - for (const folder of folders) { + for (const folder of filtered) { const sel = folder === curDir ? 'selected' : ''; - html += ``; + // Indent subfolder depth for a clean hierarchical visual tree + const depth = (folder.match(/\//g) || []).length; + const indent = '  '.repeat(depth); + html += ``; } return html; } overlay.innerHTML = ` -
+
📁 ${escapeHtml(t('upload.choose_target_folder') || "Destination de l'importation")} @@ -316,10 +328,18 @@ export async function promptTargetFolder(initialVault, initialDir = '', items = - +
+ +
+ + +
@@ -331,12 +351,35 @@ export async function promptTargetFolder(initialVault, initialDir = '', items = document.body.appendChild(overlay); const vaultSelect = overlay.querySelector('#obsigate-upload-vault-select'); + const folderFilter = overlay.querySelector('#obsigate-upload-folder-filter'); const folderSelect = overlay.querySelector('#obsigate-upload-folder-select'); + const customFolderInput = overlay.querySelector('#obsigate-upload-custom-folder'); + + const updateFoldersView = async () => { + const fList = await fetchFoldersForVault(selectedVault); + folderSelect.innerHTML = renderFolderOptions(fList, folderSelect.value, filterText); + }; vaultSelect.addEventListener('change', async () => { selectedVault = vaultSelect.value; - const fList = await fetchFoldersForVault(selectedVault); - folderSelect.innerHTML = renderFolderOptions(fList, ''); + await updateFoldersView(); + }); + + folderFilter.addEventListener('input', () => { + filterText = folderFilter.value; + updateFoldersView(); + }); + + folderSelect.addEventListener('change', () => { + if (folderSelect.value) { + customFolderInput.value = ''; + } + }); + + customFolderInput.addEventListener('input', () => { + if (customFolderInput.value.trim()) { + folderSelect.selectedIndex = -1; + } }); const close = (val) => { @@ -352,7 +395,8 @@ export async function promptTargetFolder(initialVault, initialDir = '', items = overlay.querySelector('.modal-confirm-btn').addEventListener('click', () => { const v = vaultSelect.value; - const d = folderSelect.value; + const customPath = customFolderInput.value.trim().replace(/^[\/\\]+|[\/\\]+$/g, ''); + const d = customPath || folderSelect.value || ''; close({ vault: v, targetDir: d }); }); }); diff --git a/frontend/locales/en.json b/frontend/locales/en.json index 403eec9..2de3e7e 100644 --- a/frontend/locales/en.json +++ b/frontend/locales/en.json @@ -645,6 +645,8 @@ "upload.target_vault": "Target Vault", "upload.vault_root": "/ (Vault root)", "upload.target_directory": "Target subdirectory", + "upload.filter_folders": "Filter or search a folder...", + "upload.custom_folder": "Or enter a new subfolder path...", "upload.import_summary": "Items to import: {files} file(s), {dirs} folder(s)", "upload.import_button": "Import", "editor.cancel": "Cancel", diff --git a/frontend/locales/fr.json b/frontend/locales/fr.json index 1bd8b32..c975263 100644 --- a/frontend/locales/fr.json +++ b/frontend/locales/fr.json @@ -645,6 +645,8 @@ "upload.target_vault": "Voute cible", "upload.vault_root": "/ (Racine de la voute)", "upload.target_directory": "Sous-répertoire cible", + "upload.filter_folders": "Filtrer ou rechercher un dossier...", + "upload.custom_folder": "Ou saisir un nouveau sous-dossier...", "upload.import_summary": "Éléments à importer : {files} fichier(s), {dirs} dossier(s)", "upload.import_button": "Importer", "editor.cancel": "Annuler",