frontend initiatewith shadcn uis

2026-08-25 16:20:50 +05:30
parent 92fef1dfa8
commit f1c036d1d8
136 changed files with 20257 additions and 0 deletions
@@ -0,0 +1,52 @@
+'use client'
+
+import Link from 'next/link'
+import { usePathname } from 'next/navigation'
+import { HugeiconsIcon } from '@hugeicons/react'
+
+import { cn } from '@/lib/utils'
+import { useAuth } from '@/contexts/auth-context'
+import { BOTTOM_NAV_CANDIDATES, type NavItem } from '@/config/nav'
+
+const MAX_TABS = 5
+
+export function BottomNav() {
+  const pathname = usePathname()
+  const { permissions } = useAuth()
+
+  const visibleItems: NavItem[] = BOTTOM_NAV_CANDIDATES.filter((item) => {
+    if (!item.permission) return true
+    return permissions.includes('*') || permissions.includes(item.permission)
+  }).slice(0, MAX_TABS)
+
+  return (
+    <nav className="fixed bottom-0 left-0 right-0 z-50 border-t border-border bg-background md:hidden">
+      <div className="flex h-16 items-stretch">
+        {visibleItems.map((item) => {
+          const isActive =
+            pathname === item.href ||
+            (item.href !== '/' && pathname.startsWith(item.href))
+          return (
+            <Link
+              key={item.href}
+              href={item.href}
+              className={cn(
+                'flex flex-1 flex-col items-center justify-center gap-1 text-xs transition-colors',
+                isActive
+                  ? 'text-primary'
+                  : 'text-muted-foreground hover:text-foreground',
+              )}
+            >
+              <HugeiconsIcon
+                icon={item.icon}
+                size={22}
+                className={isActive ? 'text-primary' : undefined}
+              />
+              <span className="truncate">{item.title}</span>
+            </Link>
+          )
+        })}
+      </div>
+    </nav>
+  )
+}