import { NavLink } from 'react-router';
import { motion } from 'framer-motion';
import {
LayoutDashboard,
AppWindow,
Search,
CircleHelp,
} from 'lucide-react';
import { cn } from '@/lib/utils';
function getGreeting(): string {
const hour = new Date().getHours();
if (hour < 12) return 'Good Morning';
if (hour < 18) return 'Good Afternoon';
return 'Good Evening';
}
interface SidebarProps {
userName?: string;
botName?: string;
backendStatus?: 'healthy' | 'restarting';
onNavigate?: () => void;
}
export default function Sidebar({ userName, botName = 'Bloby', backendStatus = 'healthy', onNavigate }: SidebarProps) {
const firstName = userName?.split(/\s+/)[0] || 'Human';
return (
);
}
// Shared-layout spring — the active decoration slides between items on nav change.
const activeSpring = { type: 'spring' as const, stiffness: 420, damping: 34 };
/**
* The active-item decoration — a single clean recessed dark fill (no stroke, no
* border, no color). The shared `layoutId` makes it glide from the
* previously-active item to the new one.
*/
function ActiveDecoration() {
return (
);
}
function NavItem({
to,
icon: Icon,
label,
onNavigate,
}: {
to: string;
icon: React.ComponentType<{ className?: string; strokeWidth?: number }>;
label: string;
onNavigate?: () => void;
}) {
return (
{({ isActive }) => (
)}
);
}