Change Dashboard Sidebar

components/ui/Sidebar.tsx

@@ -2,10 +2,18 @@
 
 import SidebarContent from './SidebarContent';
 
-const Sidebar = () => {
+interface SidebarProps {
+  isCollapsed?: boolean;
+}
+
+const Sidebar = ({ isCollapsed = false }: SidebarProps) => {
   return (
-    <div className="hidden md:block h-[calc(100vh-4rem)] w-[250px] fixed">
-      <SidebarContent />
+    <div className={`hidden md:flex h-screen w-64 flex-col fixed left-0 top-0 z-40 transition-transform duration-300 ease-in-out ${
+      isCollapsed ? '-translate-x-full' : 'translate-x-0'
+    }`}>
+      <div className="flex-1 overflow-y-auto border-r bg-background">
+        <SidebarContent />
+      </div>
     </div>
   );
 };