feat(01-05): add protected dashboard layout and page

- Create UserNav component with logout functionality
- Add dashboard layout with header, navigation, and user info
- Create dashboard page displaying plan info and onboarding steps
- All text in Italian for target audience

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
Michele
2026-01-31 13:37:29 +01:00
parent 6cfe58e96d
commit af17f90d44
3 changed files with 228 additions and 0 deletions

View File

@@ -0,0 +1,72 @@
import { createClient } from '@/lib/supabase/server'
import { redirect } from 'next/navigation'
import { UserNav } from '@/components/layout/user-nav'
import Link from 'next/link'
export default async function DashboardLayout({
children,
}: {
children: React.ReactNode
}) {
const supabase = await createClient()
// Get user (should always exist due to middleware)
const { data: { user }, error: authError } = await supabase.auth.getUser()
if (authError || !user) {
redirect('/login')
}
// Get profile with plan info
const { data: profile } = await supabase
.from('profiles')
.select(`
*,
plans (
name,
display_name_it
)
`)
.eq('id', user.id)
.single()
return (
<div className="min-h-screen bg-gray-50">
{/* Header */}
<header className="bg-white border-b border-gray-200">
<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<div className="flex justify-between items-center h-16">
<div className="flex items-center gap-8">
<Link href="/dashboard" className="text-xl font-bold text-blue-600">
Leopost
</Link>
<nav className="hidden md:flex items-center gap-4">
<Link
href="/dashboard"
className="text-gray-600 hover:text-gray-900 text-sm font-medium"
>
Dashboard
</Link>
<Link
href="/subscription"
className="text-gray-600 hover:text-gray-900 text-sm font-medium"
>
Piano
</Link>
</nav>
</div>
<UserNav
email={user.email || ''}
planName={profile?.plans?.display_name_it}
/>
</div>
</div>
</header>
{/* Main content */}
<main className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-8">
{children}
</main>
</div>
)
}