Function ImportSuccessContent

Source

export function ImportSuccessContent({
  importData,
  progress,
}: Readonly<ImportSuccessProps>) {
  const importedCount = importData?.manga?.length ?? 0;

  return (
    <motion.section
      initial={{ opacity: 0, y: 16 }}
      animate={{ opacity: 1, y: 0 }}
      transition={{ duration: 0.3 }}
    >
      <Card className="items-center text-center shadow-lg">
        <CardHeader className="flex flex-col items-center gap-4 text-center">
          <div className="flex h-16 w-16 items-center justify-center rounded-full bg-emerald-500/10 text-emerald-600 dark:text-emerald-400">
            <CheckCircle2 className="h-8 w-8" />
          </div>
          <CardTitle className="text-3xl font-semibold">
            Import ready for review
          </CardTitle>
          <CardDescription className="text-base">
            {importedCount.toLocaleString()} entries are staged. We’ll take you
            to match review automatically.
          </CardDescription>
        </CardHeader>
        <CardContent className="w-full space-y-3 px-6 pb-6">
          <div className="text-muted-foreground flex items-center justify-between text-xs font-medium">
            <span>Background tasks</span>
            <span>{progress}%</span>
          </div>
          <Progress value={progress} className="h-2" />
        </CardContent>
      </Card>
    </motion.section>
  );
}
Copy