import { useProgram } from "@/client/program"
import { useQuizzes } from "@/client/quiz"
import { getDefaultLayout, IDefaultLayoutPage, IPageHeader } from "@/components/layout/default-layout"
import ProgramForm from "@/components/program/ProgramForm"
import QuizList from "@/components/program/QuizList"
import { Alert } from "antd"
import { useRouter } from "next/router"

const pageHeader: IPageHeader = {
  title: "",
}

const ProgramEditPage: IDefaultLayoutPage = () => {
  const router = useRouter()
  const pid = router.query.pid ? (router.query.pid as string) : ""

  const { data: program } = useProgram({ id: pid })
  const { data: quizzes } = useQuizzes({
    program_id: pid,
  })
  return (
    <>
      <ProgramForm pid={pid} data={program} />
      <QuizList pid={pid} data={quizzes} />
    </>
  )
}

ProgramEditPage.getLayout = getDefaultLayout
ProgramEditPage.pageHeader = pageHeader

export default ProgramEditPage
