Files
triqura-ecd/middleware.ts
colinislit 273c00f9e8 Epic 2: Design System Migration - Teal-first implementatie
 E2.S1: Tailwind config update
- Teal-700 (#0F766E) als PRIMARY brand color (5.47:1 contrast)
- Amber-600→700 gradient voor AI features
- Updated ring color naar teal-700 voor WCAG AA

 E2.S2: Global CSS variables
- --color-brand → teal-700 (was blue-600)
- --color-info → teal-700 (was blue-500)
- --color-input-focus → teal-700 (was blue-500)
- --color-ai toegevoegd → amber-600

 E2.S3: Component color updates
- components/ui/sign-in.tsx: Alle blue → teal
- components/ui/timeline.tsx: Gradient blue → teal
- components/ui/reading-progress.tsx: Progress bar blue → teal
- components/ui/modern-side-bar.tsx: Logo, active states blue → teal

 E2.S4: AIButton component
- Nieuw component: components/ui/ai-button.tsx
- Amber-600→700 gradient voor WCAG compliance
- 3 variants: default, outline, ghost
- Loading state + Sparkles icon
- Fully accessible (WCAG AA focus states)

 E2.S5: Contrast testing
- scripts/test-contrast.ts: Automated WCAG testing
- docs/design/wcag-compliance.md: Compliance documentatie
- Resultaten: 7/11 AA Normal (4.5:1), 11/11 AA Large (3:1) 

WCAG AA Compliance:  PASS
- Teal-700 op wit: 5.47:1 (AA Normal)
- White op teal-700: 5.47:1 (AA Normal)
- White op amber-600: 3.19:1 (AA Large - OK voor buttons)

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
2025-11-17 17:38:22 +01:00

97 lines
2.4 KiB
TypeScript

/**
* Next.js Middleware
*
* Handles authentication and route protection
*/
import { createServerClient } from '@supabase/ssr'
import { NextResponse, type NextRequest } from 'next/server'
export async function middleware(request: NextRequest) {
let supabaseResponse = NextResponse.next({
request,
})
const supabase = createServerClient(
process.env.NEXT_PUBLIC_SUPABASE_URL!,
process.env.NEXT_PUBLIC_SUPABASE_ANON_KEY!,
{
cookies: {
getAll() {
return request.cookies.getAll()
},
setAll(cookiesToSet) {
cookiesToSet.forEach(({ name, value }) =>
request.cookies.set(name, value)
)
supabaseResponse = NextResponse.next({
request,
})
cookiesToSet.forEach(({ name, value, options }) =>
supabaseResponse.cookies.set(name, value, options)
)
},
},
}
)
// Refresh session if expired - required for Server Components
const {
data: { user },
} = await supabase.auth.getUser()
const { pathname } = request.nextUrl
// Public routes that don't require authentication
const publicRoutes = [
'/',
'/login',
'/auth/callback',
'/contact',
'/api/leads',
'/robots.txt',
'/sitemap.xml',
]
// Check if current path is public
const isPublicRoute = publicRoutes.some(route =>
pathname === route || pathname.startsWith(`${route}/`)
)
// Static files and Next.js internals
if (
pathname.startsWith('/_next') ||
pathname.startsWith('/static') ||
pathname.includes('.')
) {
return supabaseResponse
}
// Redirect to login if not authenticated and trying to access protected route
if (!user && !isPublicRoute) {
const redirectUrl = new URL('/login', request.url)
redirectUrl.searchParams.set('redirect', pathname)
return NextResponse.redirect(redirectUrl)
}
// Redirect to /clients if authenticated and trying to access login
if (user && pathname === '/login') {
return NextResponse.redirect(new URL('/clients', request.url))
}
return supabaseResponse
}
export const config = {
matcher: [
/*
* Match all request paths except:
* - _next/static (static files)
* - _next/image (image optimization files)
* - favicon.ico (favicon file)
* - public folder
*/
'/((?!_next/static|_next/image|favicon.ico|.*\\.(?:svg|png|jpg|jpeg|gif|webp)$).*)',
],
}