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

feat: sidebar resizing with mouse drag support

Browse source
This commit is contained in:
Eric Lammertsma 2026-02-09 10:48:43 -05:00
parent 20a13df7e7
commit 64e118befd
2 changed files with 114 additions and 2 deletions
Download patch file Download diff file Expand all files Collapse all files

15
surfsense_web/components/layout/ui/sidebar/Sidebar.tsx
View file

@ -7,6 +7,7 @@ import { Skeleton } from "@/components/ui/skeleton";
import { Tooltip, TooltipContent, TooltipTrigger } from "@/components/ui/tooltip";
import { cn } from "@/lib/utils";
import type { ChatItem, NavItem, PageUsage, SearchSpace, User } from "../../types/layout.types";
import { useSidebarResize } from "../../hooks/useSidebarResize";
import { ChatListItem } from "./ChatListItem";
import { NavSection } from "./NavSection";
import { PageUsageDisplay } from "./PageUsageDisplay";
@ -82,15 +83,25 @@ export function Sidebar({
disableTooltips = false,
}: SidebarProps) {
const t = useTranslations("sidebar");
const { sidebarWidth, handleMouseDown, isDragging } = useSidebarResize();
return (
<div
className={cn(
"flex h-full flex-col bg-sidebar text-sidebar-foreground transition-all duration-200 overflow-hidden",
isCollapsed ? "w-[60px]" : "w-[240px]",
"relative flex h-full flex-col bg-sidebar text-sidebar-foreground overflow-hidden",
isCollapsed ? "w-[60px] transition-all duration-200" : "",
!isCollapsed && !isDragging ? "transition-all duration-200" : "",
className
)}
style={!isCollapsed ? { width: sidebarWidth } : undefined}
>
{/* Resize handle on right border */}
{!isCollapsed && (
<div
onMouseDown={handleMouseDown}
className="absolute right-0 top-0 h-full w-1 cursor-col-resize hover:bg-border active:bg-border z-10"
/>
)}
{/* Header - search space name or collapse button when collapsed */}
{isCollapsed ? (
<div className="flex h-14 shrink-0 items-center justify-center border-b">