import { notFound } from "next/navigation";
import { ArchitectPortrait } from "@/components/site/architect-portrait";
import {
  ProseBlock,
  SiteClosingCta,
  SiteEmptyState,
  SitePageHero,
  SiteSection,
  SiteShell,
  SiteLink,
} from "@/components/site/site-shell";
import { getStorage } from "@/core/storage/storage";
import { resolveRequestTenant } from "@/core/tenant/request-tenant";
import { listPublishedAwards } from "@/services/award-service";
import { getArchitectProfile } from "@/services/profile-service";
import { listPublishedTeam } from "@/services/team-service";

export default async function TenantAboutPage() {
  const resolved = await resolveRequestTenant();
  if (!resolved.ok) notFound();

  const storage = getStorage();
  const [{ profile }, awards, team] = await Promise.all([
    getArchitectProfile(resolved.context),
    listPublishedAwards(resolved.context),
    listPublishedTeam(resolved.context),
  ]);

  const about = profile?.about;
  const architectPhotoSrc = profile?.architectPhotoStorageKey
    ? `${await storage.getSignedUrl(
        profile.architectPhotoStorageKey,
        resolved.context.tenantId,
      )}&t=${profile.updatedAt?.getTime?.() ?? 0}`
    : null;
  const hasArchitect =
    Boolean(profile?.architectName) ||
    Boolean(profile?.architectTitle) ||
    Boolean(architectPhotoSrc);
  const hasProse = Boolean(
    profile?.philosophy ||
      profile?.vision ||
      profile?.mission ||
      profile?.approach ||
      profile?.designPrinciples ||
      profile?.experience,
  );

  return (
    <SiteShell
      studioName={resolved.context.studioName}
      location={profile?.location}
      active="about"
    >
      <main>
        <SitePageHero
          eyebrow="Practice"
          title="About"
          description={[
            resolved.context.studioName,
            profile?.location,
            profile?.foundedYear ? `Est. ${profile.foundedYear}` : null,
          ]
            .filter(Boolean)
            .join(" · ")}
        />

        {about ? (
          <SiteSection eyebrow="Studio" title="Introduction">
            <p className="max-w-3xl whitespace-pre-wrap text-lg leading-8 text-[var(--archi-ink)]/85 sm:text-xl sm:leading-9">
              {about}
            </p>
          </SiteSection>
        ) : null}

        {hasArchitect ? (
          <SiteSection eyebrow="Leadership" title="Architect" dark>
            <div className="flex flex-col gap-8 sm:flex-row sm:items-end sm:gap-12">
              <ArchitectPortrait
                photoSrc={architectPhotoSrc}
                name={profile?.architectName}
                title={profile?.architectTitle}
                size="section"
                tone="dark"
              />
              <div>
                {profile?.architectName ? (
                  <p className="font-[family-name:var(--font-display)] text-4xl tracking-tight sm:text-5xl">
                    {profile.architectName}
                  </p>
                ) : null}
                {profile?.architectTitle ? (
                  <p className="mt-4 text-sm tracking-[0.2em] text-[var(--archi-gold)] uppercase">
                    {profile.architectTitle}
                  </p>
                ) : null}
              </div>
            </div>
          </SiteSection>
        ) : null}

        {hasProse ? (
          <section className="border-b border-[var(--archi-line)]">
            <div className="studio-container py-16 lg:py-20">
              <ProseBlock title="Philosophy" body={profile?.philosophy} />
              <ProseBlock title="Vision" body={profile?.vision} />
              <ProseBlock title="Mission" body={profile?.mission} />
              <ProseBlock title="Approach" body={profile?.approach} />
              <ProseBlock
                title="Design principles"
                body={profile?.designPrinciples}
              />
              <ProseBlock title="Experience" body={profile?.experience} />
            </div>
          </section>
        ) : null}

        {awards.length > 0 ? (
          <SiteSection
            eyebrow="Recognition"
            title="Awards"
            action={
              <SiteLink
                href="/awards"
                className="text-sm text-[var(--archi-ink-muted)] transition hover:text-[var(--archi-ink)]"
              >
                View all →
              </SiteLink>
            }
          >
            <ul className="grid gap-8 sm:grid-cols-2 lg:grid-cols-3">
              {awards.slice(0, 3).map((award) => (
                <li key={award.id}>
                  <p className="text-xs tracking-[0.2em] text-[var(--archi-gold)] uppercase">
                    {[award.year, award.organization].filter(Boolean).join(" · ")}
                  </p>
                  <p className="mt-3 font-[family-name:var(--font-display)] text-2xl tracking-tight">
                    {award.title}
                  </p>
                </li>
              ))}
            </ul>
          </SiteSection>
        ) : null}

        {team.length > 0 ? (
          <SiteSection
            eyebrow="People"
            title="Team"
            dark
            action={
              <SiteLink
                href="/team"
                className="text-sm text-white/50 transition hover:text-white"
              >
                View all →
              </SiteLink>
            }
          >
            <ul className="grid gap-8 sm:grid-cols-2 lg:grid-cols-3">
              {team.slice(0, 3).map((member) => (
                <li key={member.id}>
                  <SiteLink href={`/team/${member.slug}`} className="group block">
                    <p className="font-[family-name:var(--font-display)] text-2xl transition group-hover:opacity-70">
                      {member.name}
                    </p>
                    {member.role ? (
                      <p className="mt-2 text-sm text-white/45">{member.role}</p>
                    ) : null}
                  </SiteLink>
                </li>
              ))}
            </ul>
          </SiteSection>
        ) : null}

        {!about && !hasArchitect && !hasProse && awards.length === 0 && team.length === 0 ? (
          <section className="studio-container py-16 sm:py-20">
            <SiteEmptyState
              title="Studio story forthcoming"
              description={`${resolved.context.studioName} will publish philosophy, leadership, and practice notes here.`}
            />
          </section>
        ) : null}

        <SiteClosingCta studioName={resolved.context.studioName} />
      </main>
    </SiteShell>
  );
}