"use client";

import { Badge, Button } from "@/components/ui";
import type { Workload, WorkloadAction } from "@/lib/api";

/*
 * Container and unit states are kept in their own vocabularies on purpose — a
 * failed unit and an exited container mean different things. Colour never
 * carries the state on its own: Badge already pairs a dot with the word.
 */
function stateVariant(w: Workload): "success" | "warning" | "danger" | "neutral" {
    if (w.kind === "container") {
        switch (w.state) {
            case "running":
                return w.health === "unhealthy" ? "danger" : "success";
            case "restarting":
            case "paused":
            case "created":
                return "warning";
            case "dead":
            case "exited":
                return "danger";
            default:
                return "neutral";
        }
    }
    switch (w.state) {
        case "active":
            return "success";
        case "activating":
        case "reloading":
            return "warning";
        case "failed":
            return "danger";
        case "inactive":
            return "neutral";
        default:
            return "neutral";
    }
}

const ACTIONS: WorkloadAction[] = ["start", "stop", "restart"];

export function WorkloadRow({
    workload,
    canControl,
    busy,
    onAction,
    onLogs,
}: {
    workload: Workload;
    canControl: boolean;
    busy: boolean;
    onAction: (action: WorkloadAction) => void;
    onLogs: () => void;
}) {
    const w = workload;

    return (
        <div className="flex flex-col gap-3 border-b border-border px-6 py-3 last:border-b-0 sm:flex-row sm:items-center sm:justify-between">
            <div className="min-w-0">
                <div className="flex flex-wrap items-center gap-2">
                    <span className="truncate font-mono text-sm text-text-primary">{w.name}</span>
                    <Badge variant={stateVariant(w)}>{w.state}</Badge>
                    {w.health && <Badge variant={w.health === "healthy" ? "success" : "warning"}>{w.health}</Badge>}
                    {!!w.restarts && w.restarts > 0 && <Badge variant="warning">{w.restarts} restarts</Badge>}
                </div>
                <p className="mt-1 truncate text-xs text-text-secondary">
                    {w.kind === "container" ? w.image || "no image" : "systemd unit"}
                    {w.ports && w.ports.length > 0 && <span className="ml-2 font-mono">{w.ports.join(" ")}</span>}
                </p>
            </div>

            <div className="flex shrink-0 flex-wrap items-center gap-2">
                {canControl &&
                    ACTIONS.map((a) => (
                        <Button
                            key={a}
                            size="sm"
                            variant={a === "stop" ? "danger" : "secondary"}
                            /* Protected rows show the action disabled with the
                               reason rather than offering a button whose refusal
                               the agent has already told us about. */
                            disabled={w.protected || busy}
                            title={w.protected ? "This workload runs the Vantage agent and cannot be controlled from here" : undefined}
                            onClick={() => onAction(a)}
                        >
                            {a}
                        </Button>
                    ))}
                {canControl && (
                    <Button size="sm" variant="ghost" onClick={onLogs}>
                        Logs
                    </Button>
                )}
            </div>
        </div>
    );
}
