import { Activity, Square, Zap } from "lucide-react";
import { Link } from "react-router-dom";
import type { App } from "@/types/appops";
import { ActionButton } from "@/components/PolicyAction";
import { Button } from "@/components/ui/button";
import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";

export const AppDetailActionPanel = ({
  app,
  lifecycleBusy,
  onRestart,
  onRequestRestartApproval,
}: {
  app: App;
  lifecycleBusy: boolean;
  onRestart: () => void;
  onRequestRestartApproval: () => void;
}) => (
  <div className="grid grid-cols-1 gap-6 md:grid-cols-2 lg:grid-cols-3 2xl:grid-cols-4">
    <Card className="border-slate-800 bg-slate-900/50">
      <CardHeader><CardTitle className="text-sm font-bold text-white">Lifecycle</CardTitle></CardHeader>
      <CardContent className="space-y-2">
        <ActionButton decision={app.protected ? "approval_required" : "allowed"} risk={app.criticality} label={lifecycleBusy ? "Bezig..." : "Restart Container"} disabled={lifecycleBusy} onExecute={onRestart} onRequestApproval={onRequestRestartApproval} className="w-full justify-start" />
        <Button disabled title="Stop container is niet beschikbaar in AppOps V1" variant="outline" className="w-full cursor-not-allowed justify-start border-slate-800 bg-slate-950 text-slate-500"><Square className="mr-2 h-4 w-4" /> Stop Container</Button>
      </CardContent>
    </Card>
    <Card className="border-slate-800 bg-slate-900/50">
      <CardHeader><CardTitle className="text-sm font-bold text-white">Maintenance</CardTitle></CardHeader>
      <CardContent className="space-y-2">
        <Button asChild variant="outline" className="w-full justify-start border-slate-800 bg-slate-950 text-slate-200"><Link to="/connectors"><Activity className="mr-2 h-4 w-4" /> Test via Connectors</Link></Button>
        <Button disabled title="Cache clearing is niet beschikbaar in AppOps V1" variant="outline" className="w-full cursor-not-allowed justify-start border-slate-800 bg-slate-950 text-slate-500"><Zap className="mr-2 h-4 w-4" /> Clear Cache</Button>
      </CardContent>
    </Card>
    <Card className="border-rose-500/20 bg-rose-500/5">
      <CardHeader><CardTitle className="text-sm font-bold text-rose-500">Danger Zone</CardTitle></CardHeader>
      <CardContent className="space-y-2">
        <ActionButton decision="blocked" risk="critical" label="Delete Data Volume" variant="outline" className="w-full justify-start border-rose-500/20 text-rose-500/50" />
        <ActionButton decision="blocked" risk="critical" label="Remove Application" variant="outline" className="w-full justify-start border-rose-500/20 text-rose-500/50" />
      </CardContent>
    </Card>
  </div>
);