julienfroidefond/stripstream
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: correction de l'erreur d'hydration dans la sidebar

Browse Source
This commit is contained in:
Julien Froidefond
2025-02-13 07:58:35 +01:00
parent 6c00566c75
commit 98066274fa
1 changed files with 51 additions and 49 deletions
Download Patch File Download Diff File Expand all files Collapse all files

100
src/components/layout/Sidebar.tsx
View File

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