Add Oudelaa dashboard API integration

oudelaa_dashboard/components/dashboard/mobile-nav.tsx

@@ -0,0 +1,42 @@
+"use client";
+
+import Link from "next/link";
+import { useMemo } from "react";
+import { usePathname } from "next/navigation";
+
+import { useSuperAdminSession } from "@/components/auth/session-context";
+import { dashboardNav } from "@/lib/navigation";
+import { matchesPermissions } from "@/lib/permissions";
+import { cn } from "@/lib/utils";
+
+export function MobileNav() {
+  const pathname = usePathname();
+  const { permissions } = useSuperAdminSession();
+  const accessibleNav = useMemo(
+    () =>
+      dashboardNav.filter((item) =>
+        matchesPermissions(permissions, item.requiredPermissions, item.permissionMode),
+      ),
+    [permissions],
+  );
+
+  return (
+    <div className="mb-4 flex gap-2 overflow-x-auto pb-1 lg:hidden">
+      {accessibleNav.map((item) => {
+        const active = pathname === item.href;
+        return (
+          <Link
+            key={item.href}
+            href={item.href}
+            className={cn(
+              "whitespace-nowrap rounded-full border px-3 py-1.5 text-xs",
+              active ? "border-primary/40 bg-primary/20 text-primary" : "border-border bg-card text-muted-foreground",
+            )}
+          >
+            {item.label}
+          </Link>
+        );
+      })}
+    </div>
+  );
+}