import type { Metadata } from "next"
import type { JSX } from "react"
import { getTranslations } from "next-intl/server"

import { getParentDashboardAction } from "@/modules/dashboard/actions"
import { ParentDashboard } from "@/modules/parent/components/parent-dashboard"
import { ParentNoChildrenPage } from "@/modules/parent/components/parent-children-data-page"
import { Users } from "lucide-react"

export const dynamic = "force-dynamic"

export async function generateMetadata(): Promise<Metadata> {
  const t = await getTranslations("dashboard")
  return {
    title: t("title.parent"),
    description: t("description.parent"),
  }
}

export default async function ParentDashboardPage(): Promise<JSX.Element> {
  const t = await getTranslations("dashboard")
  const { data, hasChildren } = await getParentDashboardAction()

  if (!data || !hasChildren) {
    return (
      <div className="p-6 md:p-8">
        <ParentNoChildrenPage
          title={t("title.parent")}
          description={t("description.parent")}
          icon={Users}
          emptyTitle={t("empty.noChildren")}
          emptyDescription={t("empty.noChildrenDesc")}
        />
      </div>
    )
  }

  return (
    <div className="p-6 md:p-8">
      <ParentDashboard data={data} />
    </div>
  )
}
