supabase · avallete · Jul 10, 2025 · Jul 10, 2025 · Jul 10, 2025 · Jul 11, 2025
diff --git a/src/SupabaseClient.ts b/src/SupabaseClient.ts
@@ -4,7 +4,6 @@ import {
   PostgrestClient,
   PostgrestFilterBuilder,
   PostgrestQueryBuilder,
-  ClientServerOptions as PostgrestClientServerOption,
   GetGenericDatabaseWithOptions,
 } from '@supabase/postgrest-js'
 import {
@@ -23,16 +22,20 @@ import {
 import { fetchWithAuth } from './lib/fetch'
 import { ensureTrailingSlash, applySettingDefaults } from './lib/helpers'
 import { SupabaseAuthClient } from './lib/SupabaseAuthClient'
-import { Fetch, GenericSchema, SupabaseClientOptions, SupabaseAuthClientOptions } from './lib/types'
+import {
+  Fetch,
+  GenericSchema,
+  SupabaseClientOptions,
+  SupabaseAuthClientOptions,
+  ServicesOptions,
+} from './lib/types'
 
 /**
  * Supabase Client.
  *
  * An isomorphic Javascript client for interacting with Postgres.
  */
 
-export type ServicesOptions = PostgrestClientServerOption & {}
-
 export default class SupabaseClient<
   Database = any,
   ClientOptions extends ServicesOptions = { PostgrestVersion: '12' },

diff --git a/src/index.ts b/src/index.ts
@@ -1,6 +1,5 @@
 import SupabaseClient from './SupabaseClient'
-import type { GenericSchema, SupabaseClientOptions } from './lib/types'
-import type { ServicesOptions } from './SupabaseClient'
+import type { GenericSchema, SupabaseClientOptions, ServicesOptions } from './lib/types'
 import type { GetGenericDatabaseWithOptions } from '@supabase/postgrest-js'
 
 export * from '@supabase/auth-js'
@@ -23,10 +22,7 @@ export * from '@supabase/realtime-js'
 export { default as SupabaseClient } from './SupabaseClient'
 export type { SupabaseClientOptions, QueryResult, QueryData, QueryError } from './lib/types'
 
-/**
- * Creates a new Supabase Client.
- */
-export const createClient = <
+export type CreateClientHelper<AdditionalOptions = {}> = <
   Database = any,
   ClientOptions extends ServicesOptions = GetGenericDatabaseWithOptions<Database>['options'],
   SchemaName extends string &
@@ -39,17 +35,19 @@ export const createClient = <
 >(
   supabaseUrl: string,
   supabaseKey: string,
-  options?: SupabaseClientOptions<SchemaName>
-): SupabaseClient<
+  options?: SupabaseClientOptions<SchemaName> & AdditionalOptions
+) => SupabaseClient<
   Database,
   ClientOptions,
   SchemaName,
   Schema extends GenericSchema ? Schema : any
-> => {
-  return new SupabaseClient<
-    Database,
-    ClientOptions,
-    SchemaName,
-    Schema extends GenericSchema ? Schema : any
-  >(supabaseUrl, supabaseKey, options)
+>
+
+export type GenericSupabaseClient = SupabaseClient<any, any, any, any>
+
+/**
+ * Creates a new Supabase Client.
+ */
+export const createClient: CreateClientHelper = (supabaseUrl, supabaseKey, options) => {
+  return new SupabaseClient(supabaseUrl, supabaseKey, options)
 }
diff --git a/src/lib/types.ts b/src/lib/types.ts
@@ -1,6 +1,9 @@
 import { AuthClient } from '@supabase/auth-js'
 import { RealtimeClientOptions } from '@supabase/realtime-js'
-import { PostgrestError } from '@supabase/postgrest-js'
+import {
+  PostgrestError,
+  ClientServerOptions as PostgrestClientServerOption,
+} from '@supabase/postgrest-js'
 
 type AuthClientOptions = ConstructorParameters<typeof AuthClient>[0]
 
@@ -121,3 +124,4 @@ export type GenericSchema = {
 export type QueryResult<T> = T extends PromiseLike<infer U> ? U : never
 export type QueryData<T> = T extends PromiseLike<{ data: infer U }> ? Exclude<U, null> : never
 export type QueryError = PostgrestError
+export type ServicesOptions = PostgrestClientServerOption & {}
diff --git a/test/integration/next/app/layout.tsx b/test/integration/next/app/layout.tsx
@@ -0,0 +1,14 @@
+import type { Metadata } from 'next'
+
+export const metadata: Metadata = {
+  title: 'Supabase Integration Test',
+  description: 'Testing Supabase integration with Next.js',
+}
+
+export default function RootLayout({ children }: { children: React.ReactNode }) {
+  return (
+    <html lang="en">
+      <body>{children}</body>
+    </html>
+  )
+}
diff --git a/test/integration/next/index.d.ts b/test/integration/next/index.d.ts
diff --git a/test/integration/next/package.json b/test/integration/next/package.json
@@ -6,6 +6,7 @@
     "start": "next start",
     "lint": "next lint",
     "test": "playwright test",
+    "test:types": "npx tsd --files tests/types/*.test-d.ts",
     "test:ui": "playwright test --ui",
     "test:debug": "playwright test --debug"
   },
@@ -37,6 +38,7 @@
     "postcss": "^8",
     "tailwindcss": "^3.4.1",
     "tailwindcss-animate": "^1.0.7",
+    "tsd": "^0.32.0",
     "typescript": "^5"
   }
 }
