From 0e682f3a9a75adea0c2a9e828aa398c2325df099 Mon Sep 17 00:00:00 2001
From: Pawel Kosiec <pawel.kosiec@databricks.com>
Date: Tue, 10 Feb 2026 19:30:15 +0100
Subject: [PATCH 1/3] chore: add Lakebase Autoscaling example for
 `dev-playground` app

---
 .../components/lakebase/ActivityLogsPanel.tsx | 259 +++++++++
 .../src/components/lakebase/OrdersPanel.tsx   | 524 ++++++++++++++++++
 .../src/components/lakebase/ProductsPanel.tsx | 331 +++++++++++
 .../src/components/lakebase/TasksPanel.tsx    | 401 ++++++++++++++
 .../client/src/components/lakebase/index.ts   |   4 +
 .../client/src/hooks/use-lakebase-data.ts     | 144 +++++
 .../client/src/routeTree.gen.ts               |  21 +
 .../client/src/routes/__root.tsx              |   8 +
 .../client/src/routes/index.tsx               |  19 +
 .../client/src/routes/lakebase.route.tsx      |  64 +++
 apps/dev-playground/package.json              |   4 +
 apps/dev-playground/server/index.ts           |   3 +
 .../server/lakebase-examples-plugin.ts        |  75 +++
 .../lakebase-examples/drizzle-example.ts      | 192 +++++++
 .../lakebase-examples/raw-driver-example.ts   | 226 ++++++++
 .../lakebase-examples/sequelize-example.ts    | 272 +++++++++
 .../lakebase-examples/typeorm-example.ts      | 195 +++++++
 apps/dev-playground/tsdown.config.ts          |  15 +
 .../prepared-files/root-tsconfig.json         |   6 +-
 tsconfig.json                                 |   2 +
 20 files changed, 2764 insertions(+), 1 deletion(-)
 create mode 100644 apps/dev-playground/client/src/components/lakebase/ActivityLogsPanel.tsx
 create mode 100644 apps/dev-playground/client/src/components/lakebase/OrdersPanel.tsx
 create mode 100644 apps/dev-playground/client/src/components/lakebase/ProductsPanel.tsx
 create mode 100644 apps/dev-playground/client/src/components/lakebase/TasksPanel.tsx
 create mode 100644 apps/dev-playground/client/src/components/lakebase/index.ts
 create mode 100644 apps/dev-playground/client/src/hooks/use-lakebase-data.ts
 create mode 100644 apps/dev-playground/client/src/routes/lakebase.route.tsx
 create mode 100644 apps/dev-playground/server/lakebase-examples-plugin.ts
 create mode 100644 apps/dev-playground/server/lakebase-examples/drizzle-example.ts
 create mode 100644 apps/dev-playground/server/lakebase-examples/raw-driver-example.ts
 create mode 100644 apps/dev-playground/server/lakebase-examples/sequelize-example.ts
 create mode 100644 apps/dev-playground/server/lakebase-examples/typeorm-example.ts
 create mode 100644 apps/dev-playground/tsdown.config.ts

