refactor: fix sidebar expand functionality and improve button accessibility

This commit is contained in:
Marco Pedone 2025-11-17 17:29:47 +01:00
parent affc441cfc
commit 88bf525ae4

View file

@ -33,26 +33,29 @@ export const Sidebar = ({
setIsAnimating(false); setIsAnimating(false);
}, 300); }, 300);
}; };
//todo click to expand not working on direct links when minimized
return ( return (
<motion.nav <motion.nav
animate={{ width: minimized ? 55 : 192 }} animate={{ width: minimized ? 55 : 192 }}
aria-label="Sidebar Menu" aria-label="Sidebar Menu"
className={cn( className={cn(
"z-30 hidden h-auto w-48 shrink-0 space-y-4 border-muted border-r bg-background pt-3 md:block", "relative z-30 hidden h-auto w-48 shrink-0 space-y-4 border-muted border-r bg-background pt-3 md:block",
className, className,
minimized && "cursor-pointer", minimized && "cursor-pointer",
)} )}
onClick={ >
minimized {minimized && (
? (e) => { <button
aria-label="Expand sidebar"
className="absolute inset-0 z-50 cursor-pointer border-none bg-transparent p-0 hover:bg-black/2"
onClick={(e) => {
e.preventDefault(); e.preventDefault();
e.stopPropagation(); e.stopPropagation();
toggleSidebar(false); toggleSidebar(false);
} }}
: undefined type="button"
} />
> )}
<div <div
className={cn( className={cn(
"flex h-8 items-center justify-between px-4", "flex h-8 items-center justify-between px-4",