import Topnav from '@/components/topnav'
import Footer from '@/components/footer'
import OnboardingWizard from './onboarding-wizard'
import { redirect } from 'next/navigation'
import { getViewer } from '@/lib/viewer'
import '../styles/vip-onboarding.css'

export const dynamic = 'force-dynamic'
export const metadata = { title: 'إعداد العضوية' }

export default async function VipOnboardingPage() {
  const viewer = await getViewer()
  if (!viewer) redirect('/login?next=%2Fvip-onboarding')
  if (viewer.role !== 'vip' && viewer.role !== 'admin') redirect('/subscription')
  return (
    <div id="site" className="site-page page-vip-onboarding">
      <Topnav viewer={viewer} />
      <main id="content">
        <p className="member-strip" role="status">تم تفعيل عضويتك. خمس دقائق لإعداد مسارك الأول.</p>
        <OnboardingWizard viewerId={viewer.id ?? null} />
      </main>
      <Footer />
    </div>
  )
}