apunkt/SurfSense
1
0
Fork 0
mirror of https://github.com/MODSetter/SurfSense.git synced 2026-04-26 09:16:22 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions

refactor: add isActive prop to SidebarButton and NavSection for improved active state management; update styles accordingly

Browse source
This commit is contained in:
Anish Sarkar 2026-03-22 00:01:50 +05:30
parent 020d806b1f
commit 44f59bfb61
3 changed files with 8 additions and 4 deletions
Download patch file Download diff file Expand all files Collapse all files

8
surfsense_web/components/layout/ui/sidebar/SidebarButton.tsx
View file

@ -10,6 +10,7 @@ interface SidebarButtonProps {
label: string;
onClick?: () => void;
isCollapsed?: boolean;
isActive?: boolean;
badge?: React.ReactNode;
/** Overlay in the top-right corner of the collapsed icon (e.g. status badge) */
collapsedOverlay?: React.ReactNode;
@ -37,12 +38,15 @@ export function SidebarButton({
label,
onClick,
isCollapsed = false,
isActive = false,
badge,
collapsedOverlay,
expandedIconNode,
className,
buttonProps,
}: SidebarButtonProps) {
const activeClassName = "bg-accent text-accent-foreground";
if (isCollapsed) {
return (
<Tooltip>
@ -50,7 +54,7 @@ export function SidebarButton({
<button
type="button"
onClick={onClick}
className={cn(collapsedClassName, className)}
className={cn(collapsedClassName, isActive && activeClassName, className)}
{...buttonProps}
>
<Icon className="h-4 w-4" />
@ -70,7 +74,7 @@ export function SidebarButton({
<button
type="button"
onClick={onClick}
className={cn(expandedClassName, className)}
className={cn(expandedClassName, isActive && activeClassName, className)}
{...buttonProps}
>
{expandedIconNode ?? <Icon className="h-4 w-4 shrink-0" />}