chore(dbauth-mw): Refactor web side dbAuth creation

.changesets/10460.md

@@ -0,0 +1,38 @@
+- chore(dbauth-mw): Refactor web side dbAuth creation (#10460) by @dac09
+
+This PR changes how the webside auth is initialised, by removing the `createMiddlewareAuth` function, instead it just detects it internally. 
+
+For dbAuth this is what it will looks like: 
+
+```js:web/src/auth.ts
+import {
+  createDbAuthClient,
+  createAuth,
+} from '@redwoodjs/auth-dbauth-web'
+
+const dbAuthClient = createDbAuthClient({
+  middleware: true,
+})
+
+// Internally we know to use the middleware version of the client
+// because middleware is set to true above!
+export const { AuthProvider, useAuth } = createAuth(dbAuthClient)
+
+```
+
+For other auth providers we are going to export a similar looking function:
+
+```js
+import { createAuth, createSupabaseAuthClient } from '@redwoodjs/auth-supabase-web'
+
+// This function is new, and just wraps creating supabase👇
+const supabaseClient = createSupabaseAuthClient({
+  supabaseUrl: process.env.SUPABASE_URL || '',
+  supabaseKey: process.env.SUPABASE_KEY || '',
+  middleware: true
+})
+
+export const { AuthProvider, useAuth } = createAuth(supabaseClient)
+```
+
+This also means our users won't need to change where supabase client is imported from, for example.

packages/auth-providers/dbAuth/web/src/__tests__/dbAuth.middleware.test.ts

@@ -1,7 +1,7 @@
 import { act, renderHook } from '@testing-library/react'
 
 import type { CustomProviderHooks, DbAuthClientArgs } from '../dbAuth'
-import { createDbAuthClient, createMiddlewareAuth } from '../dbAuth'
+import { createDbAuthClient, createAuth } from '../dbAuth'
 
 import { fetchMock } from './dbAuth.test'
 
@@ -16,7 +16,7 @@ export function getMwDbAuth(
 ) {
   // We have to create a special createDbAuthClient with middleware = true
   const dbAuthClient = createDbAuthClient({ ...args, middleware: true })
-  const { useAuth, AuthProvider } = createMiddlewareAuth(dbAuthClient, {
+  const { useAuth, AuthProvider } = createAuth(dbAuthClient, {
     useCurrentUser: args.useCurrentUser,
     useHasRole: args.useHasRole,
   })

packages/auth-providers/dbAuth/web/src/dbAuth.ts

@@ -25,13 +25,14 @@ export type CustomProviderHooks = {
   ) => (rolesToCheck: string | string[]) => boolean
 }
 
-export function createMiddlewareAuth(
+// This is the middleware-edition auth function
+// Overrides the default getCurrentUser to fetch it from middleware instead
+function createMiddlewareAuth(
   dbAuthClient: ReturnType<typeof createDbAuthClient>,
   customProviderHooks?: CustomProviderHooks,
 ) {
   return createAuthentication(dbAuthClient, {
     // @MARK This is key! 👇
-    // Override the default getCurrentUser to fetch it from middleware instead
     ...customProviderHooks,
     useCurrentUser:
       customProviderHooks?.useCurrentUser ??
@@ -48,6 +49,10 @@ export function createAuth(
     ) => (rolesToCheck: string | string[]) => boolean
   },
 ) {
+  if (dbAuthClient.useMiddlewareAuth) {
+    return createMiddlewareAuth(dbAuthClient, customProviderHooks)
+  }
+
   return createAuthentication(dbAuthClient, customProviderHooks)
 }