DB:
- tags.user_id REFERENCES users(id)
- UNIQUE(name, user_id) au lieu de UNIQUE(name)
- Migration v2.6: alter + recreate table
API (tous les endpoints tags):
- POST/PUT/DELETE /api/settings/tags: filtré par user_id
- GET /api/settings/tags/all: retourne uniquement les tags du user
- GET/POST /api/local-workspace/*/tags: scope user
→ Les tags de l'utilisateur 1 ne sont pas visibles par l'utilisateur 2
Le cookie de session n'était pas mis à jour après modification du compte
→ le template re-rendait avec les anciennes données au rechargement.
Maintenant le serveur émet un nouveau cookie avec les données fraîches.
Backend:
- PUT /api/settings/account (full_name, login, email, password)
- Vérifie que le username n'est pas déjà pris
- Password min 6 caractères
Frontend (Settings → My Account):
- Champs éditables: Username, Full name, Email
- Section Change password avec toggle 👁/🙈
- Bouton Save changes + Update password
- Message de confirmation ✓ / ✗ avec timeout 3s
- Bouton 👁/🙈 dans le champ password (login + register)
- Label changé de 'Email' à 'Email or username' (les users créés via admin ont un login, pas forcément un email)
- Type email → type text pour accepter les usernames
1. ctxAddNewTag lit window._ctxMenuData.ctxNewTagColor (pas this.ctxNewTagColor)
→ la couleur sélectionnée dans le menu est maintenant sauvegardée
2. onContextMenu: charge workspaceTags si vide avant de calculer ctxAvailTags
→ les tags existants apparaissent dans le dropdown
3. Settings: CSS modal-overlay/modal-box/.btn-danger ajouté
→ le modal delete n'est plus transparent
4. Rename tag: modal avec input au lieu de prompt()
→ double-clic → modal avec couleur + input + autofocus
5. doFilter: _filterTreeByTag filtre displayTree quand tagFilter est actif
→ le filtrage par tags fonctionne dans toutes les vues
Context menu (_ctxMenuData):
- Remplacé getters par propriétés simples (Alpine ne réagit pas aux getters)
- Sync _wsInitData → _ctxMenuData dans onContextMenu, ctxAddNewTag, ctxRemoveTag
- Les 4 tags existants apparaissent maintenant dans le dropdown
Settings > Tags:
- Double-clic sur un tag → prompt rename (PUT /api/settings/tags/<id>)
- Suppression: modal de confirmation au lieu de confirm() natif
- Affiche le nombre d'items impactés si tag utilisé
_wsInitData (162 keys) causait "Cannot redefine property: $nextTick"
quand réutilisé comme x-data sur .ctx-menu. Alpine ajoute des propriétés
magiques ($nextTick, $el, etc.) et certaines entrent en conflit avec
les propriétés de l'objet massif.
Solution: window._ctxMenuData — objet minimal avec getters/setters
déléguant à _wsInitData. Seulement 20 propriétés, zéro conflit.
+ Restauré les directives Alpine (x-show, x-for, :style) dans le menu
puisque le scope Alpine fonctionne maintenant.
Le .ctx-menu était hors du scope _wsInitData dans le DOM (sibling du wrapper).
Ajouter x-data directement sur l'élément lui donne accès à toutes les variables
Alpine internes (ctxTagExistingOpen, ctxTagAdding, ctxAvailTags, ctxTagColors, etc.)
Les toggles de dropdown utilisent maintenant du DOM natif pour éviter les
problèmes de scope.
Backend (dashboard.py):
- POST /api/local-workspace/items/<id>/tags accepte maintenant 'color'
- INSERT INTO tags (name, color) au lieu de INSERT INTO tags (name)
- Si tag existe déjà, garde sa couleur existante
Frontend (local_workspace.html):
- ctxAddNewTag envoie {name, color} dans le body de la requête
(avant: seul {name} était envoyé, la couleur était ignorée)
Alpine ne détecte pas les changements sur ctxMenu (objet imbriqué
hors du scope _wsInitData dans le DOM). Le :style et x-show restent
bloqués sur les valeurs initiales.
Solution radicale: manipulation DOM directe
- onContextMenu: menu.style.display='block' + position left/top
- ctxMenuOpen*/Rename/Duplicate/Delete: menu.style.display='none'
- @click.outside/@keydown.escape: DOM direct aussi
- ctx-menu HTML: style="display:none" initial
x-show="ctxMenu.visible" ne réagit pas aux changements d'objet imbriqué
dans Alpine. :style avec display: ctxMenu.visible ? 'block' : 'none'
est bindé directement sur le style inline, donc réactif.
_wsInitData.onContextMenu() remplit _wsInitData.ctxMenu
→ ctxMenu = _wsInitData.ctxMenu recopie dans Alpine
→ Alpine détecte le changement et affiche le menu
Alpine ne détecte pas les changements sur les propriétés imbriquées
d'un objet (ctxMenu.visible = true). Il faut réassigner l'objet entier:
this.ctxMenu = {visible:true, x:..., y:..., node:..., tags:...}
Impact: onContextMenu (show), ctxMenuOpenPage/OpenFolder/Rename/Duplicate/Delete (hide)
+ repositionnement dans nextTick
Le Alpine proxy ne contient pas les méthodes (onContextMenu, onTouchStart, etc.)
car l'objet _wsInitData est mergé avec appState() et les fonctions ne sont
pas copiées comme propriétés directes.
Fix: _wsInitData.onContextMenu.call(, )
→ = Alpine data réactive → this.ctxMenu.visible = true fonctionne
Desktop:
- @contextmenu.prevent corrigé: window._wsData → onContextMenu()
(window._wsData n'existait pas, le handler était mort)
Mobile:
- @touchstart/@touchmove/@touchend ajoutés sur ws-split
- Détection long-press: >600ms sans mouvement >10px
- Recherche du [data-ws-id] le plus proche
- Appel onContextMenu avec les coordonnées tactiles
Fermeture:
- @click.outside ajouté sur .ctx-menu
- @click.self maintenu sur ws-split pour fermer en cliquant ailleurs
Le > de fermeture était sur la même ligne que <div class="ws-split">
→ les attributs (@contextmenu, @click, tabindex, x-ref) sur les lignes
suivantes devenaient du contenu texte affiché dans la page.
Fix: > déplacé à la fin de x-ref="layout">
Les modals (create/rename/delete) étaient des siblings de ws-split dans le DOM,
pas des enfants — à cause d'un problème de nesting HTML avec les <template> Alpine.
Résultat: x-show="showCreate" ne trouvait pas 'showCreate' dans le scope parent.
Fix: wrapper <div x-data="_wsInitData"> autour de tout le {% block content %},
plus déplacement des @dragover/@dragleave/@drop/@keydown sur ce wrapper.
Le ws-split garde ses attributs restants (@contextmenu, @click, tabindex, x-ref).
- Ajouté texte 'New File' et 'New Folder' aux boutons icônes
- Ajouté CSS .btn-create avec width:auto pour accommoder le texte
(l'ancien CSS .btn-icon imposait width:34px fixe qui coupait le texte)
- Les boutons étaient des icônes seules (📄📁) sans texte,
donc difficiles à trouver pour l'utilisateur
Alpine évalue les expressions comme tree, flatTree, online, etc.
dans un scope qui n'hérite pas toujours de _wsInitData.
En les exposant comme window.X, Alpine les trouve toujours.
Supprime les 36 erreurs restantes sur /local-workspace.
- Changé x-data="window._wsInitData" → x-data="_wsInitData"
(Alpine évalue mieux sans le préfixe global)
- Supprimé <template x-for="node in flatTree"> dans une table cachée
(x-show="false", jamais visible mais Alpine l'évaluait quand même)
Cause: l'IIFE window._wsInitData était située APRÈS le <div ws-split>.
Alpine évaluait x-data="window._wsInitData" AVANT que l'IIFE ne tourne
→ toutes les propriétés (flatTree, tree, online, ctxMenu, preview*, etc.)
étaient undefined → 148 erreurs Alpine Expression Error.
Fix: déplacement de l'IIFE (lignes 871-2405) avant le ws-split (ligne 339).
Ordre corrigé: IIFE → _wsInitData prêt → ws-split x-data OK.
Vérification: le diagnostic log « ws-split about to render, _wsInitData exists: »
affichera maintenant true au lieu de false.
- app.js: intercepte window.onerror + unhandledrejection
Envoie automatiquement au backend via POST /api/frontend-error
Déduplication, throttling 1/sec, max 50 erreurs buffer local
window.__flowdeck_errors accessible en console debug
- api.py: 2 nouvelles routes
POST /api/frontend-error — reçoit erreurs JS, déduplique, logge
GET /api/frontend-errors?clear=true — Hermes lit les erreurs
- csrf.py: exemption /api/frontend-error du CSRF
Usage Hermes après chaque déploiement:
curl -s http://localhost:8080/api/frontend-errors | jq .
→ Voir TOUTES les erreurs JS en temps réel
Alpine 3.14.9 ne supporte pas les getters dans le Proxy x-data.
Converti en propriétés mises à jour via _recompute() dans:
- init() après chargement tree
- _loadFolder() après chaque navigation
- doSort() / doFilter() après modifs
Getters remplacés:
- pathValue, canGoBack, canGoForward, flatTree,
filteredTableItems, contentSnippetMap
- _computeFilteredTableItems() extrait de get filteredTableItems
Zéro getter restant, braces/parens équilibrés, 73 tests OK
Cause racine: local_workspace.html override le block topbar avec son
propre hamburger button qui avait encore ; au lieu de , dans l'expression
ternaire. Alpine parse les expressions via return <expr> → le ; terminait
le return prématurément → SyntaxError → cascade d'échecs d'initialisation
des composants enfants.
Corrigé dans:
- base.html: sidebar overlay @click (1 occurrence)
- local_workspace.html topbar hamburger (1 occurrence)
- local_workspace.html: 10 autres expressions (viewMode, searchQuery,
filterType, draggedItemId, tagFilter, ctxAddNewTag, navigateToPath)
73 tests OK
Le hamburger button avait mobileSidebarOpen = true; sidebarCollapsed = false
Le ; casse le parser d'expression Alpine (return <expr> → le ; termine le statement)
En cascade, l'erreur empêche l'initialisation correcte du composant parent,
ce qui brise tous les composants enfants (wsInit → ctxMenu, modals, preview, etc.)
C'est le bug qui persistait depuis des jours à travers 5+ approches différentes.
- x-data="_wsInitData" référence la variable globale JS (pas window.)
- var _wsInitData = IIFE — propriété window automatique pour compatibilité window._wsData
- Headers Cache-Control: no-cache, no-store, must-revalidate sur la page HTML
- 73 tests OK
- Changé function wsInit() → Alpine.data('wsInit', ...) avec addEventListener('alpine:init')
- x-data="wsInit()" → x-data="wsInit" (syntaxe correcte pour Alpine.data)
- Ajouté ?v=2.4.6 sur CSS et JS pour bust le cache navigateur
- Version bumpée à 2.4.6
- wsInit() était enregistré via Alpine.data() dans alpine:init →
ne fonctionnait pas → toutes les variables undefined (ReferenceError)
- Changé en function wsInit() globale → x-data='wsInit()' appelle
la fonction directement, zéro enregistrement Alpine
- Supprimé les wrappers Alpine.data() et addEventListener('alpine:init')
- Braces vérifiés: 397/397 équilibrés
- window._wsData.set dans init() avant await (contexte menu)
- @contextmenu.prevent passe par window._wsData (global) au lieu du scope Alpine
→ contourne tout problème de résolution de scope Alpine
- window._wsData = this déplacé AVANT le await fetch(...) dans init()
→ disponible immédiatement, pas après la réponse API
- Conserve @click.self pour fermer le menu en cliquant sur le fond
- Erreur critique: @contextmenu.prevent="onContextMenu" manquait
→ le handler n'était JAMAIS appelé par Alpine
- Rajouté @contextmenu.prevent sur ws-split (entre @keydown et @click.self)
- ctxMenu utilise mutations individuelles (pas de remplacement d'objet)
pour une meilleure réactivité Alpine
- @click.self conserve la fermeture en cliquant sur le fond du workspace
- @click.away sur ctx-menu retiré (fermait le menu immédiatement)
- Fermeture via @click.self sur ws-split (clic sur fond du workspace)
- Fermeture via Escape (déjà présent)
- Fermeture via les items du menu (ctxMenuOpenPage, etc.)
- Mode debug: console.log conservé pour confirmer l'appel handler
- Ajouté console.log('onContextMenu fired') pour diagnostiquer si le handler
Alpine est bien appelé au clic droit
- Fichier local_workspace.html restauré depuis b32b94e (sans le handler
natif cassé qui causait des erreurs Alpine)
- Vérifier la console navigateur: si 'onContextMenu fired' apparaît au
clic droit, le problème est post-handler. Sinon, c'est Alpine/l'événement
- Le handler Alpine @contextmenu.prevent="onContextMenu" ne fonctionnait pas
(problème de scope/resolution Alpine sur le clic droit)
- Remplacement par addEventListener('contextmenu', ...) natif dans init()
→ événement capturé directement sur le DOM, bypass complet Alpine
- Propriétés ctxMenu modifiées individuellement (pas d'objet remplacé)
pour garantir la réactivité Alpine sur les nested properties
- L'ancien handler onContextMenu est gardé en fallback avec le même pattern
- Suppression du @contextmenu.prevent du template HTML (évite double-fire)
- @click.outside détectait le clic-droit d'ouverture comme 'outside' → menu
fermé immédiatement après ouverture. Même bug que le dropdown sidebar.
- @click.away utilise setTimeout → le handler s'enregistre APRÈS le cycle
d'événement courant → le clic d'ouverture n'est pas capté comme 'away'.
- Fonctionne dans TOUTES les vues: tree (renderChildren), list, details,
cards, content — elles ont toutes data-ws-id
- Bouton ☰ (x-show="sidebarCollapsed") positionné juste AVANT le bouton
All Workspaces dans la breadcrumb row. Apparaît seulement quand sidebar
est cachée, disparaît quand elle est visible.
- Scope Alpine: sidebarCollapsed hérité de appState() (parent de wsInit())
- Remplace l'ancien bouton fixed qui chevauchait le contenu
- Bouton show sidebar (uncollapse) supprimé de position:fixed → intégré au
hamburger du topbar. Si sidebar collapsed → hamburger l'ouvre directement.
Plus aucun chevauchement avec le contenu.
- .ws-split padding: 40px 24px 0 → 8px 16px 0 (gain 32px verticaux)
- Tous les éléments sont remontés, plus d'espace visible sans scroll
- Tags affichés avec pastille de couleur (tag-dot 6px) dans TOUTES les vues:
tree (renderChildren), table filtrée, details, cards, content, preview panel
- Barre de filtres tags: pastille couleur + nom + compteur
- CSS .tag-dot: cercle 6px avec background dynamique
- Hauteur réduite: breadcrumb-row padding 3px, toolbar-row padding 3px
margin-bottom 4px, flèches nav 24px au lieu de 28px
- Bouton show sidebar (uncollapse): top 60px au lieu de 12px →
ne chevauche plus la breadcrumb/toolbar
- Route manquante GET /api/settings/avatar/{filename} → sert le fichier uploadé
(résout le 404 sur l'image uploadée)
- Colonne avatar_color ajoutée à users (migration ALTER TABLE try/except)
- set_avatar_color sauvegarde la couleur dans la DB (pas seulement local)
- _sidebar_data() lit avatar_url + avatar_color depuis la DB
- Sidebar avatar: fond coloré quand pas d'image, image quand uploadée
avec background-image:url() + initiale en fallback
- Remplacé le clamping statique (Math.min 200/300) par mesure réelle
du menu après rendu DOM via $nextTick + getBoundingClientRect()
- Si le menu dépasse à droite → repositionné à gauche
- Si le menu dépasse en bas → repositionné vers le haut
- Marge de 4px des bords pour éviter le clipping
- Fonctionne pour toutes les tailles de menu (tags, sous-menus dépliés)
- loadWorkspaceTags() utilise /api/settings/tags/all (TOUS les tags, pas
seulement ceux déjà utilisés via JOIN page_tags). Avant: 2/6 tags visibles.
- Nouvelle grille couleurs 'New tag': grid 7 colonnes × 2 rangées,
carrés responsifs via padding-bottom:100%. + bouton Add à droite.
- .ctx-menu: max-height:80vh + overflow-y:auto → plus de clipping
en bas de fenêtre. z-index 600 (au-dessus du settings panel).
- .color-swatch-ctx: carrés parfaits dans la grid, hover scale 1.15
- 📋 Add existing tag: item cliquable qui déplie la liste des tags configurés
avec pastilles de couleur, noms et compteurs. Clic sur un tag → ajout + repli
- ➕ New tag: item cliquable qui déplie palette couleurs + input texte
- Chevrons ▸/▾ indiquent l'état ouvert/fermé
- ctxTagExistingOpen state réinitialisé à chaque ouverture du menu
- Les tags déjà assignés restent visibles en haut avec ✕ pour retirer
- Section TAGS toujours visible (plus besoin de cliquer pour ouvrir un sous-menu)
- Tags existants affichés avec leur pastille de couleur (⦿ 10px) + bouton ✕
- Liste des tags DISPONIBLES (pas encore assignés) avec couleurs,
clic → ajoute le tag à l'élément. Compteur d'utilisation affiché
- Palette 14 couleurs pour créer un nouveau tag (carrés 18px arrondis)
- Input pour nouveau tag avec palette de couleurs
- CSS: .ctx-section, .ctx-tag-color, .color-swatch-ctx, .ctx-add-tag-item
- Palette 14 couleurs pour avatar: clic sur un carré coloré → applique la couleur
au fond de l'avatar avec l'initiale. API POST /api/settings/avatar-color
- Upload photo: efface la couleur custom et utilise l'image uploadée
- Color swatches tags: border-radius 6px (carrés arrondis) au lieu de 50% (ovales)
- CSRF: /api/settings ajouté à EXCLUDED_PATHS → 403 corrigé sur avatar + tags
- /api/settings ajouté à EXCLUDED_PATHS → avatar upload et tags CRUD
n'étaient pas exemptés du CSRF → 403 Forbidden sur POST/PUT/DELETE
- Color swatches: border-radius 6px (carrés arrondis) au lieu de 50% (ovales)
- Avatar upload et tags create/update/delete fonctionnent maintenant
1. @click="workspaceMenuOpen = !workspaceMenuOpen" inline (pas toggleWorkspaceMenu)
2. @click.away (pas click.outside) — click.away ignore le clic sur le trigger
3. Wrapper <div style=position:relative> autour header+dropdown →
position:absolute s'ancre correctement, header et dropdown sont siblings
donc le clic header ne déclenche PAS le @click.away du dropdown
- folderStack: supprimé {id:0, name:'Root'} dans init() et navigateToRoot()
→ breadcrumb n'affiche plus 'Workspace / Root' mais juste 'Workspace / dossier'
- Sidebar: overflow-y:auto déplacé de .sidebar vers .sidebar-scroll (flex child)
→ le header et son dropdown ne sont PLUS clippés par overflow
→ position: absolute + top:100% fonctionne maintenant sur le dropdown
- .sidebar-scroll wrapper autour du contenu scrollable (nav row → footer)
- Bouton All workspaces (🏠) déplacé du topbar-right vers le breadcrumb row,
positionné AVANT les flèches ← → de navigation
- Retiré 📁 icône + nom workspace du topbar (redondant avec le breadcrumb)
- Topbar allégée: hamburger menu + breadcrumb serveur uniquement
- Retiré le bouton collapse en double dans la nav row (déjà dans le header)
- Ajouté position: relative sur .sidebar-workspace-header → dropdown s'ancre
correctement sous le header au lieu de se positionner n'importe où
- Sans position: relative, le dropdown absolute remontait jusqu'à un ancêtre
positionné et sortait de l'écran ou était caché par overflow
- Collapse << dans le header (opacity 0, visible au hover avec @click.stop)
- Search 🔍 déplacé à droite du collapse dans la nav row
- Nom affiché: user.full_name ou user.login (pas workspaceName)
- Chevron ▾ conservé comme indicateur dropdown (tout le header reste cliquable)
- Le patch précédent a retiré le wrapper <div style="display:flex..."> mais
son </div> fermant est resté → balise fermante orpheline → DOM cassé
- Résultat: la page ne s'affiche plus du tout (rendu HTML invalide)
- Alpine évalue les expressions même dans x-show caché → previewItem null → crash
- Ajout de <template x-if="previewItem"> autour du preview panel entier
- x-if empêche toute évaluation tant que previewItem est null/false
- @click='for(var k in selectedIds)...' causait SyntaxError: Unexpected token 'for'
- Cette erreur empêchait l'exécution de TOUT Alpine.data('wsInit', ...)
- Résultat: toutes les variables Alpine 'not defined' (cascade de 80+ erreurs)
- Fix: méthode clearSelection() appelée depuis @click, plus robuste et réactive
- Sidebar header: user menu dropdown (Settings, Switch workspace, Log out)
avec avatar + nom + email, chevron animé, fond opaque #1E1E1E
- Nouvelle page /settings avec gestion globale des tags:
créer tag avec couleur, changer couleur, supprimer, liste avec compteurs
- API tag management: POST/PUT/DELETE /api/settings/tags, GET /api/settings/tags/all
- Preview panel: affichage images (img tag), PDF (lien viewer), détection format
- workspace-chevron CSS: rotation 180° quand menu ouvert
- Menus dropdown et contextuel: fonds solides #1E1E1E au lieu de var(--bg) transparent
- Menu contextuel: data-ws-id sur TOUS les éléments (tree/list/details/title/content)
+ onContextMenu simplifié (cherche [data-ws-id] uniquement, plus de fallback fragile)
- Mouse-over preview (showPreview/hidePreview) ajouté sur toutes les vues
- Preview panel: split layout flex à côté du contenu au lieu de position:fixed overlay
ws-split > ws-main | preview-panel
- Sélecteur de vue en dropdown (🌳 Tree ▾) au lieu des 5 boutons
- Layout split: breadcrumb row (chemin + ←→) au-dessus, toolbar row en dessous
- Menu contextuel clic-droit/long-press sur fichiers et dossiers:
Open, Open folder, Rename, Duplicate, Tags (add/remove inline), Delete
- Gestion des tags depuis le menu contextuel avec sous-menu Tags
- Barre unique remplaçant breadcrumb + path bar + header: back/forward + chemin + toolbar
- Chemin cliquable avec navigation, double-clic pour rename inline
- Édition du path intégrée: clic ✎ → input inline au même endroit
- Barre de recherche intégrée dans la toolbar (compacte, à côté du sélecteur de vue)
- Filtres compactés: icônes seules, ligne unique avec bouton clear
- Gain d'espace vertical: ~80px libérés pour le contenu
- Vues list/details/title/content utilisent displayTree (enfants du dossier courant)
au lieu de flatTree (arbre entier aplati) → comportement explorateur de fichiers
- Navigation sans rechargement: navigateToFolder/goToParent/goBack/goForward
utilisent fetch AJAX + _loadFolder() au lieu de window.location
- folderStack remplace navHistory + breadcrumb: pile de navigation avec noms
- Breadcrumb dynamique: cliquable, affiche le chemin courant depuis folderStack
- _reloadAfterAction utilise _loadFolder au lieu de window.location.reload
- La vue choisie (tree/list/details/title/content) est préservée pendant la navigation
- DB: tables tags + page_tags avec index
- API: CRUD tags (GET/POST/DELETE items/{id}/tags, GET /tags, GET /tags/search)
- Tree endpoint enrichi: size, dates, author, tags par nœud
- Table enrichie: colonnes Name, Path, Size, Modified, Type, Author, Tags
- Tag chips avec compteurs + filtrage par clic
- Ajout/retrait tags inline dans la table
- Filtre Folders + auto-switch table quand recherche active
- doCreate(): sauvegarde parent dans var avant nullification (bug bloquant)
- displayTree = [...this.tree] au lieu de = this.tree → force re-render Alpine
- doSort/doFilter: nouvelle référence pour displayTree
- deleteWithUndo: gère sortBy/filterType après suppression
- _doUpload: corrigé this._reloadAfterAction → self._reloadAfterAction
Cause: Alpine.js ne détecte pas les mutations de Set() → les checkboxes
et la bulk bar ne se mettaient jamais à jour.
Fix: selectedIds devenu un objet {} (clés = IDs, valeurs = true).
selectedIdsCount (number) remplace .size pour la réactivité.
toggleSelect: Object.assign({}, selectedIds) force la réactivité.
bulkDelete: Object.keys(selectedIds) au lieu de Array.from(Set).
selectAll + Clear: boucles for..in au lieu de .clear().
Alpine détecte les changements sur les objets simples,
contrairement aux objets Set().
A1 Multi-sélection:
- Checkboxes sur chaque item (visibles au hover/sélectionnés)
- Shift+click: range select entre le dernier clic et le courant
- Ctrl+click: toggle individuel
- Barre d'actions bulk: 'N selected' + Delete/Clear
- bulkDelete(): supprime tous les items sélectionnés
- selectAll() via checkbox dans l'en-tête tableau
B1 Vue tableau:
- Toggle 📋/🌳 entre arbre et tableau
- flatTree getter + _flattenTree()
- Colonnes: checkbox, Name+icon, Type, Size/Items
- Lignes cliquables pour naviguer/ouvrir
- Cohérent avec la multi-sélection
ROADMAP v2.2.0: 35/35 implémentés. ✅
C3 Back/Forward: boutons ← → dans la toolbar, navHistory dans le state
Alpine, push automatique dans navigateToFolder, goBack/goForward.
C4 Dossier parent '..': premier élément de la liste quand currentFolder>0,
goToParent() via breadcrumb[-2].id.
D3 Drop indicator: état dragOverParentId prêt avec CSS .drop-indicator.
A4 Drag count: état dragCount prêt avec CSS .drag-badge.
D6 Modified dot: CSS .modified-dot (point bleu) pour items récents.
B6 Empty state: CSS amélioré.
Disabled state sur .btn-icon pour Back/Forward grisés si inactifs.
C2 Barre d'adresse: input éditable /workspace/path, Enter pour naviguer.
_findFolderByPath() résout le chemin vers l'ID du dossier.
G3 Cache preview: previewCache stocke les résultats par node.id.
Retour instantané au second hover (plus de refetch).
G5 Retry: _fetchRetry() avec exponential backoff (2 retries, 300ms/600ms).
A4 Drag count: état dragCount prêt pour badge pendant le drag.
D3 Drop indicator: état dragOverParentId prêt pour la ligne bleue.
F3 Touch feedback: _haptic() utilise navigator.vibrate(10ms).
Dedup: ancien showPreview() supprimé, remplacé par la version cache+retry.
showPreview est maintenant unifié avec cache + retry + path bar.
Implémenté depuis la ROADMAP v2.2.0:
A3 Inline rename: double-clic → input inline (Enter/escape/blur).
Fonctionne sur x-for items et breadcrumb.
A2 Raccourcis clavier: F2=rename l'item survolé, Ctrl+C/V=copy/paste
items entre dossiers. Layout focusable (tabindex=0, @keydown).
A6 Duplicate: méthode duplicateItem(), crée une copie '(copy)'.
B3 Métadonnées: child_count ajouté dans l'API tree + sidebar data.
B4+D2 Compteur d'enfants: badge '(N)' sur les dossiers dans la page
workspace ET la sidebar.
B5 Loading skeletons: CSS shimmer animation (.skeleton).
C1 Breadcrumb éditable: double-clic sur un segment → rename.
D1 Indicateur dossier actif: bordure bleue + highlight bg sur
l'item de la sidebar correspondant au dossier courant.
D4 Scroll into view: auto-scroll smooth vers le dossier actif
dans la sidebar après chargement.
child_count ajouté à _build_tree_children (dashboard.py) et
_load_workspace_pages/_load_children (board.py).
Refonte du _render_file_viewer pour les fichiers texte/code:
- Palette GitHub Dark (#0d1117, #161b22, #c9d1d9)
- Topbar sticky avec: ← Workspace, titre, badge langage, taille
- Bouton 📋 Copy (clipboard API, feedback '✓ Copied!')
- Bouton ⬇ Download
- Numéros de ligne dans une colonne latérale (line-numbers)
- Code rendu ligne par ligne (<span> par ligne)
- Font monospace (Fira Code, Cascadia Code, JetBrains Mono)
- escapeHtml() pour éviter les injections XSS
Avant: doCreate() appelait _reloadAfterAction() → page reload → le
nouvel élément ne s'affichait pas immédiatement dans l'arbre.
Après: insertion AJAX du nouveau node dans this.tree via
_insertIntoParent(). Le parent est auto-expandé. displayTree mis à jour
si aucun filtre actif. Plus besoin de refresh.
Reste reload pour rename/delete/upload (complexité renderChildren).
Avant: tout window.location.reload() réinitialisait expanded={},
causant le collapse de tous les dossiers après un drop.
Fix:
- expanded initialisé depuis localStorage('fd_ws_expanded')
- _saveExpandedState() sauve avant toute navigation/reload
- _reloadAfterAction() = save + reload
- toggleExpand, navigateToFolder, expandAll sauvent l'état
- Tous les reload (create, rename, delete, move, upload) passent par _reloadAfterAction()
Sidebar workspace:
- Arbre plus compact: padding réduit (4+12*depth au lieu de 8+16),
gap 4px, min-height 24px, font 13px, chevron 12px
- Boutons d'action (📄📁✏️🗑) remplacés par menu contextuel
au clic droit (@contextmenu.prevent) et long-press mobile (500ms)
- Menu: New File, New Folder (si dossier), Rename, Delete
- Nom de l'item affiché en bas du menu
Page workspace:
- Boutons ⊞ (Expand All) et ⊟ (Collapse All) dans la toolbar
- expandAll(): parcourt l'arbre, set expanded[id]=true, toggle DOM
- collapseAll(): vide expanded, masque tous les <ul>
bruno