Supabase Authentication

NEXT_PUBLIC_SUPABASE_URL=https://YOUR_PROJECT_REF.supabase.co
NEXT_PUBLIC_SUPABASE_PUBLISHABLE_KEY=sb_publishable_REPLACE_ME
NEXT_PUBLIC_SITE_URL=http://localhost:3000

# Supabase Auth Dashboard Setup - TaskFlow Phase 17

1. Authentication > Providers > Email: keep Email enabled.
2. Keep email confirmation enabled for the production-style learning flow.
3. Authentication > URL Configuration:
   - Site URL: http://localhost:3000 for local development.
   - Add production/staging redirect URLs before deployment.
4. Authentication > Email Templates > Confirm signup:

   Replace the confirmation link target with:

   {{ .SiteURL }}/auth/confirm?token_hash={{ .TokenHash }}&type=email

5. Never place a service-role or secret API key in NEXT_PUBLIC_* variables.
6. Phase 17 uses the project's Publishable key in the browser and SSR clients.

# Phase 17 Test Matrix

- Unauthenticated GET /account -> redirected to /login.
- Unauthenticated GET /tasks -> redirected to /login.
- Sign up with valid email/password and email confirmation enabled -> no immediate session; message asks user to check email.
- Confirmation link -> /auth/confirm verifies token_hash and stores cookie-backed session.
- Confirmed user signs in -> redirected to /account.
- Refresh /account -> remains signed in.
- Wait/force access-token refresh path -> proxy keeps cookies synchronized.
- Sign out -> current browser session cookies cleared and /account redirects to /login.
- Invalid confirmation link -> /auth/error.
- Server protection uses getClaims(), not getSession().user.
- Service-role/secret key is absent from browser code and NEXT_PUBLIC_* variables.

# Run from: taskflow\apps\web
pnpm add @supabase/supabase-js@2.116.0 @supabase/ssr@0.12.7

import { type NextRequest } from 'next/server'
import { updateSession } from '@/lib/supabase/proxy'

export async function proxy(request: NextRequest) {
  return updateSession(request)
}

export const config = {
  matcher: [
    '/((?!_next/static|_next/image|favicon.ico|.*\.(?:svg|png|jpg|jpeg|gif|webp)$).*)',
  ],
}

import { redirect } from 'next/navigation'
import { createClient } from '@/lib/supabase/server'

export const dynamic = 'force-dynamic'

export default async function AccountPage() {
  const supabase = await createClient()
  const { data, error } = await supabase.auth.getClaims()

  if (error || !data?.claims) {
    redirect('/login')
  }

  return (
    <main>
      <h1>TaskFlow account</h1>
      <p>Authenticated subject: {String(data.claims.sub)}</p>

      <form action="/auth/signout" method="post">
        <button type="submit">Sign out</button>

import { type EmailOtpType } from '@supabase/supabase-js'
import { type NextRequest, NextResponse } from 'next/server'
import { createClient } from '@/lib/supabase/server'

export async function GET(request: NextRequest) {
  const { searchParams } = new URL(request.url)
  const tokenHash = searchParams.get('token_hash')
  const type = searchParams.get('type') as EmailOtpType | null

  const redirectTo = request.nextUrl.clone()
  redirectTo.pathname = '/account'
  redirectTo.search = ''

  if (tokenHash && type) {
    const supabase = await createClient()
    const { error } = await supabase.auth.verifyOtp({
      type,
      token_hash: tokenHash,
    })

export default function AuthErrorPage() {
  return (
    <main>
      <h1>Authentication link could not be verified</h1>
      <p>Return to the sign-in page and request a new authentication flow.</p>
      <a href="/login">Back to sign in</a>
    </main>
  )
}

import { createClient } from '@/lib/supabase/server'
import { revalidatePath } from 'next/cache'
import { type NextRequest, NextResponse } from 'next/server'

export async function POST(request: NextRequest) {
  const supabase = await createClient()
  const { data } = await supabase.auth.getClaims()

  if (data?.claims) {
    // TaskFlow signs out only this browser session by default.
    await supabase.auth.signOut({ scope: 'local' })
  }

  revalidatePath('/', 'layout')
  return NextResponse.redirect(new URL('/login', request.url), {
    status: 303,
  })
}

'use server'

import { revalidatePath } from 'next/cache'
import { redirect } from 'next/navigation'
import { createClient } from '@/lib/supabase/server'

function credentials(formData: FormData) {
  const email = String(formData.get('email') ?? '').trim()
  const password = String(formData.get('password') ?? '')

  if (!email || password.length < 8) {
    redirect('/login?error=Check+your+email+and+password')
  }

  return { email, password }
}

export async function login(formData: FormData) {
  const supabase = await createClient()
  const { error } = await supabase.auth.signInWithPassword(

import { login, signup } from './actions'

export default async function LoginPage({
  searchParams,
}: {
  searchParams: Promise<{ error?: string; message?: string }>
}) {
  const params = await searchParams

  return (
    <main>
      <h1>TaskFlow</h1>
      <p>Sign in or create an account.</p>

      {params.error ? <p role="alert">{params.error}</p> : null}
      {params.message ? <p>{params.message}</p> : null}

      <form>
        <label>
          Email

import { createClient } from '@/lib/supabase/server'

export async function getAccessTokenForApi() {
  const supabase = await createClient()
  const {
    data: { session },
  } = await supabase.auth.getSession()

  // getSession() is used here only because Phase 18 needs the raw token
  // to forward to NestJS. NestJS must verify the token before trusting it.
  return session?.access_token ?? null
}

import { createBrowserClient } from '@supabase/ssr'

export function createClient() {
  return createBrowserClient(
    process.env.NEXT_PUBLIC_SUPABASE_URL!,
    process.env.NEXT_PUBLIC_SUPABASE_PUBLISHABLE_KEY!,
  )
}

import { createServerClient } from '@supabase/ssr'
import { NextResponse, type NextRequest } from 'next/server'

function isProtectedPath(pathname: string) {
  return pathname.startsWith('/account') || pathname.startsWith('/tasks')
}

export async function updateSession(request: NextRequest) {
  let response = NextResponse.next({ request })

  const supabase = createServerClient(
    process.env.NEXT_PUBLIC_SUPABASE_URL!,
    process.env.NEXT_PUBLIC_SUPABASE_PUBLISHABLE_KEY!,
    {
      cookies: {
        getAll() {
          return request.cookies.getAll()
        },
        setAll(cookiesToSet, headers) {
          cookiesToSet.forEach(({ name, value }) =>

import { createServerClient } from '@supabase/ssr'
import { cookies } from 'next/headers'

export async function createClient() {
  const cookieStore = await cookies()

  return createServerClient(
    process.env.NEXT_PUBLIC_SUPABASE_URL!,
    process.env.NEXT_PUBLIC_SUPABASE_PUBLISHABLE_KEY!,
    {
      cookies: {
        getAll() {
          return cookieStore.getAll()
        },
        setAll(cookiesToSet, _headers) {
          try {
            cookiesToSet.forEach(({ name, value, options }) =>
              cookieStore.set(name, value, options),
            )
          } catch {