import { Loader2 } from "lucide-react"
import { getTranslations } from "next-intl/server"

export default async function Loading() {
  const t = await getTranslations("grades")
  return (
    <div className="flex h-full flex-col items-center justify-center gap-3 p-12">
      <Loader2 className="h-8 w-8 animate-spin text-muted-foreground" aria-hidden="true" />
      <p className="text-sm text-muted-foreground">{t("reportCard.loading")}</p>
    </div>
  )
}