initial commit

app/(tabs)/layout.tsx

@@ -0,0 +1,38 @@
+// app/tabs/layout.tsx
+"use client";
+
+import Link from "next/link";
+import { ReactNode } from "react";
+import { usePathname } from "next/navigation";
+import clsx from "clsx";
+
+const tabs = [
+  { name: "Home", href: "/tabs/home" },
+  { name: "Profile", href: "/tabs/profile" },
+  { name: "Leaderboard", href: "/tabs/leaderboard" },
+];
+
+export default function TabsLayout({ children }: { children: ReactNode }) {
+  const pathname = usePathname();
+
+  return (
+    <div className="min-h-screen flex flex-col">
+      <main className="flex-1">{children}</main>
+
+      <nav className="flex justify-around border-t p-4 bg-white">
+        {tabs.map((tab) => (
+          <Link
+            key={tab.name}
+            href={tab.href}
+            className={clsx(
+              "text-center text-sm font-medium",
+              pathname === tab.href ? "text-blue-600" : "text-gray-500"
+            )}
+          >
+            {tab.name}
+          </Link>
+        ))}
+      </nav>
+    </div>
+  );
+}