fix: impossible d'ouvrir les sous-dossiers au-delà de 2 niveaux
FlowDeck CI / test (push) Failing after 4s
FlowDeck CI / docker (push) Has been skipped

Cause: renderChildren génère du HTML statique (x-html). Le chevron
appelait toggleExpand(id) qui mettait à jour this.expanded[id] mais
le <ul> des enfants n'avait pas de x-show → le DOM ne réagissait pas.

Fix: toggleExpand(id, btn) accepte maintenant l'élément bouton.
Pour les items renderChildren, il:
- toggle la classe CSS 'open' sur le chevron (rotation 90°)
- trouve le <ul class=ws-tree> frère dans le <li> parent
- bascule son style.display entre '' et 'none'
This commit is contained in:
2026-07-11 10:14:32 -04:00
parent 722c7103de
commit 47299113a8
+13 -2
View File
@@ -356,7 +356,7 @@ document.addEventListener('alpine:init', function() {
var icon = c.is_folder ? '📁' : '📄';
html += '<li><div class="ws-tree-item" style="padding-left:'+(depth*20)+'px" draggable="true" data-folder-id="'+(c.is_folder?c.id:'')+'" ondragstart="var d=document.querySelector(\'[x-data]\').__x.$data;d.onInternalDragStart(event,'+c.id+')" ondragend="event.target.style.opacity=\'\'">';
if (c.is_folder && hasKids) {
html += '<button class="ws-chevron" onclick="event.stopPropagation();document.querySelector(\'[x-data]\').__x.$data.toggleExpand('+c.id+')">▶</button>';
html += '<button class="ws-chevron" onclick="event.stopPropagation();var d=document.querySelector(\'[x-data]\').__x.$data;d.toggleExpand('+c.id+',this)">▶</button>';
} else {
html += '<span style="width:16px;flex-shrink:0;"></span>';
}
@@ -389,9 +389,20 @@ document.addEventListener('alpine:init', function() {
return s.replace(/\\/g,'\\\\').replace(/'/g,"\\'").replace(/"/g,'&quot;');
},
toggleExpand(id) {
toggleExpand(id, btn) {
this.expanded[id] = !(this.expanded[id] || false);
this.expanded = Object.assign({}, this.expanded);
// For renderChildren static HTML: toggle the sibling <ul> + chevron rotation
if (btn) {
btn.classList.toggle('open', this.expanded[id]);
var li = btn.closest('li');
if (li) {
var ul = li.querySelector(':scope > ul.ws-tree');
if (ul) {
ul.style.display = this.expanded[id] ? '' : 'none';
}
}
}
},
navigateToFolder(id) {