From 978b286990a6752d596d3741e7d9f3abbe1d7a44 Mon Sep 17 00:00:00 2001
From: bruno <bruno.charest@gmail.com>
Date: Sun, 19 Jul 2026 14:58:34 -0400
Subject: [PATCH] =?UTF-8?q?fix(library):=20supprimer=20x-show=20du=20table?=
 =?UTF-8?q?au=20+=20gestion=20visibilit=C3=A9=20dans=20=5FrenderTable?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Le x-show sur #lib-table dépendait de flatItems.length,
qu'Alpine 3.14.9 ne détecte pas. Maintenant _renderTable()
contrôle l'affichage/masquage directement via style.display.
---
 app/templates/library.html | 19 ++++++++++++++++---
 1 file changed, 16 insertions(+), 3 deletions(-)

diff --git a/app/templates/library.html b/app/templates/library.html
index b31f19e..de74373 100644
--- a/app/templates/library.html
+++ b/app/templates/library.html
@@ -207,12 +207,12 @@
   </div>
 
   <!-- ── Loading ── -->
-  <div x-show="loading" class="lib-loading">
+  <div x-show="loading" class="lib-loading" id="lib-loading">
     <p>Loading…</p>
   </div>
 
   <!-- ── Table ── -->
-  <div class="lib-table" x-show="!loading && flatItems.length > 0" id="lib-table">
+  <div class="lib-table" id="lib-table">
     <div class="lib-table-header">
       <div class="th lib-col-name sortable" @click="sortBy='name';doSort()">Page name</div>
       <div class="th lib-col-author sortable" @click="sortBy='author';doSort()">Created by</div>
@@ -231,7 +231,7 @@
   </div>
 
   <!-- ── Empty state ── -->
-  <div x-show="!loading && flatItems.length === 0" class="lib-empty">
+  <div x-show="!loading && flatItems.length === 0" class="lib-empty" id="lib-empty">
     <div class="empty-icon" x-text="emptyIcon"></div>
     <h3 x-text="emptyTitle"></h3>
     <p x-text="emptyText"></p>
@@ -319,7 +319,20 @@ function libraryPage() {
     _renderTable() {
       var self = this;
       var body = document.getElementById('lib-table-body');
+      var table = document.getElementById('lib-table');
+      var emptyDiv = document.getElementById('lib-empty');
+      var loadingDiv = document.getElementById('lib-loading');
       if (!body) return;
+      
+      // Show/hide table vs empty state
+      if (this.flatItems.length === 0) {
+        if (table) table.style.display = 'none';
+        if (emptyDiv) emptyDiv.style.display = '';
+        return;
+      }
+      if (table) table.style.display = '';
+      if (emptyDiv) emptyDiv.style.display = 'none';
+      if (loadingDiv) loadingDiv.style.display = 'none';
       var html = '';
       for (var i = 0; i < this.flatItems.length; i++) {
         var item = this.flatItems[i];