import prisma from "@/lib/prisma";
import Link from "next/link";

interface ProfileHealthScoreProps {
  userId: number;
}

interface HealthCheck {
  label: string;
  passed: boolean;
  weight: number;
  link: string;
}

export default async function ProfileHealthScore({ userId }: ProfileHealthScoreProps) {
  const [user, photoCount, galleryCount, availabilityCount] = await Promise.all([
    prisma.user.findUnique({
      where: { id: userId },
      include: {
        characteristic: true,
        rateUsers: { take: 1 },
      },
    }),
    prisma.photo.count({ where: { user_id: userId } }),
    prisma.gallery.count({ where: { user_id: userId } }),
    prisma.availability.count({ where: { user_id: userId } }),
  ]);

  if (!user) return null;

  const checks: HealthCheck[] = [
    {
      label: "Profile photo",
      passed: !!user.profile_photo,
      weight: 15,
      link: "/manage/photos/photos-profile",
    },
    {
      label: "More than 3 photos",
      passed: photoCount > 3,
      weight: 15,
      link: "/manage/photos/photos-profile",
    },
    {
      label: "At least 1 gallery",
      passed: galleryCount > 0,
      weight: 10,
      link: "/manage/galleries",
    },
    {
      label: "Username set",
      passed: !!user.username,
      weight: 5,
      link: "/manage/profile/personal-information",
    },
    {
      label: "Gender set",
      passed: !!user.gender,
      weight: 5,
      link: "/manage/profile/personal-information",
    },
    {
      label: "Characteristics filled",
      passed: !!user.characteristic,
      weight: 15,
      link: "/manage/profile/personal-information",
    },
    {
      label: "Rates configured",
      passed: (user.rateUsers?.length ?? 0) > 0,
      weight: 15,
      link: "/manage/rates",
    },
    {
      label: "Availability set",
      passed: availabilityCount > 0,
      weight: 10,
      link: "/manage/availabilities",
    },
    {
      label: "Verified",
      passed: user.is_verified,
      weight: 10,
      link: "/manage/profile/personal-information",
    },
  ];

  const score = checks.reduce((acc, c) => acc + (c.passed ? c.weight : 0), 0);

  // SVG circular progress
  const radius = 44;
  const circumference = 2 * Math.PI * radius;
  const offset = circumference - (score / 100) * circumference;

  return (
    <div className="bg-surface rounded-xl border border-surface-light p-6">
      <h2 className="text-lg font-semibold text-text mb-4">Profile Health</h2>

      <div className="flex items-start gap-6">
        {/* Circular progress */}
        <div className="relative flex-shrink-0 w-28 h-28">
          <svg className="w-28 h-28 -rotate-90" viewBox="0 0 100 100">
            <circle
              cx="50"
              cy="50"
              r={radius}
              fill="none"
              stroke="currentColor"
              strokeWidth="8"
              className="text-surface-light"
            />
            <circle
              cx="50"
              cy="50"
              r={radius}
              fill="none"
              stroke="currentColor"
              strokeWidth="8"
              strokeDasharray={circumference}
              strokeDashoffset={offset}
              strokeLinecap="round"
              className={
                score >= 80
                  ? "text-green-500"
                  : score >= 50
                    ? "text-yellow-500"
                    : "text-red-500"
              }
            />
          </svg>
          <span className="absolute inset-0 flex items-center justify-center text-2xl font-bold text-text">
            {score}%
          </span>
        </div>

        {/* Checklist */}
        <ul className="space-y-2 flex-1 min-w-0">
          {checks.map((check) => (
            <li key={check.label} className="flex items-center gap-2 text-sm">
              {check.passed ? (
                <span className="text-green-500 flex-shrink-0">&#10003;</span>
              ) : (
                <span className="text-red-500 flex-shrink-0">&#10007;</span>
              )}
              <span className={check.passed ? "text-text-muted" : "text-text"}>
                {check.label}
              </span>
              {!check.passed && (
                <Link
                  href={check.link}
                  className="ml-auto text-xs text-primary hover:underline flex-shrink-0"
                >
                  Add now
                </Link>
              )}
            </li>
          ))}
        </ul>
      </div>
    </div>
  );
}