diff --git a/apps/dev-playground/client/src/components/lakebase/ActivityLogsPanel.tsx b/apps/dev-playground/client/src/components/lakebase/ActivityLogsPanel.tsx
new file mode 100644
index 00000000..10bb6406
--- /dev/null
+++ b/apps/dev-playground/client/src/components/lakebase/ActivityLogsPanel.tsx
@@ -0,0 +1,259 @@
+import {
+  Badge,
+  Button,
+  Card,
+  CardContent,
+  CardDescription,
+  CardHeader,
+  CardTitle,
+  Input,
+} from "@databricks/appkit-ui/react";
+import { Activity, Loader2 } from "lucide-react";
+import { useId, useState } from "react";
+import { useLakebaseData, useLakebasePost } from "@/hooks/use-lakebase-data";
+
+interface ActivityLog {
+  id: number;
+  userId: string;
+  action: string;
+  metadata: Record<string, unknown> | null;
+  timestamp: string;
+}
+
+interface Stats {
+  totalLogs: number;
+  uniqueUsers: number;
+  recentActivity: number;
+}
+
+export function ActivityLogsPanel() {
+  const userIdFieldId = useId();
+  const actionFieldId = useId();
+
+  const {
+    data: logs,
+    loading: logsLoading,
+    error: logsError,
+    refetch,
+  } = useLakebaseData<ActivityLog[]>("/api/lakebase-examples/drizzle/activity");
+
+  const { data: stats } = useLakebaseData<Stats>(
+    "/api/lakebase-examples/drizzle/stats",
+  );
+
+  const { post, loading: creating } = useLakebasePost<
+    Partial<ActivityLog>,
+    ActivityLog
+  >("/api/lakebase-examples/drizzle/activity");
+
+  const generateRandomActivity = () => {
+    const users = ["alice", "bob", "charlie", "diana", "eve"];
+    const actions = [
+      "login",
+      "logout",
+      "view_dashboard",
+      "create_report",
+      "export_data",
+      "update_settings",
+      "share_document",
+      "delete_item",
+    ];
+
+    return {
+      userId: users[Math.floor(Math.random() * users.length)],
+      action: actions[Math.floor(Math.random() * actions.length)],
+    };
+  };
+
+  const [formData, setFormData] = useState(generateRandomActivity());
+
+  const handleSubmit = async (e: React.FormEvent) => {
+    e.preventDefault();
+    const result = await post({
+      userId: formData.userId,
+      action: formData.action,
+      metadata: {
+        source: "web",
+        timestamp: new Date().toISOString(),
+      },
+    });
+
+    if (result) {
+      setFormData(generateRandomActivity());
+      refetch();
+    }
+  };
+
+  return (
+    <div className="space-y-4">
+      {/* Header */}
+      <Card className="border-2">
+        <CardHeader className="pb-0 gap-0">
+          <div className="flex items-center gap-3">
+            <div className="p-2 bg-purple-100 rounded-lg flex-shrink-0 self-start">
+              <Activity className="h-6 w-6 text-purple-600" />
+            </div>
+            <div className="flex-1 min-w-0">
+              <CardTitle>Drizzle ORM Example</CardTitle>
+              <CardDescription>
+                Type-safe queries with schema definitions and automatic type
+                inference
+              </CardDescription>
+            </div>
+          </div>
+        </CardHeader>
+      </Card>
+
+      {/* Statistics */}
+      {stats && (
+        <div className="grid grid-cols-1 md:grid-cols-3 gap-4">
+          <Card>
+            <CardHeader className="pb-3">
+              <CardDescription className="text-xs">Total Logs</CardDescription>
+              <CardTitle className="text-2xl">{stats.totalLogs}</CardTitle>
+            </CardHeader>
+          </Card>
+          <Card>
+            <CardHeader className="pb-3">
+              <CardDescription className="text-xs">
+                Unique Users
+              </CardDescription>
+              <CardTitle className="text-2xl">{stats.uniqueUsers}</CardTitle>
+            </CardHeader>
+          </Card>
+          <Card>
+            <CardHeader className="pb-3">
+              <CardDescription className="text-xs">
+                Last 24 Hours
+              </CardDescription>
+              <CardTitle className="text-2xl">{stats.recentActivity}</CardTitle>
+            </CardHeader>
+          </Card>
+        </div>
+      )}
+
+      {/* Create log form */}
+      <Card>
+        <CardHeader>
+          <CardTitle className="text-lg">Log Activity</CardTitle>
+        </CardHeader>
+        <CardContent>
+          <form onSubmit={handleSubmit} className="space-y-4">
+            <div className="grid grid-cols-1 md:grid-cols-2 gap-4">
+              <div>
+                <label
+                  htmlFor={userIdFieldId}
+                  className="text-sm font-medium mb-1 block"
+                >
+                  User ID
+                </label>
+                <Input
+                  id={userIdFieldId}
+                  value={formData.userId}
+                  onChange={(e) =>
+                    setFormData({ ...formData, userId: e.target.value })
+                  }
+                  placeholder="alice"
+                  required
+                />
+              </div>
+              <div>
+                <label
+                  htmlFor={actionFieldId}
+                  className="text-sm font-medium mb-1 block"
+                >
+                  Action
+                </label>
+                <Input
+                  id={actionFieldId}
+                  value={formData.action}
+                  onChange={(e) =>
+                    setFormData({ ...formData, action: e.target.value })
+                  }
+                  placeholder="view_dashboard"
+                  required
+                />
+              </div>
+            </div>
+            <Button type="submit" disabled={creating} className="w-full">
+              {creating ? (
+                <>
+                  <Loader2 className="mr-2 h-4 w-4 animate-spin" />
+                  Logging...
+                </>
+              ) : (
+                "Log Activity"
+              )}
+            </Button>
+          </form>
+        </CardContent>
+      </Card>
+
+      {/* Activity logs */}
+      <Card>
+        <CardHeader>
+          <div className="flex items-center justify-between">
+            <CardTitle className="text-lg">Activity Logs</CardTitle>
+            <Button variant="outline" size="sm" onClick={() => refetch()}>
+              Refresh
+            </Button>
+          </div>
+        </CardHeader>
+        <CardContent>
+          {logsLoading && (
+            <div className="flex items-center gap-2 text-warning py-8">
+              <div className="w-2 h-2 bg-amber-500 rounded-full animate-pulse" />
+              Loading activity logs...
+            </div>
+          )}
+
+          {logsError && (
+            <div className="text-destructive bg-destructive/10 p-3 rounded-md border border-destructive/20">
+              <span className="font-semibold">Error:</span> {logsError.message}
+            </div>
+          )}
+
+          {logs && logs.length === 0 && (
+            <div className="text-center py-12 text-muted-foreground">
+              <Activity className="h-12 w-12 mx-auto mb-3 opacity-50" />
+              <p>No activity logs yet. Log your first activity above.</p>
+            </div>
+          )}
+
+          {logs && logs.length > 0 && (
+            <div className="space-y-3 max-h-[500px] overflow-y-auto">
+              {logs.map((log) => (
+                <div
+                  key={log.id}
+                  className="p-4 bg-secondary rounded border border-border"
+                >
+                  <div className="flex items-start justify-between mb-2">
+                    <div className="flex items-center gap-2">
+                      <Badge className="bg-purple-100 text-purple-700 border-purple-200">
+                        {log.userId}
+                      </Badge>
+                      <span className="text-sm font-medium">{log.action}</span>
+                    </div>
+                    <span className="text-xs text-muted-foreground">
+                      {new Date(log.timestamp).toLocaleString()}
+                    </span>
+                  </div>
+                  {log.metadata && (
+                    <details className="text-xs text-muted-foreground">
+                      <summary className="cursor-pointer">
+                        View metadata
+                      </summary>
+                      <pre className="mt-2 p-2 bg-background rounded border overflow-x-auto">
+                        {JSON.stringify(log.metadata, null, 2)}
+                      </pre>
+                    </details>
+                  )}
+                </div>
+              ))}
+            </div>
+          )}
+        </CardContent>
+      </Card>
+    </div>
+  );
+}
diff --git a/apps/dev-playground/client/src/components/lakebase/OrdersPanel.tsx b/apps/dev-playground/client/src/components/lakebase/OrdersPanel.tsx
new file mode 100644
index 00000000..8730bb04
--- /dev/null
+++ b/apps/dev-playground/client/src/components/lakebase/OrdersPanel.tsx
@@ -0,0 +1,524 @@
+import {
+  Badge,
+  Button,
+  Card,
+  CardContent,
+  CardDescription,
+  CardHeader,
+  CardTitle,
+  Input,
+} from "@databricks/appkit-ui/react";
+import {
+  CheckCircle,
+  Circle,
+  Loader2,
+  Package,
+  ShoppingCart,
+  Truck,
+} from "lucide-react";
+import { useId, useState } from "react";
+import {
+  useLakebaseData,
+  useLakebasePatch,
+  useLakebasePost,
+} from "@/hooks/use-lakebase-data";
+
+interface Order {
+  id: number;
+  orderNumber: string;
+  customerName: string;
+  productName: string;
+  amount: number;
+  status: "pending" | "processing" | "shipped" | "delivered";
+  createdAt: string;
+  updatedAt: string;
+}
+
+interface OrderStats {
+  total: number;
+  pending: number;
+  processing: number;
+  shipped: number;
+  delivered: number;
+}
+
+export function OrdersPanel() {
+  const orderNumberId = useId();
+  const customerNameId = useId();
+  const productNameId = useId();
+  const amountId = useId();
+
+  const {
+    data: orders,
+    loading: ordersLoading,
+    error: ordersError,
+    refetch,
+  } = useLakebaseData<Order[]>("/api/lakebase-examples/sequelize/orders");
+
+  const { data: stats } = useLakebaseData<OrderStats>(
+    "/api/lakebase-examples/sequelize/stats",
+  );
+
+  const { post, loading: creating } = useLakebasePost<Partial<Order>, Order>(
+    "/api/lakebase-examples/sequelize/orders",
+  );
+
+  const { patch, loading: updating } = useLakebasePatch<
+    { status: string },
+    Order
+  >("/api/lakebase-examples/sequelize/orders");
+
+  const generateRandomOrder = () => {
+    const customers = [
+      "Alice Johnson",
+      "Bob Smith",
+      "Carol Williams",
+      "David Brown",
+      "Emma Davis",
+      "Frank Miller",
+      "Grace Wilson",
+      "Henry Moore",
+    ];
+    const products = [
+      "Wireless Bluetooth Headphones",
+      "USB-C Charging Cable",
+      "Laptop Stand - Ergonomic",
+      "Mechanical Keyboard - RGB",
+      "4K Webcam with Microphone",
+      "Portable SSD 1TB",
+      "Wireless Mouse - Ergonomic",
+      "Monitor Arm Mount",
+      "Noise Cancelling Earbuds",
+      "Desk Lamp - LED",
+    ];
+
+    const orderNum = `ORD-${new Date().getFullYear()}-${String(Math.floor(Math.random() * 9999) + 1).padStart(4, "0")}`;
+    const customer = customers[Math.floor(Math.random() * customers.length)];
+    const product = products[Math.floor(Math.random() * products.length)];
+    const amount = (Math.random() * 200 + 10).toFixed(2);
+
+    return {
+      orderNumber: orderNum,
+      customerName: customer,
+      productName: product,
+      amount,
+    };
+  };
+
+  const [formData, setFormData] = useState(generateRandomOrder());
+
+  const handleSubmit = async (e: React.FormEvent) => {
+    e.preventDefault();
+    const result = await post({
+      orderNumber: formData.orderNumber,
+      customerName: formData.customerName,
+      productName: formData.productName,
+      amount: Number.parseFloat(formData.amount),
+      status: "pending",
+    });
+
+    if (result) {
+      setFormData(generateRandomOrder());
+      refetch();
+    }
+  };
+
+  const handleStatusUpdate = async (id: number, status: Order["status"]) => {
+    const result = await patch(id, { status });
+    if (result) {
+      refetch();
+    }
+  };
+
+  const getStatusBadge = (status: Order["status"]) => {
+    switch (status) {
+      case "pending":
+        return (
+          <Badge className="bg-gray-100 text-gray-700 border-gray-200">
+            <Circle className="w-3 h-3 mr-1" />
+            Pending
+          </Badge>
+        );
+      case "processing":
+        return (
+          <Badge className="bg-blue-100 text-blue-700 border-blue-200">
+            <Package className="w-3 h-3 mr-1" />
+            Processing
+          </Badge>
+        );
+      case "shipped":
+        return (
+          <Badge className="bg-purple-100 text-purple-700 border-purple-200">
+            <Truck className="w-3 h-3 mr-1" />
+            Shipped
+          </Badge>
+        );
+      case "delivered":
+        return (
+          <Badge className="bg-green-100 text-green-700 border-green-200">
+            <CheckCircle className="w-3 h-3 mr-1" />
+            Delivered
+          </Badge>
+        );
+    }
+  };
+
+  const ordersByStatus = orders
+    ? {
+        pending: orders.filter((o) => o.status === "pending"),
+        processing: orders.filter((o) => o.status === "processing"),
+        shipped: orders.filter((o) => o.status === "shipped"),
+        delivered: orders.filter((o) => o.status === "delivered"),
+      }
+    : { pending: [], processing: [], shipped: [], delivered: [] };
+
+  return (
+    <div className="space-y-4">
+      {/* Header */}
+      <Card className="border-2">
+        <CardHeader className="pb-0 gap-0">
+          <div className="flex items-center gap-3">
+            <div className="p-2 bg-orange-100 rounded-lg flex-shrink-0 self-start">
+              <ShoppingCart className="h-6 w-6 text-orange-600" />
+            </div>
+            <div className="flex-1 min-w-0">
+              <CardTitle>Sequelize Example</CardTitle>
+              <CardDescription>
+                Model-based ORM with intuitive API and automatic timestamps
+              </CardDescription>
+            </div>
+          </div>
+        </CardHeader>
+      </Card>
+
+      {/* Statistics */}
+      {stats && (
+        <div className="grid grid-cols-1 md:grid-cols-5 gap-4">
+          <Card>
+            <CardHeader className="pb-3">
+              <CardDescription className="text-xs">
+                Total Orders
+              </CardDescription>
+              <CardTitle className="text-2xl">{stats.total}</CardTitle>
+            </CardHeader>
+          </Card>
+          <Card>
+            <CardHeader className="pb-3">
+              <CardDescription className="text-xs">Pending</CardDescription>
+              <CardTitle className="text-2xl">{stats.pending}</CardTitle>
+            </CardHeader>
+          </Card>
+          <Card>
+            <CardHeader className="pb-3">
+              <CardDescription className="text-xs">Processing</CardDescription>
+              <CardTitle className="text-2xl">{stats.processing}</CardTitle>
+            </CardHeader>
+          </Card>
+          <Card>
+            <CardHeader className="pb-3">
+              <CardDescription className="text-xs">Shipped</CardDescription>
+              <CardTitle className="text-2xl">{stats.shipped}</CardTitle>
+            </CardHeader>
+          </Card>
+          <Card>
+            <CardHeader className="pb-3">
+              <CardDescription className="text-xs">Delivered</CardDescription>
+              <CardTitle className="text-2xl">{stats.delivered}</CardTitle>
+            </CardHeader>
+          </Card>
+        </div>
+      )}
+
+      {/* Create order form */}
+      <Card>
+        <CardHeader>
+          <CardTitle className="text-lg">Create Order</CardTitle>
+        </CardHeader>
+        <CardContent>
+          <form onSubmit={handleSubmit} className="space-y-4">
+            <div className="grid grid-cols-1 md:grid-cols-2 gap-4">
+              <div>
+                <label
+                  htmlFor={orderNumberId}
+                  className="text-sm font-medium mb-1 block"
+                >
+                  Order Number
+                </label>
+                <Input
+                  id={orderNumberId}
+                  value={formData.orderNumber}
+                  onChange={(e) =>
+                    setFormData({ ...formData, orderNumber: e.target.value })
+                  }
+                  placeholder="ORD-2024-0001"
+                  required
+                />
+              </div>
+              <div>
+                <label
+                  htmlFor={customerNameId}
+                  className="text-sm font-medium mb-1 block"
+                >
+                  Customer Name
+                </label>
+                <Input
+                  id={customerNameId}
+                  value={formData.customerName}
+                  onChange={(e) =>
+                    setFormData({ ...formData, customerName: e.target.value })
+                  }
+                  placeholder="John Doe"
+                  required
+                />
+              </div>
+            </div>
+            <div className="grid grid-cols-1 md:grid-cols-2 gap-4">
+              <div>
+                <label
+                  htmlFor={productNameId}
+                  className="text-sm font-medium mb-1 block"
+                >
+                  Product Name
+                </label>
+                <Input
+                  id={productNameId}
+                  value={formData.productName}
+                  onChange={(e) =>
+                    setFormData({ ...formData, productName: e.target.value })
+                  }
+                  placeholder="Wireless Headphones"
+                  required
+                />
+              </div>
+              <div>
+                <label
+                  htmlFor={amountId}
+                  className="text-sm font-medium mb-1 block"
+                >
+                  Amount ($)
+                </label>
+                <Input
+                  id={amountId}
+                  type="number"
+                  step="0.01"
+                  min="0"
+                  value={formData.amount}
+                  onChange={(e) =>
+                    setFormData({ ...formData, amount: e.target.value })
+                  }
+                  placeholder="99.99"
+                  required
+                />
+              </div>
+            </div>
+            <Button type="submit" disabled={creating} className="w-full">
+              {creating ? (
+                <>
+                  <Loader2 className="mr-2 h-4 w-4 animate-spin" />
+                  Creating...
+                </>
+              ) : (
+                "Create Order"
+              )}
+            </Button>
+          </form>
+        </CardContent>
+      </Card>
+
+      {/* Order board */}
+      <Card>
+        <CardHeader>
+          <div className="flex items-center justify-between">
+            <CardTitle className="text-lg">Order Board</CardTitle>
+            <Button variant="outline" size="sm" onClick={() => refetch()}>
+              Refresh
+            </Button>
+          </div>
+        </CardHeader>
+        <CardContent>
+          {ordersLoading && (
+            <div className="flex items-center gap-2 text-warning py-8">
+              <div className="w-2 h-2 bg-amber-500 rounded-full animate-pulse" />
+              Loading orders...
+            </div>
+          )}
+
+          {ordersError && (
+            <div className="text-destructive bg-destructive/10 p-3 rounded-md border border-destructive/20">
+              <span className="font-semibold">Error:</span>{" "}
+              {ordersError.message}
+            </div>
+          )}
+
+          {orders && orders.length === 0 && (
+            <div className="text-center py-12 text-muted-foreground">
+              <ShoppingCart className="h-12 w-12 mx-auto mb-3 opacity-50" />
+              <p>No orders yet. Add an order to get started.</p>
+            </div>
+          )}
+
+          {orders && orders.length > 0 && (
+            <div className="grid grid-cols-1 md:grid-cols-4 gap-4">
+              {/* Pending column */}
+              <div className="space-y-3">
+                <div className="font-semibold text-sm text-muted-foreground uppercase tracking-wide">
+                  Pending ({ordersByStatus.pending.length})
+                </div>
+                <div className="space-y-2">
+                  {ordersByStatus.pending.map((order) => (
+                    <Card key={order.id} className="p-3">
+                      <div className="space-y-2">
+                        <div>{getStatusBadge(order.status)}</div>
+                        <h4 className="font-medium text-sm">
+                          {order.orderNumber}
+                        </h4>
+                        <p className="text-xs text-muted-foreground">
+                          {order.customerName}
+                        </p>
+                        <p className="text-xs font-medium">
+                          {order.productName}
+                        </p>
+                        <p className="text-sm font-bold text-green-600">
+                          ${Number(order.amount).toFixed(2)}
+                        </p>
+                        <Button
+                          size="sm"
+                          variant="outline"
+                          className="w-full"
+                          onClick={() =>
+                            handleStatusUpdate(order.id, "processing")
+                          }
+                          disabled={updating}
+                        >
+                          Process
+                        </Button>
+                      </div>
+                    </Card>
+                  ))}
+                </div>
+              </div>
+
+              {/* Processing column */}
+              <div className="space-y-3">
+                <div className="font-semibold text-sm text-muted-foreground uppercase tracking-wide">
+                  Processing ({ordersByStatus.processing.length})
+                </div>
+                <div className="space-y-2">
+                  {ordersByStatus.processing.map((order) => (
+                    <Card key={order.id} className="p-3">
+                      <div className="space-y-2">
+                        <div>{getStatusBadge(order.status)}</div>
+                        <h4 className="font-medium text-sm">
+                          {order.orderNumber}
+                        </h4>
+                        <p className="text-xs text-muted-foreground">
+                          {order.customerName}
+                        </p>
+                        <p className="text-xs font-medium">
+                          {order.productName}
+                        </p>
+                        <p className="text-sm font-bold text-green-600">
+                          ${Number(order.amount).toFixed(2)}
+                        </p>
+                        <div className="flex gap-2">
+                          <Button
+                            size="sm"
+                            variant="outline"
+                            className="flex-1"
+                            onClick={() =>
+                              handleStatusUpdate(order.id, "pending")
+                            }
+                            disabled={updating}
+                          >
+                            Back
+                          </Button>
+                          <Button
+                            size="sm"
+                            className="flex-1"
+                            onClick={() =>
+                              handleStatusUpdate(order.id, "shipped")
+                            }
+                            disabled={updating}
+                          >
+                            Ship
+                          </Button>
+                        </div>
+                      </div>
+                    </Card>
+                  ))}
+                </div>
+              </div>
+
+              {/* Shipped column */}
+              <div className="space-y-3">
+                <div className="font-semibold text-sm text-muted-foreground uppercase tracking-wide">
+                  Shipped ({ordersByStatus.shipped.length})
+                </div>
+                <div className="space-y-2">
+                  {ordersByStatus.shipped.map((order) => (
+                    <Card key={order.id} className="p-3">
+                      <div className="space-y-2">
+                        <div>{getStatusBadge(order.status)}</div>
+                        <h4 className="font-medium text-sm">
+                          {order.orderNumber}
+                        </h4>
+                        <p className="text-xs text-muted-foreground">
+                          {order.customerName}
+                        </p>
+                        <p className="text-xs font-medium">
+                          {order.productName}
+                        </p>
+                        <p className="text-sm font-bold text-green-600">
+                          ${Number(order.amount).toFixed(2)}
+                        </p>
+                        <Button
+                          size="sm"
+                          variant="outline"
+                          className="w-full"
+                          onClick={() =>
+                            handleStatusUpdate(order.id, "delivered")
+                          }
+                          disabled={updating}
+                        >
+                          Deliver
+                        </Button>
+                      </div>
+                    </Card>
+                  ))}
+                </div>
+              </div>
+
+              {/* Delivered column */}
+              <div className="space-y-3">
+                <div className="font-semibold text-sm text-muted-foreground uppercase tracking-wide">
+                  Delivered ({ordersByStatus.delivered.length})
+                </div>
+                <div className="space-y-2">
+                  {ordersByStatus.delivered.map((order) => (
+                    <Card key={order.id} className="p-3 opacity-75">
+                      <div className="space-y-2">
+                        <div>{getStatusBadge(order.status)}</div>
+                        <h4 className="font-medium text-sm">
+                          {order.orderNumber}
+                        </h4>
+                        <p className="text-xs text-muted-foreground">
+                          {order.customerName}
+                        </p>
+                        <p className="text-xs font-medium">
+                          {order.productName}
+                        </p>
+                        <p className="text-sm font-bold text-green-600">
+                          ${Number(order.amount).toFixed(2)}
+                        </p>
+                      </div>
+                    </Card>
+                  ))}
+                </div>
+              </div>
+            </div>
+          )}
+        </CardContent>
+      </Card>
+    </div>
+  );
+}
diff --git a/apps/dev-playground/client/src/components/lakebase/ProductsPanel.tsx b/apps/dev-playground/client/src/components/lakebase/ProductsPanel.tsx
new file mode 100644
index 00000000..69b9402b
--- /dev/null
+++ b/apps/dev-playground/client/src/components/lakebase/ProductsPanel.tsx
@@ -0,0 +1,331 @@
+import {
+  Badge,
+  Button,
+  Card,
+  CardContent,
+  CardDescription,
+  CardHeader,
+  CardTitle,
+  Checkbox,
+  Input,
+} from "@databricks/appkit-ui/react";
+import { Database, Loader2, Package } from "lucide-react";
+import { useId, useState } from "react";
+import { useLakebaseData, useLakebasePost } from "@/hooks/use-lakebase-data";
+
+interface Product {
+  id: number;
+  name: string;
+  category: string;
+  price: number | string; // PostgreSQL DECIMAL returns as string
+  stock: number;
+  created_by?: string;
+  created_at: string;
+}
+
+interface CreateProductRequest {
+  name: string;
+  category: string;
+  price: number;
+  stock: number;
+  useObo?: boolean;
+}
+
+interface HealthStatus {
+  status: string;
+  connected: boolean;
+  message: string;
+}
+
+export function ProductsPanel() {
+  const nameId = useId();
+  const categoryId = useId();
+  const priceId = useId();
+  const stockId = useId();
+  const oboCheckboxId = useId();
+
+  const {
+    data: products,
+    loading: productsLoading,
+    error: productsError,
+    refetch,
+  } = useLakebaseData<Product[]>("/api/lakebase-examples/raw/products");
+
+  const { data: health } = useLakebaseData<HealthStatus>(
+    "/api/lakebase-examples/raw/health",
+  );
+
+  const { post, loading: creating } = useLakebasePost<
+    CreateProductRequest,
+    Product
+  >("/api/lakebase-examples/raw/products");
+
+  const generateRandomProduct = () => {
+    const products = [
+      "Ergonomic Keyboard",
+      "Wireless Mouse",
+      "USB-C Hub",
+      "Laptop Stand",
+      "Monitor Arm",
+      "Mechanical Keyboard",
+      "Gaming Headset",
+      "Webcam HD",
+    ];
+    const categories = ["Electronics", "Accessories", "Peripherals", "Office"];
+    const price = (Math.random() * (199.99 - 29.99) + 29.99).toFixed(2);
+    const stock = Math.floor(Math.random() * (500 - 50) + 50);
+
+    return {
+      name: products[Math.floor(Math.random() * products.length)],
+      category: categories[Math.floor(Math.random() * categories.length)],
+      price,
+      stock: String(stock),
+    };
+  };
+
+  const [formData, setFormData] = useState(generateRandomProduct());
+  const [useObo, setUseObo] = useState(false);
+
+  const handleSubmit = async (e: React.FormEvent) => {
+    e.preventDefault();
+    const result = await post({
+      name: formData.name,
+      category: formData.category,
+      price: Number(formData.price),
+      stock: Number(formData.stock),
+      useObo,
+    });
+
+    if (result) {
+      setFormData(generateRandomProduct());
+      refetch();
+    }
+  };
+
+  return (
+    <div className="space-y-4">
+      {/* Header with connection status */}
+      <Card className="border-2">
+        <CardHeader className="pb-0 gap-0">
+          <div className="flex items-center justify-between">
+            <div className="flex items-center gap-3">
+              <div className="p-2 bg-blue-100 rounded-lg flex-shrink-0 self-start">
+                <Database className="h-6 w-6 text-blue-600" />
+              </div>
+              <div className="flex-1 min-w-0">
+                <CardTitle>Raw Driver Example</CardTitle>
+                <CardDescription>
+                  Direct PostgreSQL connection using pg.Pool with automatic
+                  OAuth token refresh
+                </CardDescription>
+              </div>
+            </div>
+            {health && (
+              <Badge
+                className={`${
+                  health.connected
+                    ? "bg-green-100 text-green-700 border-green-200"
+                    : "bg-red-100 text-red-700 border-red-200"
+                }`}
+              >
+                {health.connected ? "Connected" : "Disconnected"}
+              </Badge>
+            )}
+          </div>
+        </CardHeader>
+      </Card>
+
+      {/* Create product form */}
+      <Card>
+        <CardHeader>
+          <CardTitle className="text-lg">Create Product</CardTitle>
+        </CardHeader>
+        <CardContent>
+          <form onSubmit={handleSubmit} className="space-y-4">
+            <div className="grid grid-cols-1 md:grid-cols-2 gap-4">
+              <div>
+                <label
+                  htmlFor={nameId}
+                  className="text-sm font-medium mb-1 block"
+                >
+                  Product Name
+                </label>
+                <Input
+                  id={nameId}
+                  value={formData.name}
+                  onChange={(e) =>
+                    setFormData({ ...formData, name: e.target.value })
+                  }
+                  placeholder="Wireless Mouse"
+                  required
+                />
+              </div>
+              <div>
+                <label
+                  htmlFor={categoryId}
+                  className="text-sm font-medium mb-1 block"
+                >
+                  Category
+                </label>
+                <Input
+                  id={categoryId}
+                  value={formData.category}
+                  onChange={(e) =>
+                    setFormData({ ...formData, category: e.target.value })
+                  }
+                  placeholder="Electronics"
+                  required
+                />
+              </div>
+              <div>
+                <label
+                  htmlFor={priceId}
+                  className="text-sm font-medium mb-1 block"
+                >
+                  Price
+                </label>
+                <Input
+                  id={priceId}
+                  type="number"
+                  step="0.01"
+                  value={formData.price}
+                  onChange={(e) =>
+                    setFormData({ ...formData, price: e.target.value })
+                  }
+                  placeholder="29.99"
+                  required
+                />
+              </div>
+              <div>
+                <label
+                  htmlFor={stockId}
+                  className="text-sm font-medium mb-1 block"
+                >
+                  Stock
+                </label>
+                <Input
+                  id={stockId}
+                  type="number"
+                  value={formData.stock}
+                  onChange={(e) =>
+                    setFormData({ ...formData, stock: e.target.value })
+                  }
+                  placeholder="100"
+                  required
+                />
+              </div>
+            </div>
+            <div className="flex items-center space-x-2 pt-2">
+              <Checkbox
+                id={oboCheckboxId}
+                checked={useObo}
+                onCheckedChange={(checked) => setUseObo(checked === true)}
+                disabled
+              />
+              <label
+                htmlFor={oboCheckboxId}
+                className="text-sm font-medium leading-none cursor-not-allowed opacity-70"
+                title="OBO authorization is not yet available for Lakebase (postgres scope not supported by the platform)"
+              >
+                Use on-behalf-of-user authorization (coming soon)
+              </label>
+            </div>
+            <Button type="submit" disabled={creating} className="w-full">
+              {creating ? (
+                <>
+                  <Loader2 className="mr-2 h-4 w-4 animate-spin" />
+                  Creating...
+                </>
+              ) : (
+                "Create Product"
+              )}
+            </Button>
+          </form>
+        </CardContent>
+      </Card>
+
+      {/* Products list */}
+      <Card>
+        <CardHeader>
+          <div className="flex items-center justify-between">
+            <CardTitle className="text-lg">Products Catalog</CardTitle>
+            <Button variant="outline" size="sm" onClick={() => refetch()}>
+              Refresh
+            </Button>
+          </div>
+        </CardHeader>
+        <CardContent>
+          {productsLoading && (
+            <div className="flex items-center gap-2 text-warning py-8">
+              <div className="w-2 h-2 bg-amber-500 rounded-full animate-pulse" />
+              Loading products...
+            </div>
+          )}
+
+          {productsError && (
+            <div className="text-destructive bg-destructive/10 p-3 rounded-md border border-destructive/20">
+              <span className="font-semibold">Error:</span>{" "}
+              {productsError.message}
+            </div>
+          )}
+
+          {products && products.length === 0 && (
+            <div className="text-center py-12 text-muted-foreground">
+              <Package className="h-12 w-12 mx-auto mb-3 opacity-50" />
+              <p>No products available. Create your first product above.</p>
+            </div>
+          )}
+
+          {products && products.length > 0 && (
+            <div className="overflow-x-auto">
+              <table className="w-full">
+                <thead>
+                  <tr className="border-b">
+                    <th className="text-left py-2 px-4 text-sm font-medium text-muted-foreground">
+                      ID
+                    </th>
+                    <th className="text-left py-2 px-4 text-sm font-medium text-muted-foreground">
+                      Name
+                    </th>
+                    <th className="text-left py-2 px-4 text-sm font-medium text-muted-foreground">
+                      Category
+                    </th>
+                    <th className="text-right py-2 px-4 text-sm font-medium text-muted-foreground">
+                      Price
+                    </th>
+                    <th className="text-right py-2 px-4 text-sm font-medium text-muted-foreground">
+                      Stock
+                    </th>
+                    <th className="text-left py-2 px-4 text-sm font-medium text-muted-foreground">
+                      Created By
+                    </th>
+                  </tr>
+                </thead>
+                <tbody>
+                  {products.map((product) => (
+                    <tr key={product.id} className="border-b last:border-0">
+                      <td className="py-3 px-4 text-sm">{product.id}</td>
+                      <td className="py-3 px-4 font-medium">{product.name}</td>
+                      <td className="py-3 px-4 text-sm">
+                        <Badge variant="outline">{product.category}</Badge>
+                      </td>
+                      <td className="py-3 px-4 text-sm text-right">
+                        ${Number(product.price).toFixed(2)}
+                      </td>
+                      <td className="py-3 px-4 text-sm text-right">
+                        {product.stock}
+                      </td>
+                      <td className="py-3 px-4 text-sm font-mono text-xs truncate max-w-[200px]">
+                        {product.created_by || "unknown"}
+                      </td>
+                    </tr>
+                  ))}
+                </tbody>
+              </table>
+            </div>
+          )}
+        </CardContent>
+      </Card>
+    </div>
+  );
+}
diff --git a/apps/dev-playground/client/src/components/lakebase/TasksPanel.tsx b/apps/dev-playground/client/src/components/lakebase/TasksPanel.tsx
new file mode 100644
index 00000000..fdc5c19a
--- /dev/null
+++ b/apps/dev-playground/client/src/components/lakebase/TasksPanel.tsx
@@ -0,0 +1,401 @@
+import {
+  Badge,
+  Button,
+  Card,
+  CardContent,
+  CardDescription,
+  CardHeader,
+  CardTitle,
+  Input,
+  Textarea,
+} from "@databricks/appkit-ui/react";
+import { CheckCircle, Circle, ListTodo, Loader2 } from "lucide-react";
+import { useId, useState } from "react";
+import {
+  useLakebaseData,
+  useLakebasePatch,
+  useLakebasePost,
+} from "@/hooks/use-lakebase-data";
+
+interface Task {
+  id: number;
+  title: string;
+  status: "pending" | "in_progress" | "completed";
+  description: string | null;
+  createdAt: string;
+}
+
+interface TaskStats {
+  total: number;
+  pending: number;
+  inProgress: number;
+  completed: number;
+}
+
+export function TasksPanel() {
+  const titleId = useId();
+  const descriptionId = useId();
+
+  const {
+    data: tasks,
+    loading: tasksLoading,
+    error: tasksError,
+    refetch,
+  } = useLakebaseData<Task[]>("/api/lakebase-examples/typeorm/tasks");
+
+  const { data: stats } = useLakebaseData<TaskStats>(
+    "/api/lakebase-examples/typeorm/stats",
+  );
+
+  const { post, loading: creating } = useLakebasePost<Partial<Task>, Task>(
+    "/api/lakebase-examples/typeorm/tasks",
+  );
+
+  const { patch, loading: updating } = useLakebasePatch<
+    { status: string },
+    Task
+  >("/api/lakebase-examples/typeorm/tasks");
+
+  const generateRandomTask = () => {
+    const tasks = [
+      {
+        title: "Implement user authentication",
+        description: "Add OAuth2 authentication flow with JWT tokens",
+      },
+      {
+        title: "Write API documentation",
+        description: "Document all REST endpoints with examples",
+      },
+      {
+        title: "Set up CI/CD pipeline",
+        description: "Configure GitHub Actions for automated testing",
+      },
+      {
+        title: "Add error monitoring",
+        description: "Integrate error tracking and alerting system",
+      },
+      {
+        title: "Optimize database queries",
+        description: "Add indexes and analyze slow queries",
+      },
+      {
+        title: "Implement data validation",
+        description: "Add schema validation for all API requests",
+      },
+      {
+        title: "Set up development environment",
+        description: "Configure local development tools and dependencies",
+      },
+      {
+        title: "Design database schema",
+        description: "Create ERD and define table relationships",
+      },
+    ];
+
+    const task = tasks[Math.floor(Math.random() * tasks.length)];
+    return {
+      title: task.title,
+      description: task.description,
+    };
+  };
+
+  const [formData, setFormData] = useState(generateRandomTask());
+
+  const handleSubmit = async (e: React.FormEvent) => {
+    e.preventDefault();
+    const result = await post({
+      title: formData.title,
+      description: formData.description || null,
+      status: "pending",
+    });
+
+    if (result) {
+      setFormData(generateRandomTask());
+      refetch();
+    }
+  };
+
+  const handleStatusUpdate = async (id: number, status: Task["status"]) => {
+    const result = await patch(id, { status });
+    if (result) {
+      refetch();
+    }
+  };
+
+  const getStatusBadge = (status: Task["status"]) => {
+    switch (status) {
+      case "pending":
+        return (
+          <Badge className="bg-gray-100 text-gray-700 border-gray-200">
+            <Circle className="w-3 h-3 mr-1" />
+            Pending
+          </Badge>
+        );
+      case "in_progress":
+        return (
+          <Badge className="bg-blue-100 text-blue-700 border-blue-200">
+            <Loader2 className="w-3 h-3 mr-1 animate-spin" />
+            In Progress
+          </Badge>
+        );
+      case "completed":
+        return (
+          <Badge className="bg-green-100 text-green-700 border-green-200">
+            <CheckCircle className="w-3 h-3 mr-1" />
+            Completed
+          </Badge>
+        );
+    }
+  };
+
+  const tasksByStatus = tasks
+    ? {
+        pending: tasks.filter((t) => t.status === "pending"),
+        in_progress: tasks.filter((t) => t.status === "in_progress"),
+        completed: tasks.filter((t) => t.status === "completed"),
+      }
+    : { pending: [], in_progress: [], completed: [] };
+
+  return (
+    <div className="space-y-4">
+      {/* Header */}
+      <Card className="border-2">
+        <CardHeader className="pb-0 gap-0">
+          <div className="flex items-center gap-3">
+            <div className="p-2 bg-green-100 rounded-lg flex-shrink-0 self-start">
+              <ListTodo className="h-6 w-6 text-green-600" />
+            </div>
+            <div className="flex-1 min-w-0">
+              <CardTitle>TypeORM Example</CardTitle>
+              <CardDescription>
+                Entity-based data access with decorators and repository pattern
+              </CardDescription>
+            </div>
+          </div>
+        </CardHeader>
+      </Card>
+
+      {/* Statistics */}
+      {stats && (
+        <div className="grid grid-cols-1 md:grid-cols-4 gap-4">
+          <Card>
+            <CardHeader className="pb-3">
+              <CardDescription className="text-xs">Total Tasks</CardDescription>
+              <CardTitle className="text-2xl">{stats.total}</CardTitle>
+            </CardHeader>
+          </Card>
+          <Card>
+            <CardHeader className="pb-3">
+              <CardDescription className="text-xs">Pending</CardDescription>
+              <CardTitle className="text-2xl">{stats.pending}</CardTitle>
+            </CardHeader>
+          </Card>
+          <Card>
+            <CardHeader className="pb-3">
+              <CardDescription className="text-xs">In Progress</CardDescription>
+              <CardTitle className="text-2xl">{stats.inProgress}</CardTitle>
+            </CardHeader>
+          </Card>
+          <Card>
+            <CardHeader className="pb-3">
+              <CardDescription className="text-xs">Completed</CardDescription>
+              <CardTitle className="text-2xl">{stats.completed}</CardTitle>
+            </CardHeader>
+          </Card>
+        </div>
+      )}
+
+      {/* Create task form */}
+      <Card>
+        <CardHeader>
+          <CardTitle className="text-lg">Create Task</CardTitle>
+        </CardHeader>
+        <CardContent>
+          <form onSubmit={handleSubmit} className="space-y-4">
+            <div>
+              <label
+                htmlFor={titleId}
+                className="text-sm font-medium mb-1 block"
+              >
+                Task Title
+              </label>
+              <Input
+                id={titleId}
+                value={formData.title}
+                onChange={(e) =>
+                  setFormData({ ...formData, title: e.target.value })
+                }
+                placeholder="Implement feature X"
+                required
+              />
+            </div>
+            <div>
+              <label
+                htmlFor={descriptionId}
+                className="text-sm font-medium mb-1 block"
+              >
+                Description (optional)
+              </label>
+              <Textarea
+                id={descriptionId}
+                value={formData.description}
+                onChange={(e) =>
+                  setFormData({ ...formData, description: e.target.value })
+                }
+                placeholder="Add detailed description..."
+                rows={3}
+              />
+            </div>
+            <Button type="submit" disabled={creating} className="w-full">
+              {creating ? (
+                <>
+                  <Loader2 className="mr-2 h-4 w-4 animate-spin" />
+                  Creating...
+                </>
+              ) : (
+                "Create Task"
+              )}
+            </Button>
+          </form>
+        </CardContent>
+      </Card>
+
+      {/* Task board */}
+      <Card>
+        <CardHeader>
+          <div className="flex items-center justify-between">
+            <CardTitle className="text-lg">Task Board</CardTitle>
+            <Button variant="outline" size="sm" onClick={() => refetch()}>
+              Refresh
+            </Button>
+          </div>
+        </CardHeader>
+        <CardContent>
+          {tasksLoading && (
+            <div className="flex items-center gap-2 text-warning py-8">
+              <div className="w-2 h-2 bg-amber-500 rounded-full animate-pulse" />
+              Loading tasks...
+            </div>
+          )}
+
+          {tasksError && (
+            <div className="text-destructive bg-destructive/10 p-3 rounded-md border border-destructive/20">
+              <span className="font-semibold">Error:</span> {tasksError.message}
+            </div>
+          )}
+
+          {tasks && tasks.length === 0 && (
+            <div className="text-center py-12 text-muted-foreground">
+              <ListTodo className="h-12 w-12 mx-auto mb-3 opacity-50" />
+              <p>No tasks yet. Add a task to get started.</p>
+            </div>
+          )}
+
+          {tasks && tasks.length > 0 && (
+            <div className="grid grid-cols-1 md:grid-cols-3 gap-4">
+              {/* Pending column */}
+              <div className="space-y-3">
+                <div className="font-semibold text-sm text-muted-foreground uppercase tracking-wide">
+                  Pending ({tasksByStatus.pending.length})
+                </div>
+                <div className="space-y-2">
+                  {tasksByStatus.pending.map((task) => (
+                    <Card key={task.id} className="p-3">
+                      <div className="space-y-2">
+                        <div>{getStatusBadge(task.status)}</div>
+                        <h4 className="font-medium text-sm">{task.title}</h4>
+                        {task.description && (
+                          <p className="text-xs text-muted-foreground line-clamp-2">
+                            {task.description}
+                          </p>
+                        )}
+                        <Button
+                          size="sm"
+                          variant="outline"
+                          className="w-full"
+                          onClick={() =>
+                            handleStatusUpdate(task.id, "in_progress")
+                          }
+                          disabled={updating}
+                        >
+                          Start
+                        </Button>
+                      </div>
+                    </Card>
+                  ))}
+                </div>
+              </div>
+
+              {/* In Progress column */}
+              <div className="space-y-3">
+                <div className="font-semibold text-sm text-muted-foreground uppercase tracking-wide">
+                  In Progress ({tasksByStatus.in_progress.length})
+                </div>
+                <div className="space-y-2">
+                  {tasksByStatus.in_progress.map((task) => (
+                    <Card key={task.id} className="p-3">
+                      <div className="space-y-2">
+                        <div>{getStatusBadge(task.status)}</div>
+                        <h4 className="font-medium text-sm">{task.title}</h4>
+                        {task.description && (
+                          <p className="text-xs text-muted-foreground line-clamp-2">
+                            {task.description}
+                          </p>
+                        )}
+                        <div className="flex gap-2">
+                          <Button
+                            size="sm"
+                            variant="outline"
+                            className="flex-1"
+                            onClick={() =>
+                              handleStatusUpdate(task.id, "pending")
+                            }
+                            disabled={updating}
+                          >
+                            Back
+                          </Button>
+                          <Button
+                            size="sm"
+                            className="flex-1"
+                            onClick={() =>
+                              handleStatusUpdate(task.id, "completed")
+                            }
+                            disabled={updating}
+                          >
+                            Complete
+                          </Button>
+                        </div>
+                      </div>
+                    </Card>
+                  ))}
+                </div>
+              </div>
+
+              {/* Completed column */}
+              <div className="space-y-3">
+                <div className="font-semibold text-sm text-muted-foreground uppercase tracking-wide">
+                  Completed ({tasksByStatus.completed.length})
+                </div>
+                <div className="space-y-2">
+                  {tasksByStatus.completed.map((task) => (
+                    <Card key={task.id} className="p-3 opacity-75">
+                      <div className="space-y-2">
+                        <div>{getStatusBadge(task.status)}</div>
+                        <h4 className="font-medium text-sm">{task.title}</h4>
+                        {task.description && (
+                          <p className="text-xs text-muted-foreground line-clamp-2">
+                            {task.description}
+                          </p>
+                        )}
+                      </div>
+                    </Card>
+                  ))}
+                </div>
+              </div>
+            </div>
+          )}
+        </CardContent>
+      </Card>
+    </div>
+  );
+}
diff --git a/apps/dev-playground/client/src/components/lakebase/index.ts b/apps/dev-playground/client/src/components/lakebase/index.ts
new file mode 100644
index 00000000..6ba528a6
--- /dev/null
+++ b/apps/dev-playground/client/src/components/lakebase/index.ts
@@ -0,0 +1,4 @@
+export { ActivityLogsPanel } from "./ActivityLogsPanel";
+export { OrdersPanel } from "./OrdersPanel";
+export { ProductsPanel } from "./ProductsPanel";
+export { TasksPanel } from "./TasksPanel";
diff --git a/apps/dev-playground/client/src/hooks/use-lakebase-data.ts b/apps/dev-playground/client/src/hooks/use-lakebase-data.ts
new file mode 100644
index 00000000..a6049dcc
--- /dev/null
+++ b/apps/dev-playground/client/src/hooks/use-lakebase-data.ts
@@ -0,0 +1,144 @@
+import { useCallback, useEffect, useState } from "react";
+
+interface UseLakebaseDataOptions {
+  autoFetch?: boolean;
+}
+
+interface UseLakebaseDataResult<T> {
+  data: T | null;
+  loading: boolean;
+  error: Error | null;
+  refetch: () => Promise<void>;
+}
+
+/**
+ * Generic hook for fetching data from Lakebase example endpoints
+ *
+ * @example
+ * const { data, loading, error, refetch } = useLakebaseData<Product[]>(
+ *   '/api/lakebase-examples/raw/products'
+ * );
+ */
+export function useLakebaseData<T = unknown>(
+  endpoint: string,
+  options: UseLakebaseDataOptions = {},
+): UseLakebaseDataResult<T> {
+  const { autoFetch = true } = options;
+  const [data, setData] = useState<T | null>(null);
+  const [loading, setLoading] = useState(autoFetch);
+  const [error, setError] = useState<Error | null>(null);
+
+  const fetchData = useCallback(async () => {
+    setLoading(true);
+    setError(null);
+
+    try {
+      const response = await fetch(endpoint);
+      if (!response.ok) {
+        throw new Error(`HTTP ${response.status}: ${response.statusText}`);
+      }
+      const json = await response.json();
+      setData(json);
+    } catch (err) {
+      setError(err instanceof Error ? err : new Error(String(err)));
+    } finally {
+      setLoading(false);
+    }
+  }, [endpoint]);
+
+  useEffect(() => {
+    if (autoFetch) {
+      fetchData();
+    }
+  }, [autoFetch, fetchData]);
+
+  return { data, loading, error, refetch: fetchData };
+}
+
+/**
+ * Hook for posting data to Lakebase example endpoints
+ */
+export function useLakebasePost<TRequest = unknown, TResponse = unknown>(
+  endpoint: string,
+) {
+  const [loading, setLoading] = useState(false);
+  const [error, setError] = useState<Error | null>(null);
+
+  const post = useCallback(
+    async (body: TRequest): Promise<TResponse | null> => {
+      setLoading(true);
+      setError(null);
+
+      try {
+        const response = await fetch(endpoint, {
+          method: "POST",
+          headers: { "Content-Type": "application/json" },
+          body: JSON.stringify(body),
+        });
+
+        if (!response.ok) {
+          const errorData = await response.json().catch(() => ({}));
+          throw new Error(
+            errorData.message ||
+              `HTTP ${response.status}: ${response.statusText}`,
+          );
+        }
+
+        return await response.json();
+      } catch (err) {
+        const error = err instanceof Error ? err : new Error(String(err));
+        setError(error);
+        return null;
+      } finally {
+        setLoading(false);
+      }
+    },
+    [endpoint],
+  );
+
+  return { post, loading, error };
+}
+
+/**
+ * Hook for PATCH requests to Lakebase example endpoints
+ */
+export function useLakebasePatch<TRequest = unknown, TResponse = unknown>(
+  baseEndpoint: string,
+) {
+  const [loading, setLoading] = useState(false);
+  const [error, setError] = useState<Error | null>(null);
+
+  const patch = useCallback(
+    async (id: number | string, body: TRequest): Promise<TResponse | null> => {
+      setLoading(true);
+      setError(null);
+
+      try {
+        const response = await fetch(`${baseEndpoint}/${id}`, {
+          method: "PATCH",
+          headers: { "Content-Type": "application/json" },
+          body: JSON.stringify(body),
+        });
+
+        if (!response.ok) {
+          const errorData = await response.json().catch(() => ({}));
+          throw new Error(
+            errorData.message ||
+              `HTTP ${response.status}: ${response.statusText}`,
+          );
+        }
+
+        return await response.json();
+      } catch (err) {
+        const error = err instanceof Error ? err : new Error(String(err));
+        setError(error);
+        return null;
+      } finally {
+        setLoading(false);
+      }
+    },
+    [baseEndpoint],
+  );
+
+  return { patch, loading, error };
+}
diff --git a/apps/dev-playground/client/src/routeTree.gen.ts b/apps/dev-playground/client/src/routeTree.gen.ts
index f9b31113..2b92f113 100644
--- a/apps/dev-playground/client/src/routeTree.gen.ts
+++ b/apps/dev-playground/client/src/routeTree.gen.ts
@@ -13,6 +13,7 @@ import { Route as TypeSafetyRouteRouteImport } from './routes/type-safety.route'
 import { Route as TelemetryRouteRouteImport } from './routes/telemetry.route'
 import { Route as SqlHelpersRouteRouteImport } from './routes/sql-helpers.route'
 import { Route as ReconnectRouteRouteImport } from './routes/reconnect.route'
