import { CodeBlock } from "../components/CodeBlock";
import { Callout } from "../components/Callout";
import { ApiEndpoint } from "../components/ApiEndpoint";
import { ParamTable } from "../components/ParamTable";

export function AdminCompliancePage() {
  return (
    <div>
      <h1 id="admin-compliance">Admin — Compliance</h1>
      <p>
        GDPR Article 30 processing registry, EU AI Act risk classification, and data subject
        rights (access and erasure).
      </p>

      <Callout type="info" title="Required role">
        Compliance endpoints require <code>admin</code> role. Auditors can read but not modify.
      </Callout>

      <h2 id="processing-registry">GDPR Article 30 — Processing Registry</h2>

      <ApiEndpoint method="GET" path="/v1/admin/compliance/entries" description="List all processing activities in the GDPR Art. 30 registry." />
      <ApiEndpoint method="POST" path="/v1/admin/compliance/entries" description="Create a new processing activity entry." />
      <ApiEndpoint method="GET" path="/v1/admin/compliance/entries/{id}" description="Get a specific processing entry." />
      <ApiEndpoint method="PUT" path="/v1/admin/compliance/entries/{id}" description="Update a processing activity entry." />

      <ParamTable
        title="Processing Entry Fields"
        params={[
          { name: "use_case_name", type: "string", required: true, description: "Name of the AI use case (e.g. 'Legal contract analysis')." },
          { name: "purpose", type: "string", required: true, description: "Processing purpose as required by GDPR Art. 5." },
          { name: "legal_basis", type: "string", required: true, description: "Legal basis: legitimate_interest | contract | legal_obligation | consent | vital_interests | public_task" },
          { name: "data_categories", type: "[]string", required: true, description: "Categories of personal data: name, email, phone, id_number, financial, health, etc." },
          { name: "retention_period", type: "string", required: true, description: "Data retention period (e.g. '3 years', '90 days')." },
          { name: "security_measures", type: "string", required: true, description: "Technical and organizational security measures." },
          { name: "controller_name", type: "string", required: true, description: "Data controller name and contact." },
          { name: "recipients", type: "[]string", required: false, description: "Third parties receiving the data." },
          { name: "processors", type: "[]string", required: false, description: "Data processors (LLM providers, cloud services)." },
          { name: "dpia_required", type: "boolean", required: false, default: "false", description: "Whether a DPIA (Art. 35) is required." },
        ]}
      />

      <CodeBlock
        language="bash"
        code={`curl -X POST http://localhost:8090/v1/admin/compliance/entries \\
  -H "Authorization: Bearer $TOKEN" \\
  -H "Content-Type: application/json" \\
  -d '{
    "use_case_name": "Legal contract analysis",
    "purpose": "Automated review of supplier contracts for risk identification",
    "legal_basis": "legitimate_interest",
    "data_categories": ["name", "financial", "company_data"],
    "retention_period": "3 years",
    "security_measures": "AES-256-GCM encryption, PII anonymization, audit logs",
    "controller_name": "Acme Corp — dpo@acme.com",
    "processors": ["Anthropic (Claude via Veylant IA proxy)"]
  }'`}
      />

      <h2 id="ai-act">EU AI Act Classification</h2>
      <ApiEndpoint method="POST" path="/v1/admin/compliance/entries/{id}/classify" description="Run the AI Act risk questionnaire for a processing entry and classify the risk level." />

      <CodeBlock
        language="bash"
        code={`curl -X POST http://localhost:8090/v1/admin/compliance/entries/entry-uuid/classify \\
  -H "Authorization: Bearer $TOKEN" \\
  -H "Content-Type: application/json" \\
  -d '{
    "autonomous_decisions": false,
    "biometric_data": false,
    "critical_infrastructure": false,
    "sensitive_data": true,
    "transparency_required": true
  }'

# Response:
{
  "risk_level": "limited",
  "score": 2,
  "description": "Limited risk — transparency obligations apply. Users must be informed they are interacting with an AI system.",
  "actions_required": [
    "Display AI disclosure in the user interface",
    "Document in GDPR Art. 30 registry",
    "Annual review recommended"
  ]
}`}
      />

      <p>Risk level mapping:</p>
      <div className="overflow-x-auto my-4">
        <table className="w-full text-sm border rounded-lg overflow-hidden">
          <thead>
            <tr className="bg-muted/50 border-b">
              <th className="text-left px-4 py-2.5 font-semibold">Score</th>
              <th className="text-left px-4 py-2.5 font-semibold">Level</th>
              <th className="text-left px-4 py-2.5 font-semibold">Description</th>
            </tr>
          </thead>
          <tbody>
            {[
              { score: "5", level: "Forbidden", desc: "System must not be deployed. Example: social scoring, real-time biometric surveillance in public spaces.", color: "text-red-600" },
              { score: "3–4", level: "High", desc: "Strict conformity assessment required before deployment. DPIA mandatory.", color: "text-orange-600" },
              { score: "1–2", level: "Limited", desc: "Transparency obligations: users must be informed they interact with AI.", color: "text-amber-600" },
              { score: "0", level: "Minimal", desc: "Minimal risk. Voluntary code of conduct recommended.", color: "text-green-600" },
            ].map((row) => (
              <tr key={row.level} className="border-b last:border-0">
                <td className="px-4 py-2.5 font-mono text-xs">{row.score}</td>
                <td className={`px-4 py-2.5 font-semibold text-xs ${row.color}`}>{row.level}</td>
                <td className="px-4 py-2.5 text-muted-foreground text-xs">{row.desc}</td>
              </tr>
            ))}
          </tbody>
        </table>
      </div>

      <h2 id="gdpr-rights">GDPR Subject Rights</h2>

      <h3 id="access">Article 15 — Right of Access</h3>
      <ApiEndpoint method="GET" path="/v1/admin/compliance/gdpr/access/{user_id}" description="Return all personal data stored for a specific user (prompt history, audit entries, pseudonymization mappings)." />
      <CodeBlock
        language="bash"
        code={`curl http://localhost:8090/v1/admin/compliance/gdpr/access/user-uuid \\
  -H "Authorization: Bearer $TOKEN"

# Returns: audit entries, PII mapping references, user profile data`}
      />

      <h3 id="erasure">Article 17 — Right to Erasure</h3>
      <ApiEndpoint method="POST" path="/v1/admin/compliance/gdpr/erase/{user_id}" description="Pseudonymize or delete all personal data for a user. Audit log metadata is retained but PII is scrubbed." />
      <CodeBlock
        language="bash"
        code={`curl -X POST http://localhost:8090/v1/admin/compliance/gdpr/erase/user-uuid \\
  -H "Authorization: Bearer $TOKEN" \\
  -H "Content-Type: application/json" \\
  -d '{"reason": "User request under GDPR Art. 17"}'`}
      />
      <Callout type="warning" title="ClickHouse is append-only">
        ClickHouse audit logs cannot be deleted. The erasure endpoint scrubs PII from prompt
        content and pseudonymizes user identifiers, but the request metadata (token counts, cost,
        timestamps) is retained for compliance reporting.
      </Callout>
    </div>
  );
}
