Next.js auth integration package POC

app/actions.ts

@@ -5,7 +5,7 @@ import { redirect } from 'next/navigation'
 
 import { auth } from '@/auth'
 import { type Chat } from '@/lib/types'
-import { createClient } from '@/utils/supabase/server'
+import { createClient } from '@supabase-labs/nextjs/server'
 
 export async function getChats(userId?: string | null) {
   const session = await auth()

app/login/actions.ts

@@ -2,7 +2,7 @@
 
 import { z } from 'zod'
 import { ResultCode } from '@/lib/utils'
-import { createClient } from '@/utils/supabase/server'
+import { createClient } from '@supabase-labs/nextjs/server'
 
 interface Result {
   type: string

app/login/page.tsx

@@ -1,15 +1,6 @@
-import { auth } from '@/auth'
 import LoginForm from '@/components/login-form'
-import { Session } from '@/lib/types'
-import { redirect } from 'next/navigation'
 
 export default async function LoginPage() {
-  const session = (await auth()) as Session
-
-  if (session) {
-    redirect('/')
-  }
-
   return (
     <main className="flex flex-col p-4">
       <LoginForm />

app/signup/actions.ts

@@ -2,7 +2,7 @@
 
 import { ResultCode } from '@/lib/utils'
 import { z } from 'zod'
-import { createClient } from '@/utils/supabase/server'
+import { createClient } from '@supabase-labs/nextjs/server'
 import { headers } from 'next/headers'
 interface Result {
   type: string

app/signup/page.tsx

@@ -1,15 +1,6 @@
-import { auth } from '@/auth'
 import SignupForm from '@/components/signup-form'
-import { Session } from '@/lib/types'
-import { redirect } from 'next/navigation'
 
 export default async function SignupPage() {
-  const session = (await auth()) as Session
-
-  if (session) {
-    redirect('/')
-  }
-
   return (
     <main className="flex flex-col p-4">
       <SignupForm />

auth.ts

@@ -1,4 +1,4 @@
-import { createClient } from '@/utils/supabase/server'
+import { createClient } from '@supabase-labs/nextjs/server'
 import { Session } from '@/lib/types'
 
 export async function auth(): Promise<Session | null> {

components/ui/codeblock.tsx

@@ -68,7 +68,7 @@ const CodeBlock: FC<Props> = memo(({ language, value }) => {
       3,
       true
     )}${fileExtension}`
-    const fileName = window.prompt('Enter file name' || '', suggestedFileName)
+    const fileName = window.prompt('Enter file name', suggestedFileName)
 
     if (!fileName) {
       // User pressed cancel on prompt.

components/user-menu.tsx

@@ -8,7 +8,7 @@ import {
   DropdownMenuSeparator,
   DropdownMenuTrigger
 } from '@/components/ui/dropdown-menu'
-import { createClient } from '@/utils/supabase/server'
+import { createClient } from '@supabase-labs/nextjs/server'
 import { redirect } from 'next/navigation'
 
 export interface UserMenuProps {
@@ -42,7 +42,7 @@ export function UserMenu({ user }: UserMenuProps) {
               'use server'
               const supabase = createClient()
               await supabase.auth.signOut()
-              redirect('/login')
+              redirect('/')
             }}
           >
             <button className=" relative flex w-full cursor-pointer select-none items-center rounded-sm px-2 py-1.5 text-xs outline-none transition-colors hover:bg-red-500 hover:text-white focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50">

lib/types.ts

@@ -1,6 +1,4 @@
 import { CoreMessage } from 'ai'
-import { MergeDeep } from 'type-fest'
-import { Database as SupabaseDatabase } from '@/utils/supabase/types'
 
 export type Message = CoreMessage & {
   id: string
@@ -41,24 +39,3 @@ export interface User extends Record<string, any> {
   password: string
   salt: string
 }
-
-export type Database = MergeDeep<
-  SupabaseDatabase,
-  {
-    public: {
-      Tables: {
-        chats: {
-          Row: {
-            payload: Chat | null
-          }
-          Insert: {
-            payload?: Chat | null
-          }
-          Update: {
-            payload?: Chat | null
-          }
-        }
-      }
-    }
-  }
->

middleware.ts

@@ -1,9 +1,27 @@
-import { updateSession } from '@/utils/supabase/middleware'
-import { NextRequest } from 'next/server'
+import { supabaseMiddleware, createRouteMatcher } from '@supabase-labs/nextjs/server'
 
-export async function middleware(request: NextRequest) {
-  return await updateSession(request)
-}
+const isPublicRoute = createRouteMatcher(['/login(.*)', '/signup(.*)'])
+
+export default supabaseMiddleware(
+  async (auth, request) => {
+    const session = await auth()
+
+    // protect all routes except public ones
+    if (!isPublicRoute(request) && !session.user) {
+      return session.redirectToSignIn()
+    }
+
+    // redirect to home if user is logged in and on public route
+    if (isPublicRoute(request) && session.user) {
+      return session.redirectToHome()
+    }
+  },
+  {
+    paths: {
+      signIn: '/login'
+    }
+  }
+)
 
 export const config = {
   matcher: ['/((?!api|_next/static|_next/image|.*\\.png$).*)']