+import { Route as LakebaseRouteRouteImport } from './routes/lakebase.route'
 import { Route as DataVisualizationRouteRouteImport } from './routes/data-visualization.route'
 import { Route as ArrowAnalyticsRouteRouteImport } from './routes/arrow-analytics.route'
 import { Route as AnalyticsRouteRouteImport } from './routes/analytics.route'
@@ -38,6 +39,11 @@ const ReconnectRouteRoute = ReconnectRouteRouteImport.update({
   path: '/reconnect',
   getParentRoute: () => rootRouteImport,
 } as any)
+const LakebaseRouteRoute = LakebaseRouteRouteImport.update({
+  id: '/lakebase',
+  path: '/lakebase',
+  getParentRoute: () => rootRouteImport,
+} as any)
 const DataVisualizationRouteRoute = DataVisualizationRouteRouteImport.update({
   id: '/data-visualization',
   path: '/data-visualization',
@@ -64,6 +70,7 @@ export interface FileRoutesByFullPath {
   '/analytics': typeof AnalyticsRouteRoute
   '/arrow-analytics': typeof ArrowAnalyticsRouteRoute
   '/data-visualization': typeof DataVisualizationRouteRoute
+  '/lakebase': typeof LakebaseRouteRoute
   '/reconnect': typeof ReconnectRouteRoute
   '/sql-helpers': typeof SqlHelpersRouteRoute
   '/telemetry': typeof TelemetryRouteRoute
@@ -74,6 +81,7 @@ export interface FileRoutesByTo {
   '/analytics': typeof AnalyticsRouteRoute
   '/arrow-analytics': typeof ArrowAnalyticsRouteRoute
   '/data-visualization': typeof DataVisualizationRouteRoute
+  '/lakebase': typeof LakebaseRouteRoute
   '/reconnect': typeof ReconnectRouteRoute
   '/sql-helpers': typeof SqlHelpersRouteRoute
   '/telemetry': typeof TelemetryRouteRoute
@@ -85,6 +93,7 @@ export interface FileRoutesById {
   '/analytics': typeof AnalyticsRouteRoute
   '/arrow-analytics': typeof ArrowAnalyticsRouteRoute
   '/data-visualization': typeof DataVisualizationRouteRoute
+  '/lakebase': typeof LakebaseRouteRoute
   '/reconnect': typeof ReconnectRouteRoute
   '/sql-helpers': typeof SqlHelpersRouteRoute
   '/telemetry': typeof TelemetryRouteRoute
@@ -97,6 +106,7 @@ export interface FileRouteTypes {
     | '/analytics'
     | '/arrow-analytics'
     | '/data-visualization'
+    | '/lakebase'
     | '/reconnect'
     | '/sql-helpers'
     | '/telemetry'
@@ -107,6 +117,7 @@ export interface FileRouteTypes {
     | '/analytics'
     | '/arrow-analytics'
     | '/data-visualization'
+    | '/lakebase'
     | '/reconnect'
     | '/sql-helpers'
     | '/telemetry'
@@ -117,6 +128,7 @@ export interface FileRouteTypes {
     | '/analytics'
     | '/arrow-analytics'
     | '/data-visualization'
+    | '/lakebase'
     | '/reconnect'
     | '/sql-helpers'
     | '/telemetry'
@@ -128,6 +140,7 @@ export interface RootRouteChildren {
   AnalyticsRouteRoute: typeof AnalyticsRouteRoute
   ArrowAnalyticsRouteRoute: typeof ArrowAnalyticsRouteRoute
   DataVisualizationRouteRoute: typeof DataVisualizationRouteRoute
+  LakebaseRouteRoute: typeof LakebaseRouteRoute
   ReconnectRouteRoute: typeof ReconnectRouteRoute
   SqlHelpersRouteRoute: typeof SqlHelpersRouteRoute
   TelemetryRouteRoute: typeof TelemetryRouteRoute
@@ -164,6 +177,13 @@ declare module '@tanstack/react-router' {
       preLoaderRoute: typeof ReconnectRouteRouteImport
       parentRoute: typeof rootRouteImport
     }
+    '/lakebase': {
+      id: '/lakebase'
+      path: '/lakebase'
+      fullPath: '/lakebase'
+      preLoaderRoute: typeof LakebaseRouteRouteImport
+      parentRoute: typeof rootRouteImport
+    }
     '/data-visualization': {
       id: '/data-visualization'
       path: '/data-visualization'
@@ -200,6 +220,7 @@ const rootRouteChildren: RootRouteChildren = {
   AnalyticsRouteRoute: AnalyticsRouteRoute,
   ArrowAnalyticsRouteRoute: ArrowAnalyticsRouteRoute,
   DataVisualizationRouteRoute: DataVisualizationRouteRoute,
+  LakebaseRouteRoute: LakebaseRouteRoute,
   ReconnectRouteRoute: ReconnectRouteRoute,
   SqlHelpersRouteRoute: SqlHelpersRouteRoute,
   TelemetryRouteRoute: TelemetryRouteRoute,
diff --git a/apps/dev-playground/client/src/routes/__root.tsx b/apps/dev-playground/client/src/routes/__root.tsx
index b2faa651..842ed077 100644
--- a/apps/dev-playground/client/src/routes/__root.tsx
+++ b/apps/dev-playground/client/src/routes/__root.tsx
@@ -48,6 +48,14 @@ function RootComponent() {
                     Arrow Analytics
                   </Button>
                 </Link>
+                <Link to="/lakebase" className="no-underline">
+                  <Button
+                    variant="ghost"
+                    className="text-foreground hover:text-secondary-foreground"
+                  >
+                    Lakebase
+                  </Button>
+                </Link>
                 <Link to="/reconnect" className="no-underline">
                   <Button
                     variant="ghost"
diff --git a/apps/dev-playground/client/src/routes/index.tsx b/apps/dev-playground/client/src/routes/index.tsx
index c6d5b7fc..58a6f410 100644
--- a/apps/dev-playground/client/src/routes/index.tsx
+++ b/apps/dev-playground/client/src/routes/index.tsx
@@ -162,6 +162,25 @@ function IndexRoute() {
               </Button>
             </div>
           </Card>
+
+          <Card className="p-6 hover:shadow-lg transition-shadow cursor-pointer">
+            <div className="flex flex-col h-full">
+              <h3 className="text-2xl font-semibold text-foreground mb-3">
+                Lakebase Examples
+              </h3>
+              <p className="text-muted-foreground mb-6 flex-grow">
+                Four approaches to PostgreSQL database integration with
+                Databricks Lakebase: Raw driver, Drizzle ORM, TypeORM, and
+                Sequelize with OAuth token refresh.
+              </p>
+              <Button
+                onClick={() => navigate({ to: "/lakebase" })}
+                className="w-full"
+              >
+                Explore Lakebase Integration
+              </Button>
+            </div>
+          </Card>
         </div>
 
         <div className="text-center pt-12 border-t border-border">
diff --git a/apps/dev-playground/client/src/routes/lakebase.route.tsx b/apps/dev-playground/client/src/routes/lakebase.route.tsx
new file mode 100644
index 00000000..59694e24
--- /dev/null
+++ b/apps/dev-playground/client/src/routes/lakebase.route.tsx
@@ -0,0 +1,64 @@
+import {
+  Tabs,
+  TabsContent,
+  TabsList,
+  TabsTrigger,
+} from "@databricks/appkit-ui/react";
+import { createFileRoute, retainSearchParams } from "@tanstack/react-router";
+import {
+  ActivityLogsPanel,
+  OrdersPanel,
+  ProductsPanel,
+  TasksPanel,
+} from "@/components/lakebase";
+
+export const Route = createFileRoute("/lakebase")({
+  component: LakebaseRoute,
+  search: {
+    middlewares: [retainSearchParams(true)],
+  },
+});
+
+function LakebaseRoute() {
+  return (
+    <div className="min-h-screen bg-background">
+      <div className="max-w-6xl mx-auto px-6 py-12">
+        {/* Page header */}
+        <div className="mb-8">
+          <h1 className="text-3xl font-bold mb-2">Lakebase Examples</h1>
+          <p className="text-base text-muted-foreground">
+            Four approaches to PostgreSQL database integration with Databricks
+            Lakebase. Compare raw driver, Drizzle ORM, TypeORM, and Sequelize
+            side-by-side.
+          </p>
+        </div>
+
+        {/* Tabs for different examples */}
+        <Tabs defaultValue="raw" className="space-y-6">
+          <TabsList className="grid w-full grid-cols-4">
+            <TabsTrigger value="raw">Raw Driver</TabsTrigger>
+            <TabsTrigger value="drizzle">Drizzle ORM</TabsTrigger>
+            <TabsTrigger value="typeorm">TypeORM</TabsTrigger>
+            <TabsTrigger value="sequelize">Sequelize</TabsTrigger>
+          </TabsList>
+
+          <TabsContent value="raw">
+            <ProductsPanel />
+          </TabsContent>
+
+          <TabsContent value="drizzle">
+            <ActivityLogsPanel />
+          </TabsContent>
+
+          <TabsContent value="typeorm">
+            <TasksPanel />
+          </TabsContent>
+
+          <TabsContent value="sequelize">
+            <OrdersPanel />
+          </TabsContent>
+        </Tabs>
+      </div>
+    </div>
+  );
+}
diff --git a/apps/dev-playground/package.json b/apps/dev-playground/package.json
index c5781cf2..56357404 100644
--- a/apps/dev-playground/package.json
+++ b/apps/dev-playground/package.json
@@ -25,6 +25,10 @@
   "description": "",
   "dependencies": {
     "@databricks/appkit": "workspace:*",
+    "drizzle-orm": "^0.45.1",
+    "reflect-metadata": "^0.2.0",
+    "sequelize": "^6.37.7",
+    "typeorm": "^0.3.20",
     "zod": "^4.1.13"
   },
   "devDependencies": {
diff --git a/apps/dev-playground/server/index.ts b/apps/dev-playground/server/index.ts
index a56ba4a7..f43da821 100644
--- a/apps/dev-playground/server/index.ts
+++ b/apps/dev-playground/server/index.ts
@@ -1,5 +1,7 @@
+import "reflect-metadata";
 import { analytics, createApp, server } from "@databricks/appkit";
 import { WorkspaceClient } from "@databricks/sdk-experimental";
+import { lakebaseExamples } from "./lakebase-examples-plugin";
 import { reconnect } from "./reconnect-plugin";
 import { telemetryExamples } from "./telemetry-example-plugin";
 
@@ -19,6 +21,7 @@ createApp({
     reconnect(),
     telemetryExamples(),
     analytics({}),
+    lakebaseExamples(),
   ],
   ...(process.env.APPKIT_E2E_TEST && { client: createMockClient() }),
 }).then((appkit) => {
diff --git a/apps/dev-playground/server/lakebase-examples-plugin.ts b/apps/dev-playground/server/lakebase-examples-plugin.ts
new file mode 100644
index 00000000..fba9420b
--- /dev/null
+++ b/apps/dev-playground/server/lakebase-examples-plugin.ts
@@ -0,0 +1,75 @@
+import { Plugin, toPlugin } from "@databricks/appkit";
+import type { IAppRouter } from "shared";
+import * as drizzleExample from "./lakebase-examples/drizzle-example";
+import * as rawExample from "./lakebase-examples/raw-driver-example";
+import * as sequelizeExample from "./lakebase-examples/sequelize-example";
+import * as typeormExample from "./lakebase-examples/typeorm-example";
+
+/**
+ * Lakebase Examples Plugin
+ *
+ * Orchestrates four different approaches to database integration:
+ * 1. Raw pg.Pool driver - Direct SQL queries
+ * 2. Drizzle ORM - Type-safe schema definitions
+ * 3. TypeORM - Entity-based data access
+ * 4. Sequelize - Model-based ORM with intuitive API
+ *
+ * Each example is self-contained and can be used as a reference for
+ * implementing Lakebase integration in your own applications.
+ */
+
+export class LakebaseExamplesPlugin extends Plugin {
+  public name = "lakebase-examples";
+  protected envVars: string[] = [];
+
+  async setup() {
+    // Check if Lakebase is configured
+    if (!process.env.PGHOST || !process.env.LAKEBASE_ENDPOINT) {
+      console.warn(
+        "Lakebase not configured (missing PGHOST or LAKEBASE_ENDPOINT), examples disabled",
+      );
+      return;
+    }
+
+    try {
+      // Initialize all four examples in parallel
+      await Promise.all([
+        rawExample.setup(),
+        drizzleExample.setup(),
+        typeormExample.setup(),
+        sequelizeExample.setup(),
+      ]);
+    } catch (error) {
+      console.error("Failed to initialize Lakebase examples:", error);
+      // Don't throw - allow app to start even if Lakebase examples fail
+    }
+  }
+
+  injectRoutes(router: IAppRouter): void {
+    // Skip route injection if Lakebase is not configured
+    if (!process.env.PGHOST || !process.env.LAKEBASE_ENDPOINT) {
+      return;
+    }
+
+    // Register routes for each example under /api/lakebaseExamples/*
+    rawExample.registerRoutes(router, "/raw");
+    drizzleExample.registerRoutes(router, "/drizzle");
+    typeormExample.registerRoutes(router, "/typeorm");
+    sequelizeExample.registerRoutes(router, "/sequelize");
+  }
+
+  async close() {
+    await Promise.all([
+      rawExample.cleanup(),
+      drizzleExample.cleanup(),
+      typeormExample.cleanup(),
+      sequelizeExample.cleanup(),
+    ]);
+  }
+}
+
+export const lakebaseExamples = toPlugin<
+  typeof LakebaseExamplesPlugin,
+  Record<string, never>,
+  "lakebaseExamples"
+>(LakebaseExamplesPlugin, "lakebaseExamples");
diff --git a/apps/dev-playground/server/lakebase-examples/drizzle-example.ts b/apps/dev-playground/server/lakebase-examples/drizzle-example.ts
new file mode 100644
index 00000000..f0aa6c30
--- /dev/null
+++ b/apps/dev-playground/server/lakebase-examples/drizzle-example.ts
@@ -0,0 +1,192 @@
+import { createLakebasePool } from "@databricks/appkit";
+import { count, desc, sql } from "drizzle-orm";
+import { drizzle } from "drizzle-orm/node-postgres";
+import {
+  index,
+  jsonb,
+  pgSchema,
+  serial,
+  timestamp,
+  varchar,
+} from "drizzle-orm/pg-core";
+import type { Pool } from "pg";
+import type { IAppRouter } from "shared";
+
+/**
+ * Drizzle ORM example with type-safe schema definitions.
+ *
+ * This example demonstrates:
+ * - Type-safe schema definitions with drizzle-orm
+ * - Automatic type inference from schema
+ * - Query builder with TypeScript autocompletion
+ * - Aggregations and complex queries
+ * - JSON field handling
+ */
+
+// Define schema
+const drizzleExampleSchema = pgSchema("drizzle_example");
+
+export const activityLogs = drizzleExampleSchema.table(
+  "activity_logs",
+  {
+    id: serial("id").primaryKey(),
+    userId: varchar("user_id", { length: 100 }).notNull(),
+    action: varchar("action", { length: 255 }).notNull(),
+    metadata: jsonb("metadata"),
+    timestamp: timestamp("timestamp").defaultNow(),
+  },
+  (table) => ({
+    userIdIdx: index("user_id_idx").on(table.userId),
+  }),
+);
+
+type NewActivityLog = typeof activityLogs.$inferInsert;
+
+let db: ReturnType<typeof drizzle>;
+let pool: Pool;
+
+export async function setup() {
+  pool = createLakebasePool();
+  db = drizzle(pool);
+
+  // For production apps, use: npx drizzle-kit push or drizzle-kit generate + migrate
+  await pool.query(`CREATE SCHEMA IF NOT EXISTS drizzle_example`);
+
+  // Create table using raw SQL
+  await pool.query(`
+    CREATE TABLE IF NOT EXISTS drizzle_example.activity_logs (
+      id SERIAL PRIMARY KEY,
+      user_id VARCHAR(100) NOT NULL,
+      action VARCHAR(255) NOT NULL,
+      metadata JSONB,
+      timestamp TIMESTAMP DEFAULT CURRENT_TIMESTAMP
+    );
+    CREATE INDEX IF NOT EXISTS user_id_idx 
+      ON drizzle_example.activity_logs(user_id);
+  `);
+
+  // Seed if empty
+  const countResult = await db.select({ count: count() }).from(activityLogs);
+  if (Number(countResult[0].count) === 0) {
+    await seedActivityLogs(db);
+  }
+}
+
+export function registerRoutes(router: IAppRouter, basePath: string) {
+  // GET /api/lakebase-examples/drizzle/activity - List activity logs
+  router.get(`${basePath}/activity`, async (_req, res) => {
+    try {
+      const logs = await db
+        .select()
+        .from(activityLogs)
+        .orderBy(desc(activityLogs.timestamp))
+        .limit(50);
+      res.json(logs);
+    } catch (error: unknown) {
+      const err = error as Error;
+      res.status(500).json({
+        error: "Failed to fetch activity logs",
+        message: err.message,
+      });
+    }
+  });
+
+  // POST /api/lakebase-examples/drizzle/activity - Create activity log
+  router.post(`${basePath}/activity`, async (req, res) => {
+    try {
+      const { userId, action, metadata } = req.body;
+      const [log] = await db
+        .insert(activityLogs)
+        .values({
+          userId,
+          action,
+          metadata: metadata || null,
+        })
+        .returning();
+      res.json(log);
+    } catch (error: unknown) {
+      const err = error as Error;
+      res.status(500).json({
+        error: "Failed to create activity log",
+        message: err.message,
+      });
+    }
+  });
+
+  // GET /api/lakebase-examples/drizzle/stats - Aggregated statistics
+  router.get(`${basePath}/stats`, async (_req, res) => {
+    try {
+      // Total logs count
+      const totalResult = await db
+        .select({ count: count() })
+        .from(activityLogs);
+
+      // Unique users count
+      const uniqueUsersResult = await db
+        .select({
+          count: sql<number>`COUNT(DISTINCT ${activityLogs.userId})`,
+        })
+        .from(activityLogs);
+
+      // Recent activity (last 24 hours)
+      const recentResult = await db
+        .select({ count: count() })
+        .from(activityLogs)
+        .where(sql`${activityLogs.timestamp} > NOW() - INTERVAL '24 hours'`);
+
+      res.json({
+        totalLogs: Number(totalResult[0].count),
+        uniqueUsers: Number(uniqueUsersResult[0].count),
+        recentActivity: Number(recentResult[0].count),
+      });
+    } catch (error: unknown) {
+      const err = error as Error;
+      res.status(500).json({
+        error: "Failed to fetch statistics",
+        message: err.message,
+      });
+    }
+  });
+}
+
+export async function cleanup() {
+  await pool.end();
+}
+
+async function seedActivityLogs(database: ReturnType<typeof drizzle>) {
+  const users = ["alice", "bob", "charlie", "diana", "eve"];
+  const actions = [
+    "login",
+    "logout",
+    "view_dashboard",
+    "create_report",
+    "update_settings",
+    "delete_item",
+    "export_data",
+    "share_document",
+  ];
+
+  const logs: NewActivityLog[] = [];
+
+  // Generate 30 sample activity logs
+  for (let i = 0; i < 30; i++) {
+    const userId = users[Math.floor(Math.random() * users.length)];
+    const action = actions[Math.floor(Math.random() * actions.length)];
+    const metadata =
+      Math.random() > 0.5
+        ? {
+            ip: `192.168.1.${Math.floor(Math.random() * 255)}`,
+            userAgent: "Mozilla/5.0",
+            duration: Math.floor(Math.random() * 5000),
+          }
+        : null;
+
+    logs.push({
+      userId,
+      action,
+      metadata,
+    });
+  }
+
+  await database.insert(activityLogs).values(logs);
+}
diff --git a/apps/dev-playground/server/lakebase-examples/raw-driver-example.ts b/apps/dev-playground/server/lakebase-examples/raw-driver-example.ts
new file mode 100644
index 00000000..5a3b9eba
--- /dev/null
+++ b/apps/dev-playground/server/lakebase-examples/raw-driver-example.ts
@@ -0,0 +1,226 @@
+import { createLakebasePool, getOboConnection } from "@databricks/appkit";
+import type { Pool } from "pg";
+import type { IAppRouter } from "shared";
+
+let pool: Pool;
+
+/**
+ * Raw PostgreSQL driver example using pg.Pool with automatic OAuth token refresh.
+ *
+ * This example demonstrates:
+ * - Direct pg.Pool usage without ORM abstraction
+ * - Manual SQL query writing with parameterized queries
+ * - Schema and table creation (idempotent)
+ * - Basic CRUD operations
+ * - Connection health checking
+ * - On-behalf-of-user (OBO) authentication for user-specific operations
+ */
+
+interface Product {
+  id: number;
+  name: string;
+  category: string;
+  price: number;
+  stock: number;
+  created_by?: string;
+  created_at: Date;
+}
+
+export async function setup() {
+  // Create pool with automatic OAuth token refresh
+  pool = createLakebasePool();
+
+  // Create schema and table (idempotent)
+  await pool.query(`
+    CREATE SCHEMA IF NOT EXISTS raw_example;
+    
+    CREATE TABLE IF NOT EXISTS raw_example.products (
+      id SERIAL PRIMARY KEY,
+      name VARCHAR(255) NOT NULL,
+      category VARCHAR(100),
+      price DECIMAL(10, 2),
+      stock INTEGER DEFAULT 0,
+      created_by VARCHAR(255),
+      created_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP
+    );
+  `);
+
+  // Seed sample data if table is empty
+  const { rows } = await pool.query<{ count: string }>(
+    "SELECT COUNT(*) as count FROM raw_example.products",
+  );
+  if (Number(rows[0].count) === 0) {
+    await seedProducts(pool);
+  }
+}
+
+export function registerRoutes(router: IAppRouter, basePath: string) {
+  // GET /api/lakebase-examples/raw/products - List all products
+  router.get(`${basePath}/products`, async (_req, res) => {
+    try {
+      const result = await pool.query<Product>(
+        "SELECT * FROM raw_example.products ORDER BY id",
+      );
+      res.json(result.rows);
+    } catch (error: unknown) {
+      const err = error as Error;
+      res.status(500).json({
+        error: "Failed to fetch products",
+        message: err.message,
+      });
+    }
+  });
+
+  // POST /api/lakebase-examples/raw/products - Create new product
+  router.post(`${basePath}/products`, async (req, res) => {
+    try {
+      const { name, category, price, stock, useObo } = req.body;
+
+      if (useObo) {
+        // User authorization path - execute as visiting user
+        const userToken = req.headers["x-forwarded-access-token"];
+        if (!userToken) {
+          return res.status(401).json({
+            error:
+              "User authorization requires x-forwarded-access-token header",
+          });
+        }
+
+        // Extract user email from Databricks Apps headers
+        const userEmail =
+          (req.headers["x-forwarded-email"] as string) ||
+          (req.headers["x-forwarded-preferred-username"] as string) ||
+          "unknown-user";
+
+        // Create OBO connection using user's token
+        const client = await getOboConnection({
+          userAccessToken: userToken as string,
+          endpoint: process.env.LAKEBASE_ENDPOINT ?? "",
+          host: process.env.PGHOST ?? "",
+          database: process.env.PGDATABASE ?? "",
+        });
+
+        try {
+          const result = await client.query<Product>(
+            `INSERT INTO raw_example.products (name, category, price, stock, created_by) 
+             VALUES ($1, $2, $3, $4, $5) RETURNING *`,
+            [name, category, Number(price), Number(stock), userEmail],
+          );
+          res.json(result.rows[0]);
+        } finally {
+          await client.end();
+        }
+      } else {
+        // App authorization path - execute as service principal
+        const servicePrincipal =
+          process.env.DATABRICKS_CLIENT_ID || "app-service-principal";
+
+        const result = await pool.query<Product>(
+          `INSERT INTO raw_example.products (name, category, price, stock, created_by) 
+           VALUES ($1, $2, $3, $4, $5) RETURNING *`,
+          [name, category, Number(price), Number(stock), servicePrincipal],
+        );
+        res.json(result.rows[0]);
+      }
+    } catch (error: unknown) {
+      const err = error as Error;
+      res.status(500).json({
+        error: "Failed to create product",
+        message: err.message,
+      });
+    }
+  });
+
+  // GET /api/lakebase-examples/raw/health - Connection health check
+  router.get(`${basePath}/health`, async (_req, res) => {
+    try {
+      await pool.query("SELECT 1");
+      res.json({
+        status: "healthy",
+        connected: true,
+        message: "Connection to Lakebase is active",
+      });
+    } catch (error: unknown) {
+      const err = error as Error;
+      res.status(503).json({
+        status: "unhealthy",
+        connected: false,
+        message: err.message,
+      });
+    }
+  });
+}
+
+export async function cleanup() {
+  await pool.end();
+}
+
+async function seedProducts(pool: Pool) {
+  const products = [
+    {
+      name: "Wireless Mouse",
+      category: "Electronics",
+      price: 29.99,
+      stock: 150,
+    },
+    {
+      name: "Mechanical Keyboard",
+      category: "Electronics",
+      price: 89.99,
+      stock: 75,
+    },
+    {
+      name: "USB-C Hub",
+      category: "Electronics",
+      price: 49.99,
+      stock: 200,
+    },
+    {
+      name: "The Pragmatic Programmer",
+      category: "Books",
+      price: 39.99,
+      stock: 50,
+    },
+    {
+      name: "Clean Code",
+      category: "Books",
+      price: 42.99,
+      stock: 60,
+    },
+    {
+      name: "Cotton T-Shirt",
+      category: "Clothing",
+      price: 19.99,
+      stock: 300,
+    },
+    {
+      name: "Denim Jeans",
+      category: "Clothing",
+      price: 59.99,
+      stock: 120,
+    },
+    {
+      name: "Running Shoes",
+      category: "Clothing",
+      price: 79.99,
+      stock: 85,
+    },
+  ];
+
+  const servicePrincipal =
+    process.env.DATABRICKS_CLIENT_ID || "app-service-principal";
+
+  for (const product of products) {
+    await pool.query(
+      `INSERT INTO raw_example.products (name, category, price, stock, created_by) 
+       VALUES ($1, $2, $3, $4, $5)`,
+      [
+        product.name,
+        product.category,
+        product.price,
+        product.stock,
+        servicePrincipal,
+      ],
+    );
+  }
+}
diff --git a/apps/dev-playground/server/lakebase-examples/sequelize-example.ts b/apps/dev-playground/server/lakebase-examples/sequelize-example.ts
new file mode 100644
index 00000000..dd98e371
--- /dev/null
+++ b/apps/dev-playground/server/lakebase-examples/sequelize-example.ts
@@ -0,0 +1,272 @@
+import { getLakebaseOrmConfig } from "@databricks/appkit";
+import { DataTypes, Model, Sequelize } from "sequelize";
+import type { IAppRouter } from "shared";
+
+/**
+ * Sequelize example with model-based data access.
+ *
+ * This example demonstrates:
+ * - Model definitions with DataTypes
+ * - Standard ORM operations (CRUD)
+ * - OAuth token authentication with Sequelize
+ * - Type-safe queries with TypeScript
+ * - Automatic timestamps
+ */
+
+interface OrderAttributes {
+  id: number;
+  orderNumber: string;
+  customerName: string;
+  productName: string;
+  amount: number;
+  status: "pending" | "processing" | "shipped" | "delivered";
+  createdAt: Date;
+  updatedAt: Date;
+}
+
+interface OrderCreationAttributes
+  extends Omit<OrderAttributes, "id" | "createdAt" | "updatedAt"> {}
+
+class Order
+  extends Model<OrderAttributes, OrderCreationAttributes>
+  implements OrderAttributes
+{
+  declare id: number;
+  declare orderNumber: string;
+  declare customerName: string;
+  declare productName: string;
+  declare amount: number;
+  declare status: "pending" | "processing" | "shipped" | "delivered";
+  declare createdAt: Date;
+  declare updatedAt: Date;
+}
+
+let sequelize: Sequelize;
+
+export async function setup() {
+  sequelize = new Sequelize({
+    dialect: "postgres",
+    ...getLakebaseOrmConfig(),
+    logging: false,
+  });
+
+  // Create schema if not exists
+  await sequelize.query("CREATE SCHEMA IF NOT EXISTS sequelize_example");
+
+  // Define Order model
+  Order.init(
+    {
+      id: {
+        type: DataTypes.INTEGER,
+        primaryKey: true,
+        autoIncrement: true,
+      },
+      orderNumber: {
+        type: DataTypes.STRING(50),
+        allowNull: false,
+        field: "order_number",
+      },
+      customerName: {
+        type: DataTypes.STRING(255),
+        allowNull: false,
+        field: "customer_name",
+      },
+      productName: {
+        type: DataTypes.STRING(255),
+        allowNull: false,
+        field: "product_name",
+      },
+      amount: {
+        type: DataTypes.DECIMAL(10, 2),
+        allowNull: false,
+      },
+      status: {
+        type: DataTypes.STRING(50),
+        allowNull: false,
+        defaultValue: "pending",
+      },
+      createdAt: {
+        type: DataTypes.DATE,
+        allowNull: false,
+        field: "created_at",
+      },
+      updatedAt: {
+        type: DataTypes.DATE,
+        allowNull: false,
+        field: "updated_at",
+      },
+    },
+    {
+      sequelize,
+      schema: "sequelize_example",
+      tableName: "orders",
+      timestamps: true,
+      underscored: true,
+    },
+  );
+
+  // Sync model (create table if not exists)
+  await Order.sync();
+
+  // Seed data if table is empty
+  const count = await Order.count();
+  if (count === 0) {
+    await seedOrders();
+  }
+}
+
+export function registerRoutes(router: IAppRouter, basePath: string) {
+  // GET /api/lakebase-examples/sequelize/orders - List all orders
+  router.get(`${basePath}/orders`, async (_req, res) => {
+    try {
+      const orders = await Order.findAll({
+        order: [["createdAt", "DESC"]],
+      });
+      res.json(orders);
+    } catch (error: unknown) {
+      const err = error as Error;
+      res.status(500).json({
+        error: "Failed to fetch orders",
+        message: err.message,
+      });
+    }
+  });
+
+  // POST /api/lakebase-examples/sequelize/orders - Create new order
+  router.post(`${basePath}/orders`, async (req, res) => {
+    try {
+      const { orderNumber, customerName, productName, amount, status } =
+        req.body;
+      const order = await Order.create({
+        orderNumber,
+        customerName,
+        productName,
+        amount,
+        status: status || "pending",
+      });
+      res.json(order);
+    } catch (error: unknown) {
+      const err = error as Error;
+      res.status(500).json({
+        error: "Failed to create order",
+        message: err.message,
+      });
+    }
+  });
+
+  // PATCH /api/lakebase-examples/sequelize/orders/:id - Update order status
+  router.patch(`${basePath}/orders/:id`, async (req, res) => {
+    try {
+      const { status } = req.body;
+      const order = await Order.findByPk(req.params.id);
+
+      if (!order) {
+        res.status(404).json({
+          error: "Order not found",
+          message: `Order with id ${req.params.id} does not exist`,
+        });
+        return;
+      }
+
+      order.status = status;
+      await order.save();
+      res.json(order);
+    } catch (error: unknown) {
+      const err = error as Error;
+      res.status(500).json({
+        error: "Failed to update order",
+        message: err.message,
+      });
+    }
+  });
+
+  // GET /api/lakebase-examples/sequelize/stats - Order statistics
+  router.get(`${basePath}/stats`, async (_req, res) => {
+    try {
+      const [total, pending, processing, shipped, delivered] =
+        await Promise.all([
+          Order.count(),
+          Order.count({ where: { status: "pending" } }),
+          Order.count({ where: { status: "processing" } }),
+          Order.count({ where: { status: "shipped" } }),
+          Order.count({ where: { status: "delivered" } }),
+        ]);
+      res.json({ total, pending, processing, shipped, delivered });
+    } catch (error: unknown) {
+      const err = error as Error;
+      res.status(500).json({
+        error: "Failed to fetch statistics",
+        message: err.message,
+      });
+    }
+  });
+}
+
+export async function cleanup() {
+  if (sequelize) {
+    await sequelize.close();
+  }
+}
+
+async function seedOrders() {
+  const orders = [
+    {
+      orderNumber: "ORD-2024-001",
+      customerName: "Alice Johnson",
+      productName: "Wireless Bluetooth Headphones",
+      amount: 89.99,
+      status: "delivered" as const,
+    },
+    {
+      orderNumber: "ORD-2024-002",
+      customerName: "Bob Smith",
+      productName: "USB-C Charging Cable",
+      amount: 15.99,
+      status: "delivered" as const,
+    },
+    {
+      orderNumber: "ORD-2024-003",
+      customerName: "Carol Williams",
+      productName: "Laptop Stand - Ergonomic",
+      amount: 45.5,
+      status: "shipped" as const,
+    },
+    {
+      orderNumber: "ORD-2024-004",
+      customerName: "David Brown",
+      productName: "Mechanical Keyboard - RGB",
+      amount: 129.99,
+      status: "processing" as const,
+    },
+    {
+      orderNumber: "ORD-2024-005",
+      customerName: "Emma Davis",
+      productName: "4K Webcam with Microphone",
+      amount: 79.99,
+      status: "processing" as const,
+    },
+    {
+      orderNumber: "ORD-2024-006",
+      customerName: "Frank Miller",
+      productName: "Portable SSD 1TB",
+      amount: 149.99,
+      status: "pending" as const,
+    },
+    {
+      orderNumber: "ORD-2024-007",
+      customerName: "Grace Wilson",
+      productName: "Wireless Mouse - Ergonomic",
+      amount: 34.99,
+      status: "pending" as const,
+    },
+    {
+      orderNumber: "ORD-2024-008",
+      customerName: "Henry Moore",
+      productName: "Monitor Arm Mount",
+      amount: 59.99,
+      status: "pending" as const,
+    },
+  ];
+
+  await Order.bulkCreate(orders);
+}
diff --git a/apps/dev-playground/server/lakebase-examples/typeorm-example.ts b/apps/dev-playground/server/lakebase-examples/typeorm-example.ts
new file mode 100644
index 00000000..beaa303d
--- /dev/null
+++ b/apps/dev-playground/server/lakebase-examples/typeorm-example.ts
@@ -0,0 +1,195 @@
+import { getLakebaseOrmConfig } from "@databricks/appkit";
+import type { IAppRouter } from "shared";
+import {
+  Column,
+  CreateDateColumn,
+  DataSource,
+  Entity,
+  PrimaryGeneratedColumn,
+} from "typeorm";
+
+/**
+ * TypeORM example with entity-based data access.
+ *
+ * This example demonstrates:
+ * - Entity classes with decorators
+ * - Repository pattern for data access
+ * - OAuth token authentication with TypeORM
+ * - CRUD operations with type safety
+ * - Query builder capabilities
+ */
+
+@Entity({ schema: "typeorm_example", name: "tasks" })
+class Task {
+  @PrimaryGeneratedColumn()
+  id!: number;
+
+  @Column({ type: "varchar", length: 255 })
+  title!: string;
+
+  @Column({
+    type: "varchar",
+    length: 50,
+    default: "pending",
+  })
+  status!: "pending" | "in_progress" | "completed";
+
+  @Column({ type: "text", nullable: true })
+  description?: string;
+
+  @CreateDateColumn({ name: "created_at", type: "timestamp" })
+  createdAt!: Date;
+}
+
+let dataSource: DataSource;
+
+export async function setup() {
+  dataSource = new DataSource({
+    type: "postgres",
+    ...getLakebaseOrmConfig(),
+    entities: [Task],
+    synchronize: true,
+    logging: false,
+  });
+
+  await dataSource.initialize();
+
+  const taskRepo = dataSource.getRepository(Task);
+  const count = await taskRepo.count();
+  if (count === 0) {
+    await seedTasks(taskRepo);
+  }
+}
+
+export function registerRoutes(router: IAppRouter, basePath: string) {
+  // GET /api/lakebase-examples/typeorm/tasks - List all tasks
+  router.get(`${basePath}/tasks`, async (_req, res) => {
+    try {
+      const taskRepo = dataSource.getRepository(Task);
+      const tasks = await taskRepo.find({ order: { createdAt: "DESC" } });
+      res.json(tasks);
+    } catch (error: unknown) {
+      const err = error as Error;
+      res.status(500).json({
+        error: "Failed to fetch tasks",
+        message: err.message,
+      });
+    }
+  });
+
+  // POST /api/lakebase-examples/typeorm/tasks - Create new task
+  router.post(`${basePath}/tasks`, async (req, res) => {
+    try {
+      const taskRepo = dataSource.getRepository(Task);
+      const { title, description, status } = req.body;
+      const task = taskRepo.create({
+        title,
+        description,
+        status: status || "pending",
+      });
+      await taskRepo.save(task);
+      res.json(task);
+    } catch (error: unknown) {
+      const err = error as Error;
+      res.status(500).json({
+        error: "Failed to create task",
+        message: err.message,
+      });
+    }
+  });
+
+  // PATCH /api/lakebase-examples/typeorm/tasks/:id - Update task status
+  router.patch(`${basePath}/tasks/:id`, async (req, res) => {
+    try {
+      const taskRepo = dataSource.getRepository(Task);
+      const { status } = req.body;
+      await taskRepo.update(req.params.id, { status });
+      const updated = await taskRepo.findOne({
+        where: { id: Number(req.params.id) },
+      });
+      res.json(updated);
+    } catch (error: unknown) {
+      const err = error as Error;
+      res.status(500).json({
+        error: "Failed to update task",
+        message: err.message,
+      });
+    }
+  });
+
+  // GET /api/lakebase-examples/typeorm/stats - Task statistics
+  router.get(`${basePath}/stats`, async (_req, res) => {
+    try {
+      const taskRepo = dataSource.getRepository(Task);
+      const [total, pending, inProgress, completed] = await Promise.all([
+        taskRepo.count(),
+        taskRepo.count({ where: { status: "pending" } }),
+        taskRepo.count({ where: { status: "in_progress" } }),
+        taskRepo.count({ where: { status: "completed" } }),
+      ]);
+      res.json({ total, pending, inProgress, completed });
+    } catch (error: unknown) {
+      const err = error as Error;
+      res.status(500).json({
+        error: "Failed to fetch statistics",
+        message: err.message,
+      });
+    }
+  });
+}
+
+export async function cleanup() {
+  if (dataSource.isInitialized) {
+    await dataSource.destroy();
+  }
+}
+
+async function seedTasks(repo: any) {
+  const tasks = [
+    {
+      title: "Set up development environment",
+      description: "Install Node.js, pnpm, and configure IDE",
+      status: "completed" as const,
+    },
+    {
+      title: "Implement user authentication",
+      description: "Add OAuth2 authentication flow with JWT tokens",
+      status: "in_progress" as const,
+    },
+    {
+      title: "Design database schema",
+      description: "Create ERD and define table relationships",
+      status: "completed" as const,
+    },
+    {
+      title: "Write API documentation",
+      description: "Document all REST endpoints with examples",
+      status: "pending" as const,
+    },
+    {
+      title: "Implement data validation",
+      description: "Add Zod schemas for request validation",
+      status: "in_progress" as const,
+    },
+    {
+      title: "Set up CI/CD pipeline",
+      description: "Configure GitHub Actions for automated testing",
+      status: "pending" as const,
+    },
+    {
+      title: "Add error monitoring",
+      description: "Integrate Sentry for error tracking",
+      status: "pending" as const,
+    },
+    {
+      title: "Optimize database queries",
+      description: "Add indexes and analyze slow queries",
+      status: "pending" as const,
+    },
+  ];
+
+  for (const taskData of tasks) {
+    const task = repo.create(taskData);
+    await repo.save(task);
+  }
+}
diff --git a/apps/dev-playground/tsdown.config.ts b/apps/dev-playground/tsdown.config.ts
new file mode 100644
index 00000000..42ec8e8a
--- /dev/null
+++ b/apps/dev-playground/tsdown.config.ts
@@ -0,0 +1,15 @@
+import { defineConfig } from "tsdown";
+
+export default defineConfig([
+  {
+    name: "dev-playground",
+    entry: "server/index.ts",
+    outDir: "build",
+    format: "esm",
+    platform: "node",
+    minify: false,
+    sourcemap: false,
+    clean: false,
+    tsconfig: "./tsconfig.json", // Explicitly reference tsconfig with decorator settings
+  },
+]);
diff --git a/tools/playground/prepared-files/root-tsconfig.json b/tools/playground/prepared-files/root-tsconfig.json
index 8ccab043..0af6d48f 100644
--- a/tools/playground/prepared-files/root-tsconfig.json
+++ b/tools/playground/prepared-files/root-tsconfig.json
@@ -1,7 +1,11 @@
 {
   "compilerOptions": {
     "baseUrl": ".",
-    "outDir": "./build"
+    "outDir": "./build",
+    "experimentalDecorators": true,
+    "emitDecoratorMetadata": true,
+    "target": "ES2022",
+    "module": "ESNext"
   },
   "exclude": ["node_modules", "build"]
 }
diff --git a/tsconfig.json b/tsconfig.json
index 1da2d8e9..683e557d 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -6,6 +6,8 @@
     "moduleResolution": "bundler",
     "strict": true,
     "esModuleInterop": true,
+    "experimentalDecorators": true,
+    "emitDecoratorMetadata": true,
     "declaration": true,
     "declarationMap": true,
     "sourceMap": false,

From c18e462b28d1ae8beabbdedde1afe5ed37e6064c Mon Sep 17 00:00:00 2001
From: Pawel Kosiec <pawel.kosiec@databricks.com>
Date: Wed, 11 Feb 2026 09:55:28 +0100
Subject: [PATCH 2/3] chore: remove unused obo from the example

---
 .../src/components/lakebase/ProductsPanel.tsx |  26 --
 .../lakebase-examples/raw-driver-example.ts   |  75 +--
 pnpm-lock.yaml                                | 430 ++++++++++++++++++
 3 files changed, 442 insertions(+), 89 deletions(-)

diff --git a/apps/dev-playground/client/src/components/lakebase/ProductsPanel.tsx b/apps/dev-playground/client/src/components/lakebase/ProductsPanel.tsx
index 69b9402b..d1b6c690 100644
--- a/apps/dev-playground/client/src/components/lakebase/ProductsPanel.tsx
+++ b/apps/dev-playground/client/src/components/lakebase/ProductsPanel.tsx
@@ -6,7 +6,6 @@ import {
   CardDescription,
   CardHeader,
   CardTitle,
-  Checkbox,
   Input,
 } from "@databricks/appkit-ui/react";
 import { Database, Loader2, Package } from "lucide-react";
@@ -28,7 +27,6 @@ interface CreateProductRequest {
   category: string;
   price: number;
   stock: number;
-  useObo?: boolean;
 }
 
 interface HealthStatus {
@@ -42,7 +40,6 @@ export function ProductsPanel() {
   const categoryId = useId();
   const priceId = useId();
   const stockId = useId();
-  const oboCheckboxId = useId();
 
   const {
     data: products,
@@ -84,7 +81,6 @@ export function ProductsPanel() {
   };
 
   const [formData, setFormData] = useState(generateRandomProduct());
-  const [useObo, setUseObo] = useState(false);
 
   const handleSubmit = async (e: React.FormEvent) => {
     e.preventDefault();
@@ -93,7 +89,6 @@ export function ProductsPanel() {
       category: formData.category,
       price: Number(formData.price),
       stock: Number(formData.stock),
-      useObo,
     });
 
     if (result) {
@@ -215,21 +210,6 @@ export function ProductsPanel() {
                 />
               </div>
             </div>
-            <div className="flex items-center space-x-2 pt-2">
-              <Checkbox
-                id={oboCheckboxId}
-                checked={useObo}
-                onCheckedChange={(checked) => setUseObo(checked === true)}
-                disabled
-              />
-              <label
-                htmlFor={oboCheckboxId}
-                className="text-sm font-medium leading-none cursor-not-allowed opacity-70"
-                title="OBO authorization is not yet available for Lakebase (postgres scope not supported by the platform)"
-              >
-                Use on-behalf-of-user authorization (coming soon)
-              </label>
-            </div>
             <Button type="submit" disabled={creating} className="w-full">
               {creating ? (
                 <>
@@ -296,9 +276,6 @@ export function ProductsPanel() {
                     <th className="text-right py-2 px-4 text-sm font-medium text-muted-foreground">
                       Stock
                     </th>
-                    <th className="text-left py-2 px-4 text-sm font-medium text-muted-foreground">
-                      Created By
-                    </th>
                   </tr>
                 </thead>
                 <tbody>
@@ -315,9 +292,6 @@ export function ProductsPanel() {
                       <td className="py-3 px-4 text-sm text-right">
                         {product.stock}
                       </td>
-                      <td className="py-3 px-4 text-sm font-mono text-xs truncate max-w-[200px]">
-                        {product.created_by || "unknown"}
-                      </td>
                     </tr>
                   ))}
                 </tbody>
diff --git a/apps/dev-playground/server/lakebase-examples/raw-driver-example.ts b/apps/dev-playground/server/lakebase-examples/raw-driver-example.ts
index 5a3b9eba..66d2ecb7 100644
--- a/apps/dev-playground/server/lakebase-examples/raw-driver-example.ts
+++ b/apps/dev-playground/server/lakebase-examples/raw-driver-example.ts
@@ -1,4 +1,4 @@
-import { createLakebasePool, getOboConnection } from "@databricks/appkit";
+import { createLakebasePool } from "@databricks/appkit";
 import type { Pool } from "pg";
 import type { IAppRouter } from "shared";
 
@@ -13,7 +13,6 @@ let pool: Pool;
  * - Schema and table creation (idempotent)
  * - Basic CRUD operations
  * - Connection health checking
- * - On-behalf-of-user (OBO) authentication for user-specific operations
  */
 
 interface Product {
@@ -33,14 +32,13 @@ export async function setup() {
   // Create schema and table (idempotent)
   await pool.query(`
     CREATE SCHEMA IF NOT EXISTS raw_example;
-    
+
     CREATE TABLE IF NOT EXISTS raw_example.products (
       id SERIAL PRIMARY KEY,
       name VARCHAR(255) NOT NULL,
       category VARCHAR(100),
       price DECIMAL(10, 2),
       stock INTEGER DEFAULT 0,
-      created_by VARCHAR(255),
       created_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP
     );
   `);
@@ -74,54 +72,14 @@ export function registerRoutes(router: IAppRouter, basePath: string) {
   // POST /api/lakebase-examples/raw/products - Create new product
   router.post(`${basePath}/products`, async (req, res) => {
     try {
-      const { name, category, price, stock, useObo } = req.body;
-
-      if (useObo) {
-        // User authorization path - execute as visiting user
-        const userToken = req.headers["x-forwarded-access-token"];
-        if (!userToken) {
-          return res.status(401).json({
-            error:
-              "User authorization requires x-forwarded-access-token header",
-          });
-        }
-
-        // Extract user email from Databricks Apps headers
-        const userEmail =
-          (req.headers["x-forwarded-email"] as string) ||
-          (req.headers["x-forwarded-preferred-username"] as string) ||
-          "unknown-user";
-
-        // Create OBO connection using user's token
-        const client = await getOboConnection({
-          userAccessToken: userToken as string,
-          endpoint: process.env.LAKEBASE_ENDPOINT ?? "",
-          host: process.env.PGHOST ?? "",
-          database: process.env.PGDATABASE ?? "",
-        });
+      const { name, category, price, stock } = req.body;
 
-        try {
-          const result = await client.query<Product>(
-            `INSERT INTO raw_example.products (name, category, price, stock, created_by) 
-             VALUES ($1, $2, $3, $4, $5) RETURNING *`,
-            [name, category, Number(price), Number(stock), userEmail],
-          );
-          res.json(result.rows[0]);
-        } finally {
-          await client.end();
-        }
-      } else {
-        // App authorization path - execute as service principal
-        const servicePrincipal =
-          process.env.DATABRICKS_CLIENT_ID || "app-service-principal";
-
-        const result = await pool.query<Product>(
-          `INSERT INTO raw_example.products (name, category, price, stock, created_by) 
-           VALUES ($1, $2, $3, $4, $5) RETURNING *`,
-          [name, category, Number(price), Number(stock), servicePrincipal],
-        );
-        res.json(result.rows[0]);
-      }
+      const result = await pool.query<Product>(
+        `INSERT INTO raw_example.products (name, category, price, stock)
+           VALUES ($1, $2, $3, $4) RETURNING *`,
+        [name, category, Number(price), Number(stock)],
+      );
+      res.json(result.rows[0]);
     } catch (error: unknown) {
       const err = error as Error;
       res.status(500).json({
@@ -207,20 +165,11 @@ async function seedProducts(pool: Pool) {
     },
   ];
 
-  const servicePrincipal =
-    process.env.DATABRICKS_CLIENT_ID || "app-service-principal";
-
   for (const product of products) {
     await pool.query(
-      `INSERT INTO raw_example.products (name, category, price, stock, created_by) 
-       VALUES ($1, $2, $3, $4, $5)`,
-      [
-        product.name,
-        product.category,
-        product.price,
-        product.stock,
-        servicePrincipal,
-      ],
+      `INSERT INTO raw_example.products (name, category, price, stock)
+       VALUES ($1, $2, $3, $4)`,
+      [product.name, product.category, product.price, product.stock],
     );
   }
 }
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 6b774afd..525ee013 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -132,6 +132,18 @@ importers:
       '@databricks/appkit':
         specifier: workspace:*
         version: link:../../packages/appkit
+      drizzle-orm:
+        specifier: ^0.45.1
+        version: 0.45.1(@opentelemetry/api@1.9.0)(@types/pg@8.16.0)(pg@8.18.0)
+      reflect-metadata:
+        specifier: ^0.2.0
+        version: 0.2.2
+      sequelize:
+        specifier: ^6.37.7
+        version: 6.37.7(pg@8.18.0)
+      typeorm:
+        specifier: ^0.3.20
+        version: 0.3.28(pg@8.18.0)
       zod:
         specifier: ^4.1.13
         version: 4.1.13
@@ -4076,6 +4088,9 @@ packages:
   '@slorber/remark-comment@1.0.0':
     resolution: {integrity: sha512-RCE24n7jsOj1M0UPvIQCHTe7fI0sFL4S2nwKVWwHyVr/wI/H8GosgsJGyhnsZoGFnD/P2hLf1mSbrrgSLN93NA==}
 
+  '@sqltools/formatter@1.2.5':
+    resolution: {integrity: sha512-Uy0+khmZqUrUGm5dmMqVlnvufZRSK0FbYzVgp0UMstm+F5+W2/jnEEQyc9vo1ZR/E5ZI/B1WjjoTqBqwJL6Krw==}
+
   '@standard-schema/spec@1.1.0':
     resolution: {integrity: sha512-l2aFy5jALhniG5HgqrD6jXLi/rUWrKvqN/qJx6yoJsgKhblVd+iqqU4RCXavm/jPityDo5TCvKMnpjKnOriy0w==}
 
@@ -4664,6 +4679,9 @@ packages:
   '@types/unist@3.0.3':
     resolution: {integrity: sha512-ko/gIFJRv177XgZsZcBwnqJN5x/Gien8qNOn0D5bQU/zAzVf9Zt3BlcUiLqhV9y4ARk0GbT3tnUiPNgnTXzc/Q==}
 
+  '@types/validator@13.15.10':
+    resolution: {integrity: sha512-T8L6i7wCuyoK8A/ZeLYt1+q0ty3Zb9+qbSSvrIVitzT3YjZqkTZ40IbRsPanlB4h1QB3JVL1SYCdR6ngtFYcuA==}
+
   '@types/ws@8.18.1':
     resolution: {integrity: sha512-ThVF6DCVhA8kUGy+aazFQ4kXQ7E1Ty7A3ypFOe0IcJV8O/M511G99AW24irKrW56Wt44yG9+ij8FaqoBGkuBXg==}
 
@@ -4989,6 +5007,10 @@ packages:
   app-module-path@2.2.0:
     resolution: {integrity: sha512-gkco+qxENJV+8vFcDiiFhuoSvRXb2a/QPqpSoWhVz829VNJfOTnELbBmPmNKFxf3xdNnw4DWCkzkDaavcX/1YQ==}
 
+  app-root-path@3.1.0:
+    resolution: {integrity: sha512-biN3PwB2gUtjaYy/isrU3aNWI5w+fAfvHkSvCKeQGxhmYpwKFUxudR3Yya+KqVRHBmEDYh+/lTozYCFbmzX4nA==}
+    engines: {node: '>= 6.0.0'}
+
   aproba@2.1.0:
     resolution: {integrity: sha512-tLIEcj5GuR2RSTnxNKdkK0dJ/GrC7P38sUkiDmDuHfsHmbagTFAxDVIBltoklXEVIQ/f14IL8IMJ5pn9Hez1Ew==}
 
@@ -5063,6 +5085,10 @@ packages:
     peerDependencies:
       postcss: ^8.1.0
 
+  available-typed-arrays@1.0.7:
+    resolution: {integrity: sha512-wvUjBtSGN7+7SjNpq/9M2Tg350UZD3q62IFZLbRAR1bSMlCo1ZaeW+BJ+D090e4hIIZLBcTDWe4Mh4jvUDajzQ==}
+    engines: {node: '>= 0.4'}
+
   babel-loader@9.2.1:
     resolution: {integrity: sha512-fqe8naHt46e0yIdkjUZYqddSXfej3AHajX+CSO5X7oy0EmPc6o5Xh+RClNoHjnieWz9AW4kZxW9yyFMhVB1QLA==}
     engines: {node: '>= 14.15.0'}
@@ -5190,6 +5216,9 @@ packages:
   buffer@5.7.1:
     resolution: {integrity: sha512-EHcyIPBQ4BSGlvjB16k5KgAJ27CIsHY/2JBmCRReo48y9rQ3MaUzWX3KVlBa4U7MyX02HdVj0K7C3WaB3ju7FQ==}
 
+  buffer@6.0.3:
+    resolution: {integrity: sha512-FTiCpNxtwiZZHEZbcbTIcZjERVICn9yq/pDFkTl95/AxzD1naBctN7YO68riM/gLSDY7sdrMby8hofADYuuqOA==}
+
   bufferutil@4.0.9:
     resolution: {integrity: sha512-WDtdLmJvAuNNPzByAYpRo2rF1Mmradw6gvWsQKf63476DDXmomT9zUiGypLcG4ibIM67vhAj8jJRdbmEws2Aqw==}
     engines: {node: '>=6.14.2'}
@@ -6009,6 +6038,14 @@ packages:
     resolution: {integrity: sha512-aW35yZM6Bb/4oJlZncMH2LCoZtJXTRxES17vE3hoRiowU2kWHaJKFkSBDnDR+cm9J+9QhXmREyIfv0pji9ejCQ==}
     engines: {node: '>=10'}
 
+  dedent@1.7.1:
+    resolution: {integrity: sha512-9JmrhGZpOlEgOLdQgSm0zxFaYoQon408V1v49aqTWuXENVlnCuY9JBZcXZiCsZQWDjTm5Qf/nIvAy77mXDAjEg==}
+    peerDependencies:
+      babel-plugin-macros: ^3.1.0
+    peerDependenciesMeta:
+      babel-plugin-macros:
+        optional: true
+
   deep-eql@5.0.2:
     resolution: {integrity: sha512-h5k/5U50IJJFpzfL6nO9jaaumfjO/f2NjK/oYB2Djzm4p9L+3T9qWpZqZ2hAbLPuuYq9wrU08WQyBTL5GbPk5Q==}
     engines: {node: '>=6'}
@@ -6244,6 +6281,101 @@ packages:
     resolution: {integrity: sha512-JVUnt+DUIzu87TABbhPmNfVdBDt18BLOWjMUFJMSi/Qqg7NTYtabbvSNJGOJ7afbRuv9D/lngizHtP7QyLQ+9w==}
     engines: {node: '>=12'}
 
+  dottie@2.0.6:
+    resolution: {integrity: sha512-iGCHkfUc5kFekGiqhe8B/mdaurD+lakO9txNnTvKtA6PISrw86LgqHvRzWYPyoE2Ph5aMIrCw9/uko6XHTKCwA==}
+
+  drizzle-orm@0.45.1:
+    resolution: {integrity: sha512-Te0FOdKIistGNPMq2jscdqngBRfBpC8uMFVwqjf6gtTVJHIQ/dosgV/CLBU2N4ZJBsXL5savCba9b0YJskKdcA==}
+    peerDependencies:
+      '@aws-sdk/client-rds-data': '>=3'
+      '@cloudflare/workers-types': '>=4'
+      '@electric-sql/pglite': '>=0.2.0'
+      '@libsql/client': '>=0.10.0'
+      '@libsql/client-wasm': '>=0.10.0'
+      '@neondatabase/serverless': '>=0.10.0'
+      '@op-engineering/op-sqlite': '>=2'
+      '@opentelemetry/api': ^1.4.1
+      '@planetscale/database': '>=1.13'
+      '@prisma/client': '*'
+      '@tidbcloud/serverless': '*'
+      '@types/better-sqlite3': '*'
+      '@types/pg': '*'
+      '@types/sql.js': '*'
+      '@upstash/redis': '>=1.34.7'
+      '@vercel/postgres': '>=0.8.0'
+      '@xata.io/client': '*'
+      better-sqlite3: '>=7'
+      bun-types: '*'
+      expo-sqlite: '>=14.0.0'
+      gel: '>=2'
+      knex: '*'
+      kysely: '*'
+      mysql2: '>=2'
+      pg: '>=8'
+      postgres: '>=3'
+      prisma: '*'
+      sql.js: '>=1'
+      sqlite3: '>=5'
+    peerDependenciesMeta:
+      '@aws-sdk/client-rds-data':
+        optional: true
+      '@cloudflare/workers-types':
+        optional: true
+      '@electric-sql/pglite':
+        optional: true
+      '@libsql/client':
+        optional: true
+      '@libsql/client-wasm':
+        optional: true
+      '@neondatabase/serverless':
+        optional: true
+      '@op-engineering/op-sqlite':
+        optional: true
+      '@opentelemetry/api':
+        optional: true
+      '@planetscale/database':
+        optional: true
+      '@prisma/client':
+        optional: true
+      '@tidbcloud/serverless':
+        optional: true
+      '@types/better-sqlite3':
+        optional: true
+      '@types/pg':
+        optional: true
+      '@types/sql.js':
+        optional: true
+      '@upstash/redis':
+        optional: true
+      '@vercel/postgres':
+        optional: true
+      '@xata.io/client':
+        optional: true
+      better-sqlite3:
+        optional: true
+      bun-types:
+        optional: true
+      expo-sqlite:
+        optional: true
+      gel:
+        optional: true
+      knex:
+        optional: true
+      kysely:
+        optional: true
+      mysql2:
+        optional: true
+      pg:
+        optional: true
+      postgres:
+        optional: true
+      prisma:
+        optional: true
+      sql.js:
+        optional: true
+      sqlite3:
+        optional: true
+
   dts-resolver@2.1.2:
     resolution: {integrity: sha512-xeXHBQkn2ISSXxbJWD828PFjtyg+/UrMDo7W4Ffcs7+YWCquxU8YjV1KoxuiL+eJ5pg3ll+bC6flVv61L3LKZg==}
     engines: {node: '>=20.18.0'}
@@ -6701,6 +6833,10 @@ packages:
       debug:
         optional: true
 
+  for-each@0.3.5:
+    resolution: {integrity: sha512-dKx12eRCVIzqCxFGplyFKJMPvLEWgmNtUrpTiJIR5u97zEhRG8ySrtboPHZXx7daLxQVrl643cTzbab2tkQjxg==}
+    engines: {node: '>= 0.4'}
+
   for-in@1.0.2:
     resolution: {integrity: sha512-7EwmXrOjyL+ChxMhmG5lnW9MPt1aIeZEwKhQzoBUdTV0N3zuwWDZYVJatDvZ2OyzPUvdIAZDsCetk3coyMfcnQ==}
     engines: {node: '>=0.10.0'}
@@ -6975,6 +7111,10 @@ packages:
     resolution: {integrity: sha512-1cDNdwJ2Jaohmb3sg4OmKaMBwuC48sYni5HUw2DvsC8LjGTLK9h+eb1X6RyuOHe4hT0ULCW68iomhjUoKUqlPQ==}
     engines: {node: '>= 0.4'}
 
+  has-tostringtag@1.0.2:
+    resolution: {integrity: sha512-NqADB8VjPFLM2V0VvHUewwwsw0ZWBaIdgo+ieHtK3hasLz4qeCRjYcqfB6AQrBggRKppKF8L52/VqdVsO47Dlw==}
+    engines: {node: '>= 0.4'}
+
   has-unicode@2.0.1:
     resolution: {integrity: sha512-8Rf9Y83NBReMnx0gFzA8JImQACstCYWUplepDa9xprwwtmgEZUF0h/i5xSA625zB/I37EtrswSST6OXxwaaIJQ==}
 
@@ -7275,6 +7415,10 @@ packages:
     resolution: {integrity: sha512-uyH0zfr1erU1OohLk0fT4Rrb94AOhguWNOcD9uGrSpRvNB+6gZXUoJX5J0NtvzBO10YZ9PgvA4NFgt+fYg8ojw==}
     engines: {node: '>=12'}
 
+  inflection@1.13.4:
+    resolution: {integrity: sha512-6I/HUDeYFfuNCVS3td055BaXBwKYuzw7K3ExVMStBowKo9oOAMJIXIHvdyR3iboTCp1b+1i5DSkIZTcwIktuDw==}
+    engines: {'0': node >= 0.4.0}
+
   inflight@1.0.6:
     resolution: {integrity: sha512-k92I/b08q4wvFscXCLvqfsHCrjrF7yiXsQuIVvVE7N82W3+aqpzuUdBbfhWcy/FZR3/4IgflMgKLOsvPDrGCJA==}
     deprecated: This module is not supported, and leaks memory. Do not use it. Check out lru-cache if you want a good and tested way to coalesce async requests by a key value, which is much more comprehensive and powerful.
@@ -7369,6 +7513,10 @@ packages:
     resolution: {integrity: sha512-i2R6zNFDwgEHJyQUtJEk0XFi1i0dPFn/oqjK3/vPCcDeJvW5NQ83V8QbicfF1SupOaB0h8ntgBC2YiE7dfyctQ==}
     engines: {node: '>=4'}
 
+  is-callable@1.2.7:
+    resolution: {integrity: sha512-1BC0BVFhS/p0qtw6enp8e+8OD0UrK0oFLztSjNzhcKA3WDuJxxAPXzPuPtKkjEY9UUoEWlX/8fgKeu2S8i9JTA==}
+    engines: {node: '>= 0.4'}
+
   is-ci@3.0.1:
     resolution: {integrity: sha512-ZYvCgrefwqoQ6yTyYUbQu64HsITZ3NfKX1lzaEYdkTDcfKzzCI/wthRRYKkdjHKFVgNiXKAKm65Zo1pk2as/QQ==}
     hasBin: true
@@ -7504,6 +7652,10 @@ packages:
     resolution: {integrity: sha512-+oDTluR6WEjdXEJMnC2z6A4FRwFoYuvShVVEGsS7ewc0UTi2QtAKMDJuL4BDEVt+5T7MjFo12RP8ghOM75oKJw==}
     engines: {node: '>=8'}
 
+  is-typed-array@1.1.15:
+    resolution: {integrity: sha512-p3EcsicXjit7SaskXHs1hA91QxgTw46Fv6EFKKGS5DRFLD8yKnohjF3hxoju94b/OcMZoQukzpPpBE9uLVKzgQ==}
+    engines: {node: '>= 0.4'}
+
   is-typedarray@1.0.0:
     resolution: {integrity: sha512-cyA56iCMHAh5CdzjJIa4aohJyeO1YbwLi3Jc35MmRU6poroFjIGZzUzupGiRPOjgHg9TLu43xbpwXk523fMxKA==}
 
@@ -7548,6 +7700,9 @@ packages:
   isarray@1.0.0:
     resolution: {integrity: sha512-VLghIWNM6ELQzo7zwmcg0NmTVyWKYjvIeM83yjp0wRDTmUnrM678fQbcKBo6n2CJEF0szoG//ytg+TKla89ALQ==}
 
+  isarray@2.0.5:
+    resolution: {integrity: sha512-xHjhDr3cNBK0BzdUJSPXZntQUx/mwMS5Rw4A7lPJ90XGAO6ISP/ePDNuo0vhqOZU+UD5JoodwCAAoZQd3FeAKw==}
+
   isbinaryfile@5.0.6:
     resolution: {integrity: sha512-I+NmIfBHUl+r2wcDd6JwE9yWje/PIVY/R5/CmV8dXLZd5K+L9X2klAOwfAHNnondLXkbHyTAleQAWonpTJBTtw==}
     engines: {node: '>= 18.0.0'}
@@ -8311,6 +8466,12 @@ packages:
     engines: {node: '>=18'}
     hasBin: true
 
+  moment-timezone@0.5.48:
+    resolution: {integrity: sha512-f22b8LV1gbTO2ms2j2z13MuPogNoh5UzxL3nzNAYKGraILnbGc9NEE6dyiiiLv46DGRb8A4kg8UKWLjPthxBHw==}
+
+  moment@2.30.1:
+    resolution: {integrity: sha512-uEmtNhbDOrWPFS+hdjFCBfy9f2YoyzRpwcl+DqpC6taX21FzsTLQVbMV/W7PzNSX6x/bhC1zA3c2UQ5NzH6how==}
+
   mri@1.2.0:
     resolution: {integrity: sha512-tzzskb3bG8LvYGFF/mDTpq3jpI6Q9wc3LEmBaghu+DdCssd1FakN7Bc0hVNmEyGq1bq3RgfkCb3cmQLpNPOroA==}
     engines: {node: '>=4'}
@@ -8806,6 +8967,10 @@ packages:
   points-on-path@0.2.1:
     resolution: {integrity: sha512-25ClnWWuw7JbWZcgqY/gJ4FQWadKxGWk+3kR/7kD0tCaDtPPMj7oHu2ToLaVhfpnHrZzYby2w6tUA0eOIuUg8g==}
 
+  possible-typed-array-names@1.1.0:
+    resolution: {integrity: sha512-/+5VFTchJDoVj3bhoqi6UeymcD00DAwb1nJwamzPvHEszJ4FpF6SNNbUbOS8yI56qHzdV8eK0qEfOSiodkTdxg==}
+    engines: {node: '>= 0.4'}
+
   postcss-attribute-case-insensitive@7.0.1:
     resolution: {integrity: sha512-Uai+SupNSqzlschRyNx3kbCTWgY/2hcwtHEI/ej2LJWc9JJ77qKgGptd8DHwY1mXtZ7Aoh4z4yxfwMBue9eNgw==}
     engines: {node: '>=18'}
@@ -9668,6 +9833,9 @@ packages:
     resolution: {integrity: sha512-oMA2dcrw6u0YfxJQXm342bFKX/E4sG9rbTzO9ptUcR/e8A33cHuvStiYOwH7fszkZlZ1z/ta9AAoPk2F4qIOHA==}
     engines: {node: '>=18'}
 
+  retry-as-promised@7.1.1:
+    resolution: {integrity: sha512-hMD7odLOt3LkTjcif8aRZqi/hybjpLNgSk5oF5FCowfCjok6LukpN2bDX7R5wDmbgBQFn7YoBxSagmtXHaJYJw==}
+
   retry@0.13.1:
     resolution: {integrity: sha512-XQBQ3I8W1Cge0Seh+6gjj03LbmRFWuoszgK9ooCpwYIrhhoO80pfq4cUkU5DkknwfOfFteRwlZ56PYOGYyFWdg==}
     engines: {node: '>= 4'}
@@ -9866,6 +10034,43 @@ packages:
     resolution: {integrity: sha512-p4rRk4f23ynFEfcD9LA0xRYngj+IyGiEYyqqOak8kaN0TvNmuxC2dcVeBn62GpCeR2CpWqyHCNScTP91QbAVFg==}
     engines: {node: '>= 0.8.0'}
 
+  sequelize-pool@7.1.0:
+    resolution: {integrity: sha512-G9c0qlIWQSK29pR/5U2JF5dDQeqqHRragoyahj/Nx4KOOQ3CPPfzxnfqFPCSB7x5UgjOgnZ61nSxz+fjDpRlJg==}
+    engines: {node: '>= 10.0.0'}
+
+  sequelize@6.37.7:
+    resolution: {integrity: sha512-mCnh83zuz7kQxxJirtFD7q6Huy6liPanI67BSlbzSYgVNl5eXVdE2CN1FuAeZwG1SNpGsNRCV+bJAVVnykZAFA==}
+    engines: {node: '>=10.0.0'}
+    peerDependencies:
+      ibm_db: '*'
+      mariadb: '*'
+      mysql2: '*'
+      oracledb: '*'
+      pg: '*'
+      pg-hstore: '*'
+      snowflake-sdk: '*'
+      sqlite3: '*'
+      tedious: '*'
+    peerDependenciesMeta:
+      ibm_db:
+        optional: true
+      mariadb:
+        optional: true
+      mysql2:
+        optional: true
+      oracledb:
+        optional: true
+      pg:
+        optional: true
+      pg-hstore:
+        optional: true
+      snowflake-sdk:
+        optional: true
+      sqlite3:
+        optional: true
+      tedious:
+        optional: true
+
   serialize-javascript@6.0.2:
     resolution: {integrity: sha512-Saa1xPByTTq2gdeFZYLLo+RFE35NHZkAbqZeWNd3BpzppeVisAqpDjcp8dyf6uIvEqJRd46jemmyA4iFIeVk8g==}
 
@@ -9890,6 +10095,11 @@ packages:
   setprototypeof@1.2.0:
     resolution: {integrity: sha512-E5LDX7Wrp85Kil5bhZv46j8jOeboKq5JMmYM3gVGdGH8xFpPWXUMsNrlODCrkoxMEeNi/XZIwuRvY4XNwYMJpw==}
 
+  sha.js@2.4.12:
+    resolution: {integrity: sha512-8LzC5+bvI45BjpfXU8V5fdU2mfeKiQe1D1gIMn7XUlF3OTUrpdJpPPH4EMAnF0DsHHdSZqCdSss5qCmJKuiO3w==}
+    engines: {node: '>= 0.10'}
+    hasBin: true
+
   shallow-clone@3.0.1:
     resolution: {integrity: sha512-/6KqX+GVUdqPuPPd2LxDDxzX6CAbjJehAAOKlNpqqUpAqPM6HeL8f+o3a+JsyGjn2lv0WY8UsTgUJjU9Ok55NA==}
     engines: {node: '>=8'}
@@ -10045,6 +10255,10 @@ packages:
   sprintf-js@1.0.3:
     resolution: {integrity: sha512-D9cPgkvLlV3t3IzL0D0YLvGA9Ahk4PcvVwUbN0dSGr1aP0Nrt4AEnTUbuGvquEC0mA64Gqt1fzirlRs5ibXx8g==}
 
+  sql-highlight@6.1.0:
+    resolution: {integrity: sha512-ed7OK4e9ywpE7pgRMkMQmZDPKSVdm0oX5IEtZiKnFucSF0zu6c80GZBe38UqHuVhTWJ9xsKgSMjCG2bml86KvA==}
+    engines: {node: '>=14'}
+
   srcset@4.0.0:
     resolution: {integrity: sha512-wvLeHgcVHKO8Sc/H/5lkGreJQVeYMm9rlmt8PuR1xE31rIuXhuzznUUqAt8MqLhB3MqJdFzlNAfpcWnxiFUcPw==}
     engines: {node: '>=12'}
@@ -10295,6 +10509,10 @@ packages:
     resolution: {integrity: sha512-Y1KQBgDd/NUc+LfOtKS6mNsC9CCaH+m2P1RoIZy7RAPo3C3/t8X45+zgut31cRZtZ3xKPjfn3TkGTrctC2TQIQ==}
     hasBin: true
 
+  to-buffer@1.2.2:
+    resolution: {integrity: sha512-db0E3UJjcFhpDhAF4tLo03oli3pwl3dbnzXOUIlRKrp+ldk/VUxzpWYZENsw2SZiuBjHAk7DfB0VU7NKdpb6sw==}
+    engines: {node: '>= 0.4'}
+
   to-regex-range@5.0.1:
     resolution: {integrity: sha512-65P7iz6X5yEr1cwcgvQxbbIw7Uk3gOy5dIdtZ4rDveLqhrdJP+Li/Hx6tyK0NEb+2GCyneCMJiGqrADCSNk8sQ==}
     engines: {node: '>=8.0'}
@@ -10306,6 +10524,9 @@ packages:
     resolution: {integrity: sha512-o5sSPKEkg/DIQNmH43V0/uerLrpzVedkUh8tGNvaeXpfpuwjKenlSox/2O/BTlZUtEe+JG7s5YhEz608PlAHRA==}
     engines: {node: '>=0.6'}
 
+  toposort-class@1.0.1:
+    resolution: {integrity: sha512-OsLcGGbYF3rMjPUf8oKktyvCiUxSbqMMS39m33MAjLTC1DVIH6x3WSt63/M77ihI09+Sdfk1AXvfhCEeUmC7mg==}
+
   totalist@3.0.1:
     resolution: {integrity: sha512-sf4i37nQ2LBx4m3wB74y+ubopq6W/dIzXg0FDGjsYnZHVa1Da8FH853wlL2gtUhg+xJXjfk3kUZS3BRoQeoQBQ==}
     engines: {node: '>=6'}
@@ -10457,6 +10678,10 @@ packages:
     resolution: {integrity: sha512-TkRKr9sUTxEH8MdfuCSP7VizJyzRNMjj2J2do2Jr3Kym598JVdEksuzPQCnlFPW4ky9Q+iA+ma9BGm06XQBy8g==}
     engines: {node: '>= 0.6'}
 
+  typed-array-buffer@1.0.3:
+    resolution: {integrity: sha512-nAYYwfY3qnzX30IkA6AQZjVbtK6duGontcQm1WSG1MD94YLqK0515GNApXkoxKOWMusVssAHWLh9SeaoefYFGw==}
+    engines: {node: '>= 0.4'}
+
   typedarray-to-buffer@3.1.5:
     resolution: {integrity: sha512-zdu8XMNEDepKKR+XYOXAVPtWui0ly0NtohUscw+UmaHiAWT8hrV1rr//H6V+0DvJ3OQ19S979M0laLfX8rm82Q==}
 
@@ -10481,6 +10706,61 @@ packages:
     peerDependencies:
       typescript: 5.0.x || 5.1.x || 5.2.x || 5.3.x || 5.4.x || 5.5.x || 5.6.x || 5.7.x || 5.8.x || 5.9.x
 
+  typeorm@0.3.28:
+    resolution: {integrity: sha512-6GH7wXhtfq2D33ZuRXYwIsl/qM5685WZcODZb7noOOcRMteM9KF2x2ap3H0EBjnSV0VO4gNAfJT5Ukp0PkOlvg==}
+    engines: {node: '>=16.13.0'}
+    hasBin: true
+    peerDependencies:
+      '@google-cloud/spanner': ^5.18.0 || ^6.0.0 || ^7.0.0 || ^8.0.0
+      '@sap/hana-client': ^2.14.22
+      better-sqlite3: ^8.0.0 || ^9.0.0 || ^10.0.0 || ^11.0.0 || ^12.0.0
+      ioredis: ^5.0.4
+      mongodb: ^5.8.0 || ^6.0.0
+      mssql: ^9.1.1 || ^10.0.0 || ^11.0.0 || ^12.0.0
+      mysql2: ^2.2.5 || ^3.0.1
+      oracledb: ^6.3.0
+      pg: ^8.5.1
+      pg-native: ^3.0.0
+      pg-query-stream: ^4.0.0
+      redis: ^3.1.1 || ^4.0.0 || ^5.0.14
+      sql.js: ^1.4.0
+      sqlite3: ^5.0.3
+      ts-node: ^10.7.0
+      typeorm-aurora-data-api-driver: ^2.0.0 || ^3.0.0
+    peerDependenciesMeta:
+      '@google-cloud/spanner':
+        optional: true
+      '@sap/hana-client':
+        optional: true
+      better-sqlite3:
+        optional: true
+      ioredis:
+        optional: true
+      mongodb:
+        optional: true
+      mssql:
+        optional: true
+      mysql2:
+        optional: true
+      oracledb:
+        optional: true
+      pg:
+        optional: true
+      pg-native:
+        optional: true
+      pg-query-stream:
+        optional: true
+      redis:
+        optional: true
+      sql.js:
+        optional: true
+      sqlite3:
+        optional: true
+      ts-node:
+        optional: true
+      typeorm-aurora-data-api-driver:
+        optional: true
+
   typescript-eslint@8.49.0:
     resolution: {integrity: sha512-zRSVH1WXD0uXczCXw+nsdjGPUdx4dfrs5VQoHnUWmv1U3oNlAKv4FUNdLDhVUg+gYn+a5hUESqch//Rv5wVhrg==}
     engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
@@ -10705,6 +10985,10 @@ packages:
   validate-npm-package-license@3.0.4:
     resolution: {integrity: sha512-DpKm2Ui/xN7/HQKCtpZxoRWBhZ9Z0kqtygG8XCgNQ8ZlDnxuQmWhj566j8fN4Cu3/JmbhsDo7fcAJq4s9h27Ew==}
 
+  validator@13.15.26:
+    resolution: {integrity: sha512-spH26xU080ydGggxRyR1Yhcbgx+j3y5jbNXk/8L+iRvdIEQ4uTRH2Sgf2dokud6Q4oAtsbNvJ1Ft+9xmm6IZcA==}
+    engines: {node: '>= 0.10'}
+
   value-equal@1.0.1:
     resolution: {integrity: sha512-NOJ6JZCAWr0zlxZt+xqCHNTEKOsrks2HQd4MqhP1qy4z1SkbEP467eNx6TgDKXMvUOb+OENfJCZwM+16n7fRfw==}
 
@@ -10954,6 +11238,10 @@ packages:
   whatwg-url@5.0.0:
     resolution: {integrity: sha512-saE57nupxk6v3HY35+jzBwYa0rKSy0XR8JSxZPwgLr7ys0IBzhGviA1/TUGJLmSVqs8pb9AnvICXEuOHLprYTw==}
 
+  which-typed-array@1.1.20:
+    resolution: {integrity: sha512-LYfpUkmqwl0h9A2HL09Mms427Q1RZWuOHsukfVcKRq9q95iQxdw0ix1JQrqbcDR9PH1QDwf5Qo8OZb5lksZ8Xg==}
+    engines: {node: '>= 0.4'}
+
   which@1.3.1:
     resolution: {integrity: sha512-HxJdYWq1MTIQbJ3nw0cqssHoTNU267KlrDuGZ1WYlxDStUtKUhOaJmh112/TZmHxxUfuJqPXSOm7tDyas0OSIQ==}
     hasBin: true
@@ -10985,6 +11273,9 @@ packages:
     resolution: {integrity: sha512-1lOb3qdzw6OFmOzoY0nauhLG72TpWtb5qgYPiSh/62rjc1XidBSDio2qw0pwHh17VINF217ebIkZJdFLZFn9SA==}
     engines: {node: '>=18'}
 
+  wkx@0.5.0:
+    resolution: {integrity: sha512-Xng/d4Ichh8uN4l0FToV/258EjMGU9MGcA0HV2d9B/ZpZB3lqQm7nkOdZdm5GhKtLLhAE7PiVQwN4eN+2YJJUg==}
+
   word-wrap@1.2.5:
     resolution: {integrity: sha512-BN22B5eaMMI9UMtjrGd5g5eCYPpCPDUy0FJXbYsaT5zYxjFOckS53SQDE3pWkVoWpHXVb3BrYcEN4Twa55B5cA==}
     engines: {node: '>=0.10.0'}
@@ -15688,6 +15979,8 @@ snapshots:
       micromark-util-character: 1.2.0
       micromark-util-symbol: 1.1.0
 
+  '@sqltools/formatter@1.2.5': {}
+
   '@standard-schema/spec@1.1.0': {}
 
   '@standard-schema/utils@0.3.0': {}
@@ -16351,6 +16644,8 @@ snapshots:
 
   '@types/unist@3.0.3': {}
 
+  '@types/validator@13.15.10': {}
+
   '@types/ws@8.18.1':
     dependencies:
       '@types/node': 24.10.1
@@ -16819,6 +17114,8 @@ snapshots:
 
   app-module-path@2.2.0: {}
 
+  app-root-path@3.1.0: {}
+
   aproba@2.1.0: {}
 
   arg@5.0.2: {}
@@ -16881,6 +17178,10 @@ snapshots:
       postcss: 8.5.6
       postcss-value-parser: 4.2.0
 
+  available-typed-arrays@1.0.7:
+    dependencies:
+      possible-typed-array-names: 1.1.0
+
   babel-loader@9.2.1(@babel/core@7.28.5)(webpack@5.103.0):
     dependencies:
       '@babel/core': 7.28.5
@@ -17040,6 +17341,11 @@ snapshots:
       base64-js: 1.5.1
       ieee754: 1.2.1
 
+  buffer@6.0.3:
+    dependencies:
+      base64-js: 1.5.1
+      ieee754: 1.2.1
+
   bufferutil@4.0.9:
     dependencies:
       node-gyp-build: 4.8.4
@@ -17908,6 +18214,8 @@ snapshots:
     dependencies:
       mimic-response: 3.1.0
 
+  dedent@1.7.1: {}
+
   deep-eql@5.0.2: {}
 
   deep-extend@0.6.0: {}
@@ -18158,6 +18466,14 @@ snapshots:
 
   dotenv@17.2.3: {}
 
+  dottie@2.0.6: {}
+
+  drizzle-orm@0.45.1(@opentelemetry/api@1.9.0)(@types/pg@8.16.0)(pg@8.18.0):
+    optionalDependencies:
+      '@opentelemetry/api': 1.9.0
+      '@types/pg': 8.16.0
+      pg: 8.18.0
+
   dts-resolver@2.1.2: {}
 
   dunder-proto@1.0.1:
@@ -18684,6 +19000,10 @@ snapshots:
 
   follow-redirects@1.15.11: {}
 
+  for-each@0.3.5:
+    dependencies:
+      is-callable: 1.2.7
+
   for-in@1.0.2: {}
 
   for-own@1.0.0:
@@ -19016,6 +19336,10 @@ snapshots:
 
   has-symbols@1.1.0: {}
 
+  has-tostringtag@1.0.2:
+    dependencies:
+      has-symbols: 1.1.0
+
   has-unicode@2.0.1: {}
 
   has-yarn@3.0.0: {}
@@ -19491,6 +19815,8 @@ snapshots:
 
   infima@0.2.0-alpha.45: {}
 
+  inflection@1.13.4: {}
+
   inflight@1.0.6:
     dependencies:
       once: 1.4.0
@@ -19580,6 +19906,8 @@ snapshots:
 
   is-buffer@2.0.5: {}
 
+  is-callable@1.2.7: {}
+
   is-ci@3.0.1:
     dependencies:
       ci-info: 3.9.0
@@ -19669,6 +19997,10 @@ snapshots:
     dependencies:
       text-extensions: 2.4.0
 
+  is-typed-array@1.1.15:
+    dependencies:
+      which-typed-array: 1.1.20
+
   is-typedarray@1.0.0: {}
 
   is-unc-path@1.0.0:
@@ -19699,6 +20031,8 @@ snapshots:
 
   isarray@1.0.0: {}
 
+  isarray@2.0.5: {}
+
   isbinaryfile@5.0.6: {}
 
   isexe@2.0.0: {}
@@ -20765,6 +21099,12 @@ snapshots:
       requirejs: 2.3.8
       requirejs-config-file: 4.0.0
 
+  moment-timezone@0.5.48:
+    dependencies:
+      moment: 2.30.1
+
+  moment@2.30.1: {}
+
   mri@1.2.0: {}
 
   mrmime@2.0.1: {}
@@ -21275,6 +21615,8 @@ snapshots:
       path-data-parser: 0.1.0
       points-on-curve: 0.2.0
 
+  possible-typed-array-names@1.1.0: {}
+
   postcss-attribute-case-insensitive@7.0.1(postcss@8.5.6):
     dependencies:
       postcss: 8.5.6
@@ -22320,6 +22662,8 @@ snapshots:
       onetime: 7.0.0
       signal-exit: 4.1.0
 
+  retry-as-promised@7.1.1: {}
+
   retry@0.13.1: {}
 
   reusify@1.1.0: {}
@@ -22582,6 +22926,31 @@ snapshots:
     transitivePeerDependencies:
       - supports-color
 
+  sequelize-pool@7.1.0: {}
+
+  sequelize@6.37.7(pg@8.18.0):
+    dependencies:
+      '@types/debug': 4.1.12
+      '@types/validator': 13.15.10
+      debug: 4.4.3
+      dottie: 2.0.6
+      inflection: 1.13.4
+      lodash: 4.17.21
+      moment: 2.30.1
+      moment-timezone: 0.5.48
+      pg-connection-string: 2.11.0
+      retry-as-promised: 7.1.1
+      semver: 7.7.3
+      sequelize-pool: 7.1.0
+      toposort-class: 1.0.1
+      uuid: 8.3.2
+      validator: 13.15.26
+      wkx: 0.5.0
+    optionalDependencies:
+      pg: 8.18.0
+    transitivePeerDependencies:
+      - supports-color
+
   serialize-javascript@6.0.2:
     dependencies:
       randombytes: 2.1.0
@@ -22630,6 +22999,12 @@ snapshots:
 
   setprototypeof@1.2.0: {}
 
+  sha.js@2.4.12:
+    dependencies:
+      inherits: 2.0.4
+      safe-buffer: 5.2.1
+      to-buffer: 1.2.2
+
   shallow-clone@3.0.1:
     dependencies:
       kind-of: 6.0.3
@@ -22800,6 +23175,8 @@ snapshots:
 
   sprintf-js@1.0.3: {}
 
+  sql-highlight@6.1.0: {}
+
   srcset@4.0.0: {}
 
   stackback@0.0.2: {}
@@ -23012,6 +23389,12 @@ snapshots:
     dependencies:
       tldts-core: 7.0.17
 
+  to-buffer@1.2.2:
+    dependencies:
+      isarray: 2.0.5
+      safe-buffer: 5.2.1
+      typed-array-buffer: 1.0.3
+
   to-regex-range@5.0.1:
     dependencies:
       is-number: 7.0.0
@@ -23023,6 +23406,8 @@ snapshots:
 
   toidentifier@1.0.1: {}
 
+  toposort-class@1.0.1: {}
+
   totalist@3.0.1: {}
 
   tough-cookie@6.0.0:
@@ -23146,6 +23531,12 @@ snapshots:
       media-typer: 0.3.0
       mime-types: 2.1.35
 
+  typed-array-buffer@1.0.3:
+    dependencies:
+      call-bound: 1.0.4
+      es-errors: 1.3.0
+      is-typed-array: 1.1.15
+
   typedarray-to-buffer@3.1.5:
     dependencies:
       is-typedarray: 1.0.0
@@ -23169,6 +23560,29 @@ snapshots:
       typescript: 5.6.3
       yaml: 2.8.1
 
+  typeorm@0.3.28(pg@8.18.0):
+    dependencies:
+      '@sqltools/formatter': 1.2.5
+      ansis: 4.2.0
+      app-root-path: 3.1.0
+      buffer: 6.0.3
+      dayjs: 1.11.19
+      debug: 4.4.3
+      dedent: 1.7.1
+      dotenv: 16.6.1
+      glob: 10.5.0
+      reflect-metadata: 0.2.2
+      sha.js: 2.4.12
+      sql-highlight: 6.1.0
+      tslib: 2.8.1
+      uuid: 11.1.0
+      yargs: 17.7.2
+    optionalDependencies:
+      pg: 8.18.0
+    transitivePeerDependencies:
+      - babel-plugin-macros
+      - supports-color
+
   typescript-eslint@8.49.0(eslint@9.39.1(jiti@2.6.1))(typescript@5.9.3):
     dependencies:
       '@typescript-eslint/eslint-plugin': 8.49.0(@typescript-eslint/parser@8.49.0(eslint@9.39.1(jiti@2.6.1))(typescript@5.9.3))(eslint@9.39.1(jiti@2.6.1))(typescript@5.9.3)
@@ -23392,6 +23806,8 @@ snapshots:
       spdx-correct: 3.2.0
       spdx-expression-parse: 3.0.1
 
+  validator@13.15.26: {}
+
   value-equal@1.0.1: {}
 
   vary@1.1.2: {}
@@ -23755,6 +24171,16 @@ snapshots:
       tr46: 0.0.3
       webidl-conversions: 3.0.1
 
+  which-typed-array@1.1.20:
+    dependencies:
+      available-typed-arrays: 1.0.7
+      call-bind: 1.0.8
+      call-bound: 1.0.4
+      for-each: 0.3.5
+      get-proto: 1.0.1
+      gopd: 1.2.0
+      has-tostringtag: 1.0.2
+
   which@1.3.1:
     dependencies:
       isexe: 2.0.0
@@ -23784,6 +24210,10 @@ snapshots:
     dependencies:
       execa: 8.0.1
 
+  wkx@0.5.0:
+    dependencies:
+      '@types/node': 24.10.1
+
   word-wrap@1.2.5: {}
 
   wordwrap@1.0.0: {}

From dfe38e6f206aa3da81c8e875b9ffae56907ad6c6 Mon Sep 17 00:00:00 2001
From: Pawel Kosiec <pawel.kosiec@databricks.com>
Date: Thu, 12 Feb 2026 09:43:03 +0100
Subject: [PATCH 3/3] chore: fix typeorm example

---
 .../server/lakebase-examples/sequelize-example.ts         | 1 +
 .../server/lakebase-examples/typeorm-example.ts           | 8 +++++++-
 2 files changed, 8 insertions(+), 1 deletion(-)

diff --git a/apps/dev-playground/server/lakebase-examples/sequelize-example.ts b/apps/dev-playground/server/lakebase-examples/sequelize-example.ts
index dd98e371..f9f5b513 100644
--- a/apps/dev-playground/server/lakebase-examples/sequelize-example.ts
+++ b/apps/dev-playground/server/lakebase-examples/sequelize-example.ts
@@ -44,6 +44,7 @@ class Order
 let sequelize: Sequelize;
 
 export async function setup() {
+  // @ts-expect-error password property supports a function for Lakehouse OAuth tokens
   sequelize = new Sequelize({
     dialect: "postgres",
     ...getLakebaseOrmConfig(),
diff --git a/apps/dev-playground/server/lakebase-examples/typeorm-example.ts b/apps/dev-playground/server/lakebase-examples/typeorm-example.ts
index beaa303d..171da14e 100644
--- a/apps/dev-playground/server/lakebase-examples/typeorm-example.ts
+++ b/apps/dev-playground/server/lakebase-examples/typeorm-example.ts
@@ -1,4 +1,4 @@
-import { getLakebaseOrmConfig } from "@databricks/appkit";
+import { createLakebasePool, getLakebaseOrmConfig } from "@databricks/appkit";
 import type { IAppRouter } from "shared";
 import {
   Column,
@@ -44,6 +44,12 @@ class Task {
 let dataSource: DataSource;
 
 export async function setup() {
+  // Create schema if not exists (TypeORM's synchronize doesn't create schemas)
+  // See https://github.com/typeorm/typeorm/issues/3192
+  const pool = createLakebasePool();
+  await pool.query("CREATE SCHEMA IF NOT EXISTS typeorm_example");
+  await pool.end();
+
   dataSource = new DataSource({
     type: "postgres",
     ...getLakebaseOrmConfig(),