menydock update, dashboard page create

taskncoffee-app/src/App.jsx

@@ -3,7 +3,7 @@ import { LoginPage } from './pages/Login'
 import { SignUp } from './pages/SignUp'
 import { AuthLayout } from './layouts/AuthLayout'
 import { Routes, Route, Navigate } from 'react-router'
-import MenuDockVertical from './layouts/DashLayout'
+import Dashboard from './pages/Dashboard'
 
 
 function App() {
@@ -20,9 +20,7 @@ function App() {
       </Route>
 
       <Route path="/dashboard" element={
-        // <div className="min-h-svh bg-background flex justify-start items-start">
-        <MenuDockVertical />
-        // </div>
+        <Dashboard />
       } />
       <Route path="*" element={<Navigate to="/auth/login" replace />} />
     </Routes>

taskncoffee-app/src/components/ui/shadcn-io/menu-dock/index.jsx

@@ -17,7 +17,8 @@ export const MenuDock = ({
   variant = 'default',
   orientation = 'horizontal',
   showLabels = true,
-  animated = true
+  animated = true,
+  showIndicator = true
 }) => {
 
   const finalItems = useMemo(() => {
@@ -122,6 +123,7 @@ export const MenuDock = ({
             className={cn(
               'relative flex flex-col items-center justify-center rounded-lg transition-all duration-200',
               'hover:bg-muted/50 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring',
+              'select-none',
               styles.item,
               isActive && 'text-primary',
               !isActive && 'text-muted-foreground hover:text-foreground'
@@ -153,7 +155,7 @@ export const MenuDock = ({
         );
       })}
       {/* Animated underline for horizontal orientation with labels */}
-      {showLabels && orientation === 'horizontal' && (
+      {showIndicator && showLabels && orientation === 'horizontal' && (
         <div
           className={cn(
             'absolute bottom-2 h-0.5 bg-primary rounded-full transition-all duration-300 ease-out',
@@ -165,7 +167,7 @@ export const MenuDock = ({
           }} />
       )}
       {/* Active indicator for vertical orientation or no labels */}
-      {(!showLabels || orientation === 'vertical') && (
+      {showIndicator && (!showLabels || orientation === 'vertical') && (
         <div
           className={cn(
             'absolute bg-primary rounded-full transition-all duration-300',

taskncoffee-app/src/pages/Dashboard.jsx

@@ -2,12 +2,12 @@
 import { MenuDock } from '@/components/ui/shadcn-io/menu-dock';
 import { Home, Settings, Bell } from 'lucide-react';
 import { Avatar, AvatarImage, AvatarFallback } from '@/components/ui/avatar';
-const sidebarItems = [
+const menuItems = [
     { label: 'home', icon: Home, onClick: () => console.log('Home clicked') },
     { label: 'notifications', icon: Bell, onClick: () => console.log('Notifications clicked') },
     { label: 'settings', icon: Settings, onClick: () => console.log('Settings clicked') },
 ];
-export default function MenuDockVertical() {
+export default function Dashboard() {
     return (
         <div className="min-h-[180px] p-4 flex justify-start items-start">
             <div className="flex flex-col items-center justify-center">
@@ -16,11 +16,14 @@ export default function MenuDockVertical() {
                     <AvatarFallback>CN</AvatarFallback>
                 </Avatar>
                 <MenuDock
-                    items={sidebarItems}
-                    variant="compact"
+                    items={menuItems}
                     orientation="vertical"
+                    showIndicator={false}
+                    variant="default"
+
                 />
             </div>
         </div>
     );
 }
+