fix: pg connection string (#55)

* fix: pg connection string

* fix: format

Author: mxkaske

package.json

@@ -57,7 +57,6 @@
     "next-plausible": "^3.12.5",
     "next-themes": "^0.4.4",
     "nuqs": "^2.3.0",
-    "postgres": "^3.4.8",
     "react": "19.2.3",
     "react-day-picker": "^9.8.1",
     "react-dom": "19.2.3",

pnpm-lock.yaml

@@ -100,7 +100,6 @@ export async function GET(req: NextRequest): Promise<Response> {
   }
 }
 
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
 async function getChartData(
   db: any,
   table: typeof logs,
@@ -144,12 +143,13 @@ async function getChartData(
   const intervalMs = evaluateIntervalMs(durationMs);
   const intervalSeconds = Math.max(1, Math.floor(intervalMs / 1000));
 
-  const result: {
+  type ChartRow = {
     bucket: Date;
     success: number;
     warning: number;
     error: number;
-  }[] = await db.execute(
+  };
+  const raw = await db.execute(
     sql`SELECT
         date_bin(${intervalSeconds + " seconds"}::interval, ${table.date}, ${minDate.toISOString()}::timestamptz) as bucket,
         COUNT(*) FILTER (WHERE ${table.level} = 'success')::int as success,
@@ -160,6 +160,9 @@ async function getChartData(
       GROUP BY bucket
       ORDER BY bucket ASC`,
   );
+  const result: ChartRow[] = Array.isArray(raw)
+    ? raw
+    : (raw as { rows: ChartRow[] }).rows;
 
   return result.map((r) => ({
     timestamp: new Date(r.bucket).getTime(),

src/app/drizzle/api/route.ts

@@ -63,21 +63,24 @@ export const logs = pgTable("logs", {
 });
 ```
 
-Set up the database client. Use `prepare: false` when connecting through a pooler (Supabase transaction mode, PgBouncer, Neon):
+Set up the database client using the `node-postgres` driver:
 
 ```ts
 // db/drizzle/index.ts
-import { drizzle } from "drizzle-orm/postgres-js";
-import postgres from "postgres";
+import { drizzle } from "drizzle-orm/node-postgres";
 import * as schema from "./schema";
 
-const client = postgres(process.env.DATABASE_URL!, {
-  prepare: false, // Required for connection poolers
-});
+const connectionString = process.env.DATABASE_URL;
+
+if (!connectionString) {
+  throw new Error("DATABASE_URL environment variable is not set");
+}
 
-export const db = drizzle(client, { schema });
+export const db = drizzle(connectionString, { schema });
 ```
 
+> **Note:** If you're using a connection pooler (Supabase transaction mode, PgBouncer, Neon), make sure to use the transaction pooler URL (port `6543` for Supabase). Install `pg` as a dependency: `pnpm add pg @types/pg`.
+
 ### Step 2: Column Mapping
 
 The column mapping bridges your table schema keys to Drizzle columns. This is the **only file that couples UI to DB** — one file per table:

src/content/guide/06-drizzle-orm.mdx

@@ -8,4 +8,6 @@ export default defineConfig({
   dbCredentials: {
     url: process.env.DATABASE_URL!,
   },
+  verbose: true,
+  strict: true,
 });

src/db/drizzle/drizzle.config.ts

@@ -1,5 +1,4 @@
-import { drizzle } from "drizzle-orm/postgres-js";
-import postgres from "postgres";
+import { drizzle } from "drizzle-orm/node-postgres";
 import * as schema from "./schema";
 
 const connectionString = process.env.DATABASE_URL;
@@ -8,8 +7,4 @@ if (!connectionString) {
   throw new Error("DATABASE_URL environment variable is not set");
 }
 
-const client = postgres(connectionString, {
-  prepare: false, // Required for serverless / connection poolers (PgBouncer, Neon, Supabase)
-});
-
-export const db = drizzle(client, { schema });
+export const db = drizzle(connectionString, { schema });