From 98066274faa633488fd727ae3abe80240e586f74 Mon Sep 17 00:00:00 2001
From: Julien Froidefond <julien.froidefond@cdbdx.biz>
Date: Thu, 13 Feb 2025 07:58:35 +0100
Subject: [PATCH] fix: correction de l'erreur d'hydration dans la sidebar

---
 src/components/layout/Sidebar.tsx | 100 +++++++++++++++---------------
 1 file changed, 51 insertions(+), 49 deletions(-)

diff --git a/src/components/layout/Sidebar.tsx b/src/components/layout/Sidebar.tsx
index 653a2ec..45e6b78 100644
--- a/src/components/layout/Sidebar.tsx
+++ b/src/components/layout/Sidebar.tsx
@@ -122,58 +122,60 @@ export function Sidebar({ isOpen }: SidebarProps) {
           </div>
         </div>
 
-        <>
-          <div className="px-3 py-2">
-            <div className="space-y-1">
-              <div className="mb-2 px-4 flex items-center justify-between">
-                <h2 className="text-lg font-semibold tracking-tight">Bibliothèques</h2>
-                <button
-                  onClick={handleRefresh}
-                  disabled={isRefreshing}
-                  className="p-1 hover:bg-accent hover:text-accent-foreground rounded-md transition-colors"
-                  aria-label="Rafraîchir les bibliothèques"
-                >
-                  <RefreshCw className={cn("h-4 w-4", isRefreshing && "animate-spin")} />
-                </button>
-              </div>
-              {isLoading ? (
-                <div className="px-3 py-2 text-sm text-muted-foreground">Chargement...</div>
-              ) : libraries.length === 0 ? (
-                <div className="px-3 py-2 text-sm text-muted-foreground">Aucune bibliothèque</div>
-              ) : (
-                libraries.map((library) => (
-                  <Link
-                    key={library.id}
-                    href={`/libraries/${library.id}`}
-                    className={cn(
-                      "flex items-center rounded-lg px-3 py-2 text-sm font-medium hover:bg-accent hover:text-accent-foreground",
-                      pathname === `/libraries/${library.id}` ? "bg-accent" : "transparent"
-                    )}
+        {isAuthenticated && (
+          <>
+            <div className="px-3 py-2">
+              <div className="space-y-1">
+                <div className="mb-2 px-4 flex items-center justify-between">
+                  <h2 className="text-lg font-semibold tracking-tight">Bibliothèques</h2>
+                  <button
+                    onClick={handleRefresh}
+                    disabled={isRefreshing}
+                    className="p-1 hover:bg-accent hover:text-accent-foreground rounded-md transition-colors"
+                    aria-label="Rafraîchir les bibliothèques"
                   >
-                    <Library className="mr-2 h-4 w-4" />
-                    {library.name}
-                  </Link>
-                ))
-              )}
-            </div>
-          </div>
-
-          <div className="px-3 py-2">
-            <div className="space-y-1">
-              <h2 className="mb-2 px-4 text-lg font-semibold tracking-tight">Configuration</h2>
-              <Link
-                href="/settings"
-                className={cn(
-                  "flex items-center rounded-lg px-3 py-2 text-sm font-medium hover:bg-accent hover:text-accent-foreground",
-                  pathname === "/settings" ? "bg-accent" : "transparent"
+                    <RefreshCw className={cn("h-4 w-4", isRefreshing && "animate-spin")} />
+                  </button>
+                </div>
+                {isLoading ? (
+                  <div className="px-3 py-2 text-sm text-muted-foreground">Chargement...</div>
+                ) : libraries.length === 0 ? (
+                  <div className="px-3 py-2 text-sm text-muted-foreground">Aucune bibliothèque</div>
+                ) : (
+                  libraries.map((library) => (
+                    <Link
+                      key={library.id}
+                      href={`/libraries/${library.id}`}
+                      className={cn(
+                        "flex items-center rounded-lg px-3 py-2 text-sm font-medium hover:bg-accent hover:text-accent-foreground",
+                        pathname === `/libraries/${library.id}` ? "bg-accent" : "transparent"
+                      )}
+                    >
+                      <Library className="mr-2 h-4 w-4" />
+                      {library.name}
+                    </Link>
+                  ))
                 )}
-              >
-                <Settings className="mr-2 h-4 w-4" />
-                Préférences
-              </Link>
+              </div>
             </div>
-          </div>
-        </>
+
+            <div className="px-3 py-2">
+              <div className="space-y-1">
+                <h2 className="mb-2 px-4 text-lg font-semibold tracking-tight">Configuration</h2>
+                <Link
+                  href="/settings"
+                  className={cn(
+                    "flex items-center rounded-lg px-3 py-2 text-sm font-medium hover:bg-accent hover:text-accent-foreground",
+                    pathname === "/settings" ? "bg-accent" : "transparent"
+                  )}
+                >
+                  <Settings className="mr-2 h-4 w-4" />
+                  Préférences
+                </Link>
+              </div>
+            </div>
+          </>
+        )}
       </div>
 
       {isAuthenticated && (