import { Card, CardContent, CardHeader, CardTitle, CardDescription } from "@/components/ui/card";
import { Button } from "@/components/ui/button";
import { Link } from "react-router-dom";
import { Lock, Users, GitBranch } from "lucide-react";

export default function DocsPartnerProposal() {
  return (
    <div className="space-y-8">
      <section>
        <h2 className="text-3xl font-semibold text-white">Partner Docs & Gated Area Proposal</h2>
        <p className="text-gray-300 max-w-3xl">This document outlines a proposal for a gated partner documentation area, intended for partners and external integrators who require more detailed API and integration guides than the public docs expose. The gated area will be accessible to approved partners after authentication and agreement to terms.</p>
      </section>

      <section className="grid gap-6 lg:grid-cols-2">
        <Card className="bg-slate-900/60 border-slate-700">
          <CardHeader>
            <CardTitle className="text-white">Scope</CardTitle>
            <CardDescription className="text-gray-300">Content that belongs in the gated partner area</CardDescription>
          </CardHeader>
          <CardContent>
            <ul className="list-disc pl-6 space-y-2 text-sm text-gray-300">
              <li>Partner API endpoints and sample requests that include partner keys or elevated scopes.</li>
              <li>Operational integration instructions (webhooks, role mappings, admin endpoints).</li>
              <li>Deployment scripts, secrets management guidance (redacted for public), and verification flows.</li>
              <li>Commercial and SLA information, onboarding steps for partner accounts.</li>
            </ul>
          </CardContent>
        </Card>

        <Card className="bg-slate-900/60 border-slate-700">
          <CardHeader>
            <CardTitle className="text-white">Access & Workflow</CardTitle>
            <CardDescription className="text-gray-300">How partners request and receive access</CardDescription>
          </CardHeader>
          <CardContent>
            <ol className="list-decimal pl-6 space-y-2 text-sm text-gray-300">
              <li>Partner signs NDA and registers interest via sales team.</li>
              <li>Docs team creates a partner account and assigns a partner role in Supabase.</li>
              <li>Partner gets access to the gated docs area (passwordless SSO or invite link).</li>
              <li>Partner changes and feedback are managed via Support or a private Builder space.</li>
            </ol>
            <div className="mt-4">
              <Button asChild>
                <Link to="/internal-docs/onboarding" className="inline-flex items-center gap-2">View Internal Onboarding <GitBranch className="h-4 w-4" /></Link>
              </Button>
            </div>
          </CardContent>
        </Card>
      </section>

      <section>
        <Card className="bg-slate-900/60 border-slate-700">
          <CardHeader>
            <CardTitle className="text-white">Security & Controls</CardTitle>
            <CardDescription className="text-gray-300">Minimum controls for gated content</CardDescription>
          </CardHeader>
          <CardContent>
            <ul className="list-disc pl-6 space-y-2 text-sm text-gray-300">
              <li>Partner accounts are RBAC-limited and issued short-lived credentials for API testing.</li>
              <li>Audit logs for partner doc accesses are retained and reviewed monthly.</li>
              <li>Automation prevents copying internal operational docs into public pages; editors must follow the PR checklist.</li>
            </ul>
          </CardContent>
        </Card>
      </section>

      <section>
        <Card className="bg-slate-900/60 border-slate-700">
          <CardHeader>
            <CardTitle className="text-white">Next steps</CardTitle>
          </CardHeader>
          <CardContent>
            <ul className="list-disc pl-6 space-y-2 text-sm text-gray-300">
              <li>Implement partner role and gated content routing (Auth + middleware).</li>
              <li>Create Builder space for partner docs drafts and approval workflow.</li>
              <li>Update CI to only publish public docs from <code>code/client/pages/docs</code> and prevent internal docs from being included.</li>
            </ul>
          </CardContent>
        </Card>
      </section>
    </div>
  );
}