import type { JSX } from "react"
import { notFound } from "next/navigation"

import { requirePermission } from "@/shared/lib/auth-guard"
import { Permissions } from "@/shared/types/permissions"

import { getPracticeSessionById } from "@/modules/adaptive-practice/data-access"
import { PracticeSessionView } from "@/modules/adaptive-practice/components/practice-session-view"
import { PracticeServiceProvider } from "@/modules/adaptive-practice/services/practice-service"

export const dynamic = "force-dynamic"

export default async function PracticeSessionPage({
  params,
}: {
  params: Promise<{ sessionId: string }>
}): Promise<JSX.Element> {
  const ctx = await requirePermission(Permissions.ADAPTIVE_PRACTICE_READ)
  const { sessionId } = await params

  const session = await getPracticeSessionById(sessionId, ctx.userId)

  if (!session) {
    notFound()
  }

  return (
    <PracticeServiceProvider>
      <div className="flex h-full flex-col space-y-6 p-8">
        <PracticeSessionView session={session} />
      </div>
    </PracticeServiceProvider>
  )
}
