feat: migrate to nextjs

.agents/skills/building-components/references/data-attributes.mdx

@@ -58,7 +58,7 @@ const Dialog = ({ className, ...props }: DialogProps) => {
 Now consumers can style the component based on state from the outside:
 
 ```tsx title="app.tsx"
-<Dialog className="data-[state=open]:opacity-100 data-[state=closed]:opacity-0" />
+<Dialog className="data-[state=closed]:opacity-0 data-[state=open]:opacity-100" />
 ```
 
 ### Benefits of this approach
@@ -130,7 +130,7 @@ module.exports = {
 Now you can use shorthand:
 
 ```tsx
-<Dialog className="data-open:opacity-100 data-closed:opacity-0" />
+<Dialog className="data-closed:opacity-0 data-open:opacity-100" />
 ```
 
 ### Integration with Radix UI
@@ -261,7 +261,7 @@ function Card({ className, ...props }: React.ComponentProps<"div">) {
         // Target any descendant with data-slot
         "[&_[data-slot=card-header]]:mb-4",
         "[&_[data-slot=card-title]]:text-lg [&_[data-slot=card-title]]:font-semibold",
-        "[&_[data-slot=card-description]]:text-sm [&_[data-slot=card-description]]:text-muted-foreground",
+        "[&_[data-slot=card-description]]:text-muted-foreground [&_[data-slot=card-description]]:text-sm",
         "[&_[data-slot=card-footer]]:mt-4 [&_[data-slot=card-footer]]:border-t [&_[data-slot=card-footer]]:pt-4",
         className,
       )}

.agents/skills/building-components/references/styling.mdx

@@ -107,7 +107,7 @@ const Component = ({ className, ...props }: ComponentProps) => {
 The `cn` function, popularized by [shadcn/ui](https://ui.shadcn.com/), combines `clsx` and `tailwind-merge` to give you both conditional logic and intelligent merging:
 
 ```tsx title="lib/utils.ts"
-import { type ClassValue, clsx } from "clsx";
+import { clsx, type ClassValue } from "clsx";
 import { twMerge } from "tailwind-merge";
 
 export function cn(...inputs: ClassValue[]) {
@@ -224,7 +224,7 @@ import { cn } from "@/lib/utils";
 
 <button
   className={cn(
-    "px-4 py-2 rounded-lg",
+    "rounded-lg px-4 py-2",
     variant === "primary" && "bg-blue-500 text-white",
     className,
   )}

.agents/skills/building-components/references/types.mdx

@@ -122,6 +122,7 @@ Exporting types enables several important patterns:
 ```tsx
 // 1. Extracting specific prop types
 import type { CardRootProps } from "@/components/ui/card";
+
 type variant = CardRootProps["variant"];
 
 // 2. Extending components

.agents/skills/databricks-apps/references/appkit/appkit-sdk.md

@@ -9,7 +9,6 @@ Template enforces `noUnusedLocals` - remove unused imports immediately or build
 ```typescript
 // ✅ CORRECT - use import type for types
 import type { MyInterface, MyType } from "./types";
-
 // ❌ WRONG - will fail compilation
 import { MyInterface, MyType } from "./types";
 ```

.agents/skills/databricks-apps/references/appkit/frontend.md

@@ -152,8 +152,8 @@ All data components **require `parameters={{}}`** even when the query has no par
 
 ```tsx
 <div className="container mx-auto p-4">
-  <h1 className="text-2xl font-bold mb-4">Page Title</h1>
-  <form className="space-y-4 mb-8">{/* form inputs */}</form>
+  <h1 className="mb-4 text-2xl font-bold">Page Title</h1>
+  <form className="mb-8 space-y-4">{/* form inputs */}</form>
   <div className="grid gap-4">{/* list items */}</div>
 </div>
 ```

.agents/skills/databricks-apps/references/appkit/lakebase.md

@@ -65,6 +65,7 @@ Note: **No `config/queries/` directory** — Lakebase apps use server-side `pool
 
 ```typescript
 import { createLakebasePool } from "@databricks/lakebase";
+
 // or: import { createLakebasePool } from "@databricks/appkit";
 
 const pool = createLakebasePool({
@@ -98,10 +99,10 @@ Always use tRPC for Lakebase operations — do NOT call `pool.query()` from the
 
 ```typescript
 // server/server.ts
-import { initTRPC } from "@trpc/server";
 import { createLakebasePool } from "@databricks/lakebase";
-import { z } from "zod";
+import { initTRPC } from "@trpc/server";
 import superjson from "superjson"; // requires: npm install superjson
+import { z } from "zod";
 
 const pool = createLakebasePool(); // reads env vars automatically
 
@@ -157,11 +158,13 @@ The pool returned by `createLakebasePool()` is a standard `pg.Pool` — works wi
 
 ```typescript
 // Drizzle ORM
-import { drizzle } from "drizzle-orm/node-postgres";
-const db = drizzle(pool);
 
 // Prisma (with @prisma/adapter-pg)
 import { PrismaPg } from "@prisma/adapter-pg";
+import { drizzle } from "drizzle-orm/node-postgres";
+
+const db = drizzle(pool);
+
 const adapter = new PrismaPg(pool);
 const prisma = new PrismaClient({ adapter });
 ```

.agents/skills/databricks-apps/references/appkit/overview.md

@@ -68,13 +68,14 @@ my-app/
 ```
 
 **Key files to modify:**
-| Task | File |
-|------|------|
-| Build UI | `client/src/App.tsx` |
-| Add SQL query | `config/queries/<NAME>.sql` |
-| Add API endpoint | `server/server.ts` (tRPC) |
+
+| Task                          | File                                                       |
+| ----------------------------- | ---------------------------------------------------------- |
+| Build UI                      | `client/src/App.tsx`                                       |
+| Add SQL query                 | `config/queries/<NAME>.sql`                                |
+| Add API endpoint              | `server/server.ts` (tRPC)                                  |
 | Add shared helpers (optional) | create `shared/types.ts` or `client/src/lib/formatters.ts` |
-| Fix smoke test | `tests/smoke.spec.ts` |
+| Fix smoke test                | `tests/smoke.spec.ts`                                      |
 
 ## Type Safety
 

.agents/skills/databricks-apps/references/appkit/proto-first.md

@@ -268,15 +268,15 @@ buf lint proto/    # proto style checks
 NOW implementation begins. Each module uses ONLY its generated types:
 
 ```typescript
-import type {
-  StoredArtifact,
-  UploadRequest,
-} from "../proto/gen/<app>/v1/storage";
-import type { RunRecord, MetricRecord } from "../proto/gen/<app>/v1/database";
 import type {
   JobTaskInput,
   JobTaskOutput,
 } from "../proto/gen/<app>/v1/compute";
+import type { MetricRecord, RunRecord } from "../proto/gen/<app>/v1/database";
+import type {
+  StoredArtifact,
+  UploadRequest,
+} from "../proto/gen/<app>/v1/storage";
 ```
 
 No `any`, no `unknown`, no `JSON.parse()` at module boundaries.

.agents/skills/databricks-apps/references/appkit/sql-queries.md

@@ -79,7 +79,7 @@ export const formatPercent = (value: number | string): string =>
 Use them wherever you render query results:
 
 ```typescript
-import { toNumber, formatCurrency, formatPercent } from "./formatters"; // adjust import path to your file layout
+import { formatCurrency, formatPercent, toNumber } from "./formatters"; // adjust import path to your file layout
 
 // Convert to number
 const amount = toNumber(row.amount); // "123.45" → 123.45
@@ -190,8 +190,8 @@ Use `sql.date()` for date parameters with `YYYY-MM-DD` format strings.
 **Frontend - Using Date Parameters:**
 
 ```typescript
-import { sql } from "@databricks/appkit-ui/js";
 import { useState } from "react";
+import { sql } from "@databricks/appkit-ui/js";
 
 function MyComponent() {
   const [startDate, setStartDate] = useState<string>("2016-02-01");

.agents/skills/databricks-apps/references/appkit/trpc.md

@@ -60,10 +60,10 @@ Read `server/server.ts` (or `server/trpc.ts`) to see what routes already exist.
 
 ```tsx
 // server/trpc.ts
-import { initTRPC } from "@trpc/server";
 import { getExecutionContext } from "@databricks/appkit";
-import { z } from "zod";
+import { initTRPC } from "@trpc/server";
 import superjson from "superjson";
+import { z } from "zod";
 
 const t = initTRPC.create({ transformer: superjson });
 const publicProcedure = t.procedure;

.agents/skills/databricks-apps/references/testing.md

@@ -5,7 +5,7 @@
 **CRITICAL**: Use vitest for all tests. Put tests next to the code (e.g. src/\*.test.ts)
 
 ```typescript
-import { describe, it, expect } from "vitest";
+import { describe, expect, it } from "vitest";
 
 describe("Feature Name", () => {
   it("should do something", () => {

.agents/skills/mcp-builder/reference/node_mcp_server.md

@@ -12,8 +12,8 @@ This document provides Node/TypeScript-specific best practices and examples for
 
 ```typescript
 import { McpServer } from "@modelcontextprotocol/sdk/server/mcp.js";
-import { StreamableHTTPServerTransport } from "@modelcontextprotocol/sdk/server/streamableHttp.js";
 import { StdioServerTransport } from "@modelcontextprotocol/sdk/server/stdio.js";
+import { StreamableHTTPServerTransport } from "@modelcontextprotocol/sdk/server/streamableHttp.js";
 import express from "express";
 import { z } from "zod";
 ```
@@ -626,11 +626,10 @@ async function getUser(id: string): Promise<any> {
  * This server provides tools to interact with Example API, including user search,
  * project management, and data export capabilities.
  */
-
 import { McpServer } from "@modelcontextprotocol/sdk/server/mcp.js";
 import { StdioServerTransport } from "@modelcontextprotocol/sdk/server/stdio.js";
-import { z } from "zod";
 import axios, { AxiosError } from "axios";
+import { z } from "zod";
 
 // Constants
 const API_BASE_URL = "https://api.example.com/v1";

.agents/skills/shadcn/customization.md

@@ -150,7 +150,7 @@ Prefer these approaches in order:
 ### 2. Tailwind classes via `className`
 
 ```tsx
-<Card className="max-w-md mx-auto">...</Card>
+<Card className="mx-auto max-w-md">...</Card>
 ```
 
 ### 3. Add a new variant

.agents/skills/shadcn/rules/forms.md

@@ -77,7 +77,7 @@ Never place a `Button` directly inside or adjacent to an `Input` with custom pos
 ```tsx
 <div className="relative">
   <Input placeholder="Search..." className="pr-10" />
-  <Button className="absolute right-0 top-0" size="icon">
+  <Button className="absolute top-0 right-0" size="icon">
     <SearchIcon />
   </Button>
 </div>
@@ -88,8 +88,8 @@ Never place a `Button` directly inside or adjacent to an `Input` with custom pos
 ```tsx
 import {
   InputGroup,
-  InputGroupInput,
   InputGroupAddon,
+  InputGroupInput,
 } from "@/components/ui/input-group";
 
 <InputGroup>

.agents/skills/shadcn/rules/styling.md

@@ -65,7 +65,7 @@ If you need a success/positive color that doesn't exist as a semantic token, use
 **Incorrect:**
 
 ```tsx
-<Button className="border border-input bg-transparent hover:bg-accent">
+<Button className="border-input hover:bg-accent border bg-transparent">
   Click me
 </Button>
 ```
@@ -85,15 +85,15 @@ Use `className` for layout (e.g. `max-w-md`, `mx-auto`, `mt-4`), **not** for ove
 **Incorrect:**
 
 ```tsx
-<Card className="bg-blue-100 text-blue-900 font-bold">
+<Card className="bg-blue-100 font-bold text-blue-900">
   <CardContent>Dashboard</CardContent>
 </Card>
 ```
 
 **Correct:**
 
 ```tsx
-<Card className="max-w-md mx-auto">
+<Card className="mx-auto max-w-md">
   <CardContent>Dashboard</CardContent>
 </Card>
 ```

.agents/skills/vercel-cli/references/monorepos.md

@@ -116,8 +116,8 @@ packages:
 **apps/api/server.ts:**
 
 ```typescript
-import { Hono } from "hono";
 import { greet } from "@repo/shared";
+import { Hono } from "hono";
 
 const app = new Hono();
 app.get("/", (c) => c.text(greet("world")));

.fallowrc.json

@@ -2,20 +2,53 @@
   "$schema": "https://raw.githubusercontent.com/fallow-rs/fallow/main/schema.json",
   "ignorePatterns": [
     "examples/**",
-    "content/**",
-    ".docusaurus/**",
-    "build/**",
-    "static/js/home-hero-player.js"
+    "nextjs/**",
+    "src/content/**",
+    "src/components/ui/**",
+    "src/components/docs/content-tabs.tsx",
+    "src/components/next/tab-item.tsx",
+    "src/components/next/tabs.tsx",
+    "src/components/products/**",
+    "src/hooks/use-mobile.ts",
+    "src/lib/content-tabs-state.ts",
+    "src/lib/mdx-plugins/**",
+    "src/lib/products/**",
+    "src/app/(website)/product/**",
+    "public/raw-docs/**",
+    "public/appkit-preview/**",
+    "public/js/home-hero-player.js",
+    "scripts/render-resource-image.mjs",
+    "scripts/serve-mcp.ts"
   ],
   "ignoreDependencies": [
+    "@base-ui/react",
+    "@mdx-js/loader",
     "@modelcontextprotocol/sdk",
-    "@docusaurus/module-type-aliases",
-    "@docusaurus/tsconfig",
+    "@next/mdx",
+    "@shikijs/rehype",
+    "@shikijs/transformers",
+    "class-variance-authority",
+    "cmdk",
+    "embla-carousel-react",
+    "github-slugger",
+    "hast-util-to-jsx-runtime",
+    "input-otp",
     "mdast",
+    "mdast-util-mdx-jsx",
     "mdast-util-mdx",
-    "unified",
+    "next-themes",
+    "npm-to-yarn",
+    "react-day-picker",
+    "react-hook-form",
+    "react-resizable-panels",
+    "remark-gfm",
+    "remark-frontmatter",
+    "remark-mdx",
+    "remark-mdx-frontmatter",
+    "shiki",
     "unist",
     "unist-util-visit",
+    "vaul",
     "prism-react-renderer",
     "@tailwindcss/typography"
   ],
@@ -25,8 +58,16 @@
       "exports": ["GET", "POST", "DELETE"]
     },
     {
-      "file": "src/components/ui/**",
-      "exports": ["*"]
+      "file": "src/app/not-found.tsx",
+      "exports": ["metadata"]
+    },
+    {
+      "file": "src/lib/content-markdown.ts",
+      "exports": ["getContentSlugs", "getCookbookSlugs"]
+    },
+    {
+      "file": "src/lib/llms-txt.ts",
+      "exports": ["copyRawDocs"]
     }
   ],
   "rules": {