diff --git a/test/integration/next/tests/types/types.test-d.ts b/test/integration/next/tests/types/types.test-d.ts
@@ -0,0 +1,169 @@
+import { expectType } from 'tsd'
+import { createServerClient, createBrowserClient } from '@supabase/ssr'
+
+type Database = {
+  public: {
+    Tables: {
+      shops: {
+        Row: {
+          address: string | null
+          id: number
+          shop_geom: unknown | null
+        }
+        Insert: {
+          address?: string | null
+          id: number
+          shop_geom?: unknown | null
+        }
+        Update: {
+          address?: string | null
+          id?: number
+          shop_geom?: unknown | null
+        }
+        Relationships: []
+      }
+    }
+    Views: {
+      [_ in never]: never
+    }
+    Functions: {
+      [_ in never]: never
+    }
+    Enums: {
+      [_ in never]: never
+    }
+    CompositeTypes: {
+      [_ in never]: never
+    }
+  }
+}
+
+type DatabaseWithInternals = {
+  __InternalSupabase: {
+    PostgrestVersion: '13'
+  }
+  public: {
+    Tables: {
+      shops: {
+        Row: {
+          address: string | null
+          id: number
+          shop_geom: unknown | null
+        }
+        Insert: {
+          address?: string | null
+          id: number
+          shop_geom?: unknown | null
+        }
+        Update: {
+          address?: string | null
+          id?: number
+          shop_geom?: unknown | null
+        }
+        Relationships: []
+      }
+    }
+    Views: {
+      [_ in never]: never
+    }
+    Functions: {
+      [_ in never]: never
+    }
+    Enums: {
+      [_ in never]: never
+    }
+    CompositeTypes: {
+      [_ in never]: never
+    }
+  }
+}
+
+{
+  //  createBrowserClient should be able discriminate postgrest version
+  const pg13Client = createBrowserClient<DatabaseWithInternals>('HTTP://localhost:3000', '')
+  const pg12Client = createBrowserClient<Database>('HTTP://localhost:3000', '')
+  const res13 = await pg13Client.from('shops').update({ id: 21 }).maxAffected(1)
+  const res12 = await pg12Client.from('shops').update({ id: 21 }).maxAffected(1)
+  expectType<typeof res13.data>(null)
+  expectType<typeof res12.Error>('maxAffected method only available on postgrest 13+')
+}
+
+{
+  // createBrowserClient should return a typed client
+  const pg12Client = createBrowserClient<Database>('HTTP://localhost:3000', '')
+  const res12 = await pg12Client.from('shops').select('*')
+  expectType<
+    | {
+        address: string | null
+        id: number
+        shop_geom: unknown | null
+      }[]
+    | null
+  >(res12.data)
+}
+
+{
+  // createBrowserClient should infer everything to any without types provided
+  const pg12Client = createBrowserClient('HTTP://localhost:3000', '')
+  const res12 = await pg12Client.from('shops').select('address, id, relation(field)')
+  expectType<
+    | {
+        address: any
+        id: any
+        relation: {
+          field: any
+        }[]
+      }[]
+    | null
+  >(res12.data)
+}
+
+{
+  //  createServerClient should be able discriminate postgrest version
+  const pg13Client = createServerClient<DatabaseWithInternals>('HTTP://localhost:3000', '')
+  const pg12Client = createServerClient<Database>('HTTP://localhost:3000', '')
+  const res13 = await pg13Client.from('shops').update({ id: 21 }).maxAffected(1)
+  const res12 = await pg12Client.from('shops').update({ id: 21 }).maxAffected(1)
+  expectType<typeof res13.data>(null)
+  expectType<typeof res12.Error>('maxAffected method only available on postgrest 13+')
+}
+
+{
+  // createServerClient should return a typed client
+  const pg12Client = createServerClient<Database>('HTTP://localhost:3000', '')
+  const res12 = await pg12Client.from('shops').select('*')
+  expectType<
+    | {
+        address: string | null
+        id: number
+        shop_geom: unknown | null
+      }[]
+    | null
+  >(res12.data)
+}
+
+{
+  // createServerClient should infer everything to any without types provided
+  const pg12Client = createServerClient('HTTP://localhost:3000', '')
+  const res12 = await pg12Client.from('shops').select('address, id, relation(field)')
+  expectType<
+    | {
+        address: any
+        id: any
+        relation: {
+          field: any
+        }[]
+      }[]
+    | null
+  >(res12.data)
+}
+
+//  should default to postgrest 12 for untyped client
+{
+  const pg12ServerClient = createServerClient('HTTP://localhost:3000', '')
+  const res12Server = await pg12ServerClient.from('shops').update({ id: 21 }).maxAffected(1)
+  const pg12BrowserClient = createBrowserClient('HTTP://localhost:3000', '')
+  const res12Browser = await pg12BrowserClient.from('shops').update({ id: 21 }).maxAffected(1)
+  expectType<typeof res12Server.Error>('maxAffected method only available on postgrest 13+')
+  expectType<typeof res12Browser.Error>('maxAffected method only available on postgrest 13+')
+}
diff --git a/test/integration/next/tsconfig.json b/test/integration/next/tsconfig.json
@@ -24,5 +24,5 @@
     }
   },
   "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", ".next/types/**/*.ts"],
-  "exclude": ["node_modules"]
+  "exclude": ["node_modules", "tests/types/*.test-d.ts"]
 }