import { prisma } from "@/lib/prisma";
import BackButton from "@/app/components/BackButton";
import AwemeDetailClient from "./Client";

function ms(v?: number | null) {
  if (!v) return "";
  const s = Math.round(v / 1000);
  const m = Math.floor(s / 60);
  const r = s % 60;
  return `${m}:${r.toString().padStart(2, "0")}`;
}

export default async function AwemeDetail({ params }: { params: Promise<{ awemeId: string }> }) {
  const id = (await params).awemeId;

  const [video, post] = await Promise.all([
    prisma.video.findUnique({
      where: { aweme_id: id },
      include: { author: true, comments: { orderBy: { created_at: "desc" }, include: { user: true }, take: 50 } },
    }),
    prisma.imagePost.findUnique({
      where: { aweme_id: id },
      include: { author: true, images: { orderBy: { order: "asc" } }, comments: { orderBy: { created_at: "desc" }, include: { user: true }, take: 50 } },
    })
  ]);

  if (!video && !post) return <main className="p-8">找不到该作品</main>;

  const isVideo = !!video;
  const data = isVideo
    ? {
        type: "video" as const,
        aweme_id: video!.aweme_id,
        desc: video!.desc,
        created_at: video!.created_at,
        duration_ms: video!.duration_ms,
        video_url: video!.video_url,
        width: video!.width ?? null,
        height: video!.height ?? null,
        author: { nickname: video!.author.nickname, avatar_url: video!.author.avatar_url },
        comments: video!.comments.map((c) => ({
          cid: c.cid,
          text: c.text,
          created_at: c.created_at,
          digg_count: c.digg_count,
          user: { nickname: c.user.nickname, avatar_url: c.user.avatar_url },
        })),
      }
    : {
        type: "image" as const,
        aweme_id: post!.aweme_id,
        desc: post!.desc,
        created_at: post!.created_at,
        images: post!.images.map((i) => ({ id: i.id, url: i.url, width: i.width ?? undefined, height: i.height ?? undefined })),
        music_url: post!.music_url,
        author: { nickname: post!.author.nickname, avatar_url: post!.author.avatar_url },
        comments: post!.comments.map((c) => ({
          cid: c.cid,
          text: c.text,
          created_at: c.created_at,
          digg_count: c.digg_count,
          user: { nickname: c.user.nickname, avatar_url: c.user.avatar_url },
        })),
      };

  return (
    <main className="min-h-screen w-full overflow-hidden">
      {/* 顶部条改为悬浮在媒体区域之上，避免 sticky 造成 Y 方向滚动条 */}
      <div className="fixed left-3 top-3 z-30">
        <BackButton
          hrefFallback="/"
          className="inline-flex items-center justify-center w-9 h-9 rounded-full bg-white/15 text-white border border-white/20 backdrop-blur hover:bg-white/25"
        />
      </div>
      <AwemeDetailClient data={data as any} />
    </main>
  );
}

export const dynamic = "force-dynamic";