Implement auth provider

Author: AdaptCharm

.env.example

@@ -0,0 +1 @@
+POSTGRES_URL=postgres://postgres:postgres@localhost:54322/riven

bun.lockb

@@ -0,0 +1,49 @@
+import { NextResponse } from 'next/server'
+import type { NextRequest } from 'next/server'
+
+import { signToken, verifyToken } from '@/lib/auth/session'
+
+const protectedRoutes = '/dashboard'
+
+export async function middleware(request: NextRequest) {
+    const { pathname } = request.nextUrl
+    const sessionCookie = request.cookies.get('session')
+    const isProtectedRoute = pathname.startsWith(protectedRoutes)
+
+    if (isProtectedRoute && !sessionCookie) {
+        return NextResponse.redirect(new URL('/sign-in', request.url))
+    }
+
+    const res = NextResponse.next()
+
+    if (sessionCookie) {
+        try {
+            const parsed = await verifyToken(sessionCookie.value)
+            const expiresInOneDay = new Date(Date.now() + 24 * 60 * 60 * 1000)
+
+            res.cookies.set({
+                name: 'session',
+                value: await signToken({
+                    ...parsed,
+                    expires: expiresInOneDay.toISOString()
+                }),
+                httpOnly: true,
+                secure: true,
+                sameSite: 'lax',
+                expires: expiresInOneDay
+            })
+        } catch (error) {
+            console.error('Error updating session:', error)
+            res.cookies.delete('session')
+            if (isProtectedRoute) {
+                return NextResponse.redirect(new URL('/sign-in', request.url))
+            }
+        }
+    }
+
+    return res
+}
+
+export const config = {
+    matcher: ['/((?!api|_next/static|_next/image|favicon.ico).*)']
+}

middleware.ts

@@ -16,24 +16,31 @@
         "@radix-ui/react-select": "^2.1.5",
         "@radix-ui/react-toast": "^1.2.5",
         "@tailwindcss/postcss": "^4.0.3",
+        "bcryptjs": "^2.4.3",
         "class-variance-authority": "^0.7.1",
+        "drizzle-orm": "^0.39.3",
+        "jose": "^5.9.6",
         "lucide-react": "^0.474.0",
         "next": "15.1.6",
         "next-themes": "^0.4.4",
+        "postgres": "^3.4.5",
         "react": "19.0.0",
         "react-dom": "19.0.0",
         "tailwind-merge": "^3.0.1",
         "tailwindcss": "^4.0.3",
-        "vaul": "^1.1.2"
+        "vaul": "^1.1.2",
+        "zod": "^3.24.2"
     },
     "devDependencies": {
         "@eslint/js": "^9.19.0",
         "@next/bundle-analyzer": "^15.1.6",
         "@next/eslint-plugin-next": "^15.1.6",
         "@trivago/prettier-plugin-sort-imports": "^5.2.2",
+        "@types/bcryptjs": "^2.4.6",
         "@types/node": "^22.13.0",
         "@types/react": "19.0.8",
         "@types/react-dom": "19.0.3",
+        "drizzle-kit": "^0.30.4",
         "eslint": "^9.19.0",
         "eslint-config-next": "15.1.6",
         "eslint-config-prettier": "^10.0.1",

package.json

@@ -1,6 +1,12 @@
-import type { ReactNode } from 'react'
+'use client'
 
-export default function DashboardLayout({ children }: { children: ReactNode }) {
+import { type ReactNode } from 'react'
+
+interface SidebarProps {
+    children: ReactNode
+}
+
+function Sidebar({ children }: SidebarProps) {
     return (
         <div className='container-wrapper'>
             <div className='container flex-1 items-start md:grid md:grid-cols-[220px_minmax(0,1fr)] md:gap-6 lg:grid-cols-[240px_minmax(0,1fr)] lg:gap-10'>
@@ -12,3 +18,7 @@ export default function DashboardLayout({ children }: { children: ReactNode }) {
         </div>
     )
 }
+
+export default function DashboardLayout({ ...props }: SidebarProps) {
+    return <Sidebar {...props} />
+}

src/app/(dashboard)/dashboard/layout.tsx

@@ -0,0 +1,30 @@
+'use client'
+
+import { type ReactNode, use } from 'react'
+
+import { useRouter } from 'next/navigation'
+
+import { signOut } from '@/app/(login)/actions'
+import { Header } from '@/components/header'
+import { Toaster } from '@/components/ui/toaster'
+import { useUser } from '@/lib/auth'
+
+export default function Layout({ children }: { children: ReactNode }) {
+    const { userPromise } = useUser()
+    const user = use(userPromise)
+    const router = useRouter()
+
+    async function handleSignOut() {
+        await signOut()
+        router.refresh()
+        router.push('/')
+    }
+
+    return (
+        <div data-vaul-drawer-wrapper>
+            <Header isAuthenticated={user} onSignOut={handleSignOut} />
+            <main>{children}</main>
+            <Toaster />
+        </div>
+    )
+}