import type { GeneratedDocs } from "@codeboard/shared";
import { notFound } from "next/navigation";
import { Github, ArrowLeft } from "lucide-react";
import Link from "next/link";

async function fetchDocs(id: string): Promise<GeneratedDocs | null> {
  try {
    const baseUrl = process.env.NEXT_PUBLIC_APP_URL || "http://localhost:3000";
    const response = await fetch(`${baseUrl}/api/docs/${id}`, {
      cache: "no-store",
    });

    if (!response.ok) {
      return null;
    }

    return response.json();
  } catch {
    return null;
  }
}

export default async function DocsPage({
  params,
}: {
  params: { id: string };
}) {
  const docs = await fetchDocs(params.id);

  if (!docs) {
    notFound();
  }

  return (
    <div className="min-h-screen">
      <div className="border-b border-white/10 bg-black/20">
        <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-20">
          <div className="text-center mb-12">
            <h1 className="text-2xl sm:text-3xl font-bold text-white">
              Analyzing Repository
            </h1>
            <p className="text-zinc-400 max-w-xl mx-auto">
              {docs.repoName || repoUrl || "Unknown repository"}
            </p>
          </div>
          
          <div className="relative inline-flex items-center justify-center w-16 h-16 rounded-2xl glass border-white/10">
            <Github className="w-6 h-6 text-zinc-400" />
          </div>
        </div>
      </div>
    </div>
  );
}