Merge pull request #492 from supabase/j0_patch_revamped_constructor

Patch revamped constructor

Author: J0

src/SupabaseClient.ts

@@ -9,19 +9,27 @@ import { RealtimeChannel, RealtimeClient, RealtimeClientOptions } from '@supabas
 import { StorageClient as SupabaseStorageClient } from '@supabase/storage-js'
 import { DEFAULT_HEADERS } from './lib/constants'
 import { fetchWithAuth } from './lib/fetch'
-import { stripTrailingSlash } from './lib/helpers'
+import { stripTrailingSlash, applySettingDefaults } from './lib/helpers'
 import { SupabaseAuthClient } from './lib/SupabaseAuthClient'
 import { SupabaseRealtimeChannel } from './lib/SupabaseRealtimeChannel'
 import { Fetch, GenericSchema, SupabaseClientOptions, SupabaseAuthClientOptions } from './lib/types'
 
-const DEFAULT_OPTIONS = {
+const DEFAULT_GLOBAL_OPTIONS = {
+  headers: DEFAULT_HEADERS,
+}
+
+const DEFAULT_DB_OPTIONS = {
   schema: 'public',
+}
+
+const DEFAULT_AUTH_OPTIONS: SupabaseAuthClientOptions = {
   autoRefreshToken: true,
   persistSession: true,
   detectSessionInUrl: true,
-  headers: DEFAULT_HEADERS,
 }
 
+const DEFAULT_REALTIME_OPTIONS: RealtimeClientOptions = {}
+
 /**
  * Supabase Client.
  *
@@ -59,13 +67,13 @@ export default class SupabaseClient<
    * Create a new client for use in the browser.
    * @param supabaseUrl The unique Supabase URL which is supplied when you create a new project in your project dashboard.
    * @param supabaseKey The unique Supabase Key which is supplied when you create a new project in your project dashboard.
-   * @param options.schema You can switch in between schemas. The schema needs to be on the list of exposed schemas inside Supabase.
-   * @param options.autoRefreshToken Set to "true" if you want to automatically refresh the token before expiring.
-   * @param options.persistSession Set to "true" if you want to automatically save the user session into local storage.
-   * @param options.detectSessionInUrl Set to "true" if you want to automatically detects OAuth grants in the URL and signs in the user.
-   * @param options.headers Any additional headers to send with each network request.
+   * @param options.db.schema You can switch in between schemas. The schema needs to be on the list of exposed schemas inside Supabase.
+   * @param options.auth.autoRefreshToken Set to "true" if you want to automatically refresh the token before expiring.
+   * @param options.auth.persistSession Set to "true" if you want to automatically save the user session into local storage.
+   * @param options.auth.detectSessionInUrl Set to "true" if you want to automatically detects OAuth grants in the URL and signs in the user.
    * @param options.realtime Options passed along to realtime-js constructor.
-   * @param options.fetch A custom fetch implementation.
+   * @param options.global.fetch A custom fetch implementation.
+   * @param options.global.headers Any additional headers to send with each network request.
    */
   constructor(
     protected supabaseUrl: string,
@@ -90,19 +98,29 @@ export default class SupabaseClient<
     }
     // default storage key uses the supabase project ref as a namespace
     const defaultStorageKey = `sb-${new URL(this.authUrl).hostname.split('.')[0]}-auth-token`
-    this.storageKey = options?.auth?.storageKey ?? defaultStorageKey
+    const DEFAULTS = {
+      db: DEFAULT_DB_OPTIONS,
+      realtime: DEFAULT_REALTIME_OPTIONS,
+      auth: { ...DEFAULT_AUTH_OPTIONS, storageKey: defaultStorageKey },
+      global: DEFAULT_GLOBAL_OPTIONS,
+    }
 
-    const settings = { ...DEFAULT_OPTIONS, ...options, storageKey: this.storageKey }
+    const settings = applySettingDefaults(options ?? {}, DEFAULTS)
 
-    this.headers = { ...DEFAULT_HEADERS, ...options?.headers }
+    this.storageKey = settings.auth?.storageKey ?? ''
+    this.headers = settings.global?.headers ?? {}
 
-    this.auth = this._initSupabaseAuthClient(settings.auth || {}, this.headers, settings.fetch)
-    this.fetch = fetchWithAuth(supabaseKey, this._getAccessToken.bind(this), settings.fetch)
+    this.auth = this._initSupabaseAuthClient(
+      settings.auth ?? {},
+      this.headers,
+      settings.global?.fetch
+    )
+    this.fetch = fetchWithAuth(supabaseKey, this._getAccessToken.bind(this), settings.global?.fetch)
 
     this.realtime = this._initRealtimeClient({ headers: this.headers, ...settings.realtime })
     this.rest = new PostgrestClient(`${_supabaseUrl}/rest/v1`, {
       headers: this.headers,
-      schema: options?.db?.schema,
+      schema: settings.db?.schema,
       fetch: this.fetch,
     })
 

src/lib/helpers.ts

@@ -1,4 +1,5 @@
 // helpers.ts
+import { SupabaseClientOptions } from './types'
 
 export function uuid() {
   return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function (c) {
@@ -13,3 +14,45 @@ export function stripTrailingSlash(url: string): string {
 }
 
 export const isBrowser = () => typeof window !== 'undefined'
+
+export function applySettingDefaults<
+  Database = any,
+  SchemaName extends string & keyof Database = 'public' extends keyof Database
+    ? 'public'
+    : string & keyof Database
+>(
+  options: SupabaseClientOptions<SchemaName>,
+  defaults: SupabaseClientOptions<any>
+): SupabaseClientOptions<SchemaName> {
+  const {
+    db: dbOptions,
+    auth: authOptions,
+    realtime: realtimeOptions,
+    global: globalOptions,
+  } = options
+  const {
+    db: DEFAULT_DB_OPTIONS,
+    auth: DEFAULT_AUTH_OPTIONS,
+    realtime: DEFAULT_REALTIME_OPTIONS,
+    global: DEFAULT_GLOBAL_OPTIONS,
+  } = defaults
+
+  return {
+    db: {
+      ...DEFAULT_DB_OPTIONS,
+      ...dbOptions,
+    },
+    auth: {
+      ...DEFAULT_AUTH_OPTIONS,
+      ...authOptions,
+    },
+    realtime: {
+      ...DEFAULT_REALTIME_OPTIONS,
+      ...realtimeOptions,
+    },
+    global: {
+      ...DEFAULT_GLOBAL_OPTIONS,
+      ...globalOptions,
+    },
+  }
+}

src/lib/types.ts

@@ -45,14 +45,16 @@ export type SupabaseClientOptions<SchemaName> = {
    * Options passed to the realtime-js instance
    */
   realtime?: RealtimeClientOptions
-  /**
-   * A custom `fetch` implementation.
-   */
-  fetch?: Fetch
-  /**
-   * Optional headers for initializing the client.
-   */
-  headers?: Record<string, string>
+  global?: {
+    /**
+     * A custom `fetch` implementation.
+     */
+    fetch?: Fetch
+    /**
+     * Optional headers for initializing the client.
+     */
+    headers?: Record<string, string>
+  }
 }
 
 export type SupabaseRealtimePayload<T> = {

test/SupabaseAuthClient.test.ts

@@ -1,15 +1,25 @@
 import { SupabaseAuthClient } from '../src/lib/SupabaseAuthClient'
+import { SupabaseClientOptions } from '../src/lib/types'
+import { DEFAULT_HEADERS } from '../src/lib/constants'
 
 const DEFAULT_OPTIONS = {
-  schema: 'public',
-  autoRefreshToken: true,
-  persistSession: true,
-  detectSessionInUrl: true,
-  headers: {},
+  auth: {
+    autoRefreshToken: true,
+    persistSession: true,
+    detectSessionInUrl: true,
+  },
+  global: {
+    headers: DEFAULT_HEADERS,
+  },
+  db: {
+    schema: 'public',
+  },
 }
 const settings = { ...DEFAULT_OPTIONS }
 
+const authSettings = { ...settings.global, ...settings.auth }
+
 test('it should create a new instance of the class', () => {
-  const authClient = new SupabaseAuthClient(settings)
+  const authClient = new SupabaseAuthClient(authSettings)
   expect(authClient).toBeInstanceOf(SupabaseAuthClient)
 })

test/client.test.ts

@@ -19,7 +19,7 @@ describe('Custom Headers', () => {
   test('should have custom header set', () => {
     const customHeader = { 'X-Test-Header': 'value' }
 
-    const request = createClient(URL, KEY, { headers: customHeader }).rpc('')
+    const request = createClient(URL, KEY, { global: { headers: customHeader } }).rpc('')
 
     // @ts-ignore
     const getHeaders = request.headers

test/helpers.test.ts

@@ -1,5 +1,42 @@
 import * as helpers from '../src/lib/helpers'
+import { DEFAULT_HEADERS } from '../src/lib/constants'
 
 test('uuid', async () => {
   expect(helpers.uuid()).toMatch(/^[0-9a-f]{8}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{12}$/)
 })
+
+test('override setting defaults', async () => {
+  const DEFAULT_GLOBAL_OPTIONS = {
+    headers: DEFAULT_HEADERS,
+  }
+
+  const DEFAULT_DB_OPTIONS = {
+    schema: 'public',
+  }
+
+  const DEFAULT_AUTH_OPTIONS = {
+    autoRefreshToken: true,
+    persistSession: true,
+    detectSessionInUrl: true,
+  }
+
+  let defaults = {
+    db: DEFAULT_DB_OPTIONS,
+    auth: DEFAULT_AUTH_OPTIONS,
+    global: DEFAULT_GLOBAL_OPTIONS,
+  }
+
+  let autoRefreshOption = false
+  let options = {
+    auth: {
+      autoRefreshToken: autoRefreshOption,
+    },
+  }
+  let settings = helpers.applySettingDefaults(options, defaults)
+  expect(settings?.auth?.autoRefreshToken).toBe(autoRefreshOption)
+  // Existing default properties should not be overwritten
+  expect(settings?.auth?.persistSession).not.toBeNull()
+  expect(settings?.global?.headers).toBe(DEFAULT_HEADERS)
+  // Existing property values should remain constant
+  expect(settings?.db?.schema).toBe(defaults.db.schema)
+})