import { useState } from "react";
import { Card, CardBody, CardHeader, Divider } from "@heroui/react";
import RoundEvaluationOverrides from "@/components/RoundEvaluationOverrides";
import RoundEvaluationQsoOverrides from "@/components/RoundEvaluationQsoOverrides";
import RoundEvaluationLogOverrides from "@/components/RoundEvaluationLogOverrides";
import EvaluationStatusSummary from "@/components/EvaluationStatusSummary";
import EvaluationActions from "@/components/EvaluationActions";
import EvaluationEventsList from "@/components/EvaluationEventsList";
import EvaluationHistoryPanel from "@/components/EvaluationHistoryPanel";
import EvaluationStepsList from "@/components/EvaluationStepsList";
import useRoundEvaluationRun from "@/hooks/useRoundEvaluationRun";
import { useTranslation } from "react-i18next";

type RoundEvaluationPanelProps = {
    roundId: number | null;
};

export default function RoundEvaluationPanel({ roundId }: RoundEvaluationPanelProps) {
    const { t } = useTranslation("common");
    const {
        run,
        runs,
        events,
        loading,
        actionLoading,
        message,
        error,
        hasLoaded,
        canStart,
        canResume,
        canCancel,
        isOfficialRun,
        currentStepIndex,
        isSucceeded,
        stepProgressPercent,
        formatEventTime,
        handleStart,
        handleStartIncremental,
        handleResume,
        handleCancel,
        handleSetResultType,
    } = useRoundEvaluationRun(roundId);
    const [historyOpen, setHistoryOpen] = useState(false);


    return (
        <Card className="mt-4">
            <CardHeader>
                <span className="text-md font-semibold">Vyhodnocování kola</span>
            </CardHeader>
            <Divider />
            <CardBody className="grid gap-4 md:grid-cols-1">
                <div className="grid gap-4 md:grid-cols-2">
                    <div className="space-y-3">
                        <EvaluationStatusSummary
                            loading={loading}
                            hasLoaded={hasLoaded}
                            run={run}
                            isOfficialRun={isOfficialRun}
                            stepProgressPercent={stepProgressPercent}
                        />
                        <EvaluationActions
                            canStart={canStart}
                            canStartIncremental={canStart}
                            canResume={canResume}
                            canCancel={!!canCancel}
                            actionLoading={actionLoading}
                            message={message}
                            error={error}
                            onStart={handleStart}
                            onStartIncremental={handleStartIncremental}
                            onResume={handleResume}
                            onCancel={handleCancel}
                        />
                        <div className="text-xs text-foreground-500">
                            {t("evaluation_incremental_hint") ?? "Spustit znovu převezme overrides z posledního běhu."}
                        </div>
                        {run && isSucceeded && (
                            <div className="flex flex-wrap gap-2 text-sm">
                                <span className="font-semibold">Označit výsledky:</span>
                                <button
                                    type="button"
                                    className={[
                                        "rounded border px-2 py-1 hover:bg-foreground-100",
                                        run.result_type === "TEST"
                                            ? "border-foreground-400 bg-foreground-100 font-semibold"
                                            : "border-divider",
                                    ].join(" ")}
                                    onClick={() => handleSetResultType("TEST")}
                                    disabled={actionLoading}
                                >
                                    Testovací
                                </button>
                                <button
                                    type="button"
                                    className={[
                                        "rounded border px-2 py-1 hover:bg-foreground-100",
                                        run.result_type === "PRELIMINARY"
                                            ? "border-foreground-400 bg-foreground-100 font-semibold"
                                            : "border-divider",
                                    ].join(" ")}
                                    onClick={() => handleSetResultType("PRELIMINARY")}
                                    disabled={actionLoading}
                                >
                                    Předběžné
                                </button>
                                <button
                                    type="button"
                                    className={[
                                        "rounded border px-2 py-1 hover:bg-foreground-100",
                                        run.result_type === "FINAL"
                                            ? "border-foreground-400 bg-foreground-100 font-semibold"
                                            : "border-divider",
                                    ].join(" ")}
                                    onClick={() => handleSetResultType("FINAL")}
                                    disabled={actionLoading}
                                >
                                    Finální
                                </button>
                            </div>
                        )}
                        <EvaluationEventsList events={events} formatEventTime={formatEventTime} />
                    </div>
                    <div className="space-y-2 text-sm text-foreground-700">
                        <EvaluationHistoryPanel
                            runs={runs}
                            historyOpen={historyOpen}
                            onToggle={() => setHistoryOpen((prev) => !prev)}
                            formatEventTime={formatEventTime}
                        />
                        <EvaluationStepsList
                            run={run}
                            isOfficialRun={isOfficialRun}
                            currentStepIndex={currentStepIndex}
                            isSucceeded={isSucceeded}
                        />
                    </div>
                </div>
                <div>
                    {run?.status === "WAITING_REVIEW_INPUT" && (
                        <RoundEvaluationOverrides roundId={roundId} evaluationRunId={run.id} />
                    )}
                    {run?.status === "WAITING_REVIEW_MATCH" && (
                        <RoundEvaluationQsoOverrides roundId={roundId} evaluationRunId={run.id} />
                    )}
                    {run?.status === "WAITING_REVIEW_SCORE" && (
                        <RoundEvaluationLogOverrides roundId={roundId} evaluationRunId={run.id} />
                    )}
                </div>
            </CardBody>
        </Card>
    );
}