import React, { useEffect, useState } from "react";

import { Alert, Box, Button, Paper, Typography } from "@mui/material";

import { api } from "../api";

type SummarizerMetrics = {
  healthy: boolean;
  model?: string | null;
  healthLatencyMs?: number | null;
  probeLatencyMs?: number | null;
  lastProbeAt?: string | null;
  lastProbeSuccessAt?: string | null;
  lastProbeFailureAt?: string | null;
  probeFailures: number;
  requests: number;
  cacheHits: number;
  cacheMisses: number;
  failures: number;
  averageLatencyMs?: number | null;
  lastError?: string | null;
};

type SystemStatus = {
  environment: string;
  contentRoot: string;
  version: string;
  commitSha?: string | null;
  buildStamp?: string | null;
  storage: {
    dataRoot: string;
    dbPath: string;
    dbExists: boolean;
    dbSizeBytes?: number | null;
    companyCount: number;
    jobCount: number;
    deletedCount: number;
  };
  email: {
    enabled: boolean;
    host?: string | null;
    port: number;
    enableSsl: boolean;
    from?: string | null;
    fromName?: string | null;
  };
  summarizer: SummarizerMetrics;
};

function formatBytes(bytes?: number | null) {
  if (bytes == null) return "-";
  if (bytes < 1024) return `${bytes} B`;
  if (bytes < 1024 * 1024) return `${(bytes / 1024).toFixed(1)} KB`;
  return `${(bytes / (1024 * 1024)).toFixed(1)} MB`;
}

function displayMetadata(value?: string | null) {
  return value && value.trim().length > 0 ? value : "-";
}

export default function AdminSystemPage() {
  const [status, setStatus] = useState<SystemStatus | null>(null);
  const [loading, setLoading] = useState(false);
  const [runningProbe, setRunningProbe] = useState(false);
  const [error, setError] = useState<string | null>(null);

  const load = async () => {
    setLoading(true);
    setError(null);
    try {
      const res = await api.get<SystemStatus>("/admin/system");
      setStatus(res.data);
    } catch (e: any) {
      setError(e?.response?.data || e?.message || "Failed to load system status.");
      setStatus(null);
    } finally {
      setLoading(false);
    }
  };

  useEffect(() => {
    void load();
  }, []);

  return (
    <Box sx={{ display: "flex", flexDirection: "column", gap: 2 }}>
      <Box sx={{ display: "flex", justifyContent: "space-between", gap: 2, alignItems: "center", flexWrap: "wrap" }}>
        <Box>
          <Typography variant="h5" sx={{ fontWeight: 950 }}>System status</Typography>
          <Typography sx={{ color: "text.secondary" }}>Quick operational view of storage, email, and summarizer health.</Typography>
        </Box>
        <Box sx={{ display: "flex", gap: 1, flexWrap: "wrap" }}>
          <Button
            variant="outlined"
            onClick={async () => {
              setRunningProbe(true);
              setError(null);
              try {
                await api.post("/admin/system/summarizer/probe");
                await load();
              } catch (e: any) {
                setError(e?.response?.data || e?.message || "Failed to run summarizer probe.");
              } finally {
                setRunningProbe(false);
              }
            }}
            disabled={loading || runningProbe}
          >
            {runningProbe ? "Running probe..." : "Run probe now"}
          </Button>
          <Button variant="contained" onClick={() => void load()} disabled={loading}>
            {loading ? "Refreshing..." : "Refresh"}
          </Button>
        </Box>
      </Box>

      {error ? <Alert severity="error">{error}</Alert> : null}

      <Box sx={{ display: "grid", gridTemplateColumns: { xs: "1fr", md: "repeat(4, 1fr)" }, gap: 2 }}>
        <Paper sx={{ p: 2 }}>
          <Typography variant="overline" sx={{ color: "text.secondary" }}>Environment</Typography>
          <Typography variant="h5" sx={{ fontWeight: 950 }}>{status?.environment ?? "-"}</Typography>
          <Typography variant="body2" sx={{ color: "text.secondary", mt: 1 }}>Version {displayMetadata(status?.version)}</Typography>
          <Typography variant="body2" sx={{ color: "text.secondary" }}>Commit {displayMetadata(status?.commitSha)}</Typography>
          <Typography variant="body2" sx={{ color: "text.secondary" }}>{displayMetadata(status?.buildStamp)}</Typography>
        </Paper>
        <Paper sx={{ p: 2 }}>
          <Typography variant="overline" sx={{ color: "text.secondary" }}>Database</Typography>
          <Typography variant="h5" sx={{ fontWeight: 950 }}>{status?.storage.dbExists ? "Ready" : "Missing"}</Typography>
          <Typography variant="body2" sx={{ color: "text.secondary", mt: 1 }}>{formatBytes(status?.storage.dbSizeBytes)}</Typography>
        </Paper>
        <Paper sx={{ p: 2 }}>
          <Typography variant="overline" sx={{ color: "text.secondary" }}>SMTP</Typography>
          <Typography variant="h5" sx={{ fontWeight: 950 }}>{status?.email.enabled ? "Enabled" : "Disabled"}</Typography>
          <Typography variant="body2" sx={{ color: "text.secondary", mt: 1 }}>{status?.email.host || "No SMTP host configured"}</Typography>
        </Paper>
        <Paper sx={{ p: 2 }}>
          <Typography variant="overline" sx={{ color: "text.secondary" }}>Summarizer</Typography>
          <Typography variant="h5" sx={{ fontWeight: 950 }}>{status?.summarizer.healthy ? "Healthy" : "Offline"}</Typography>
          <Typography variant="body2" sx={{ color: "text.secondary", mt: 1 }}>
            {status?.summarizer.probeLatencyMs != null
              ? `${status.summarizer.probeLatencyMs} ms probe`
              : status?.summarizer.healthLatencyMs != null
                ? `${status.summarizer.healthLatencyMs} ms health`
                : "No latency data"}
          </Typography>
        </Paper>
      </Box>

      <Box sx={{ display: "grid", gridTemplateColumns: { xs: "1fr", lg: "1fr 1fr" }, gap: 2 }}>
        <Paper sx={{ p: 2 }}>
          <Typography variant="h6" sx={{ fontWeight: 900, mb: 1 }}>Storage</Typography>
          <Typography variant="body2"><strong>Data root:</strong> {status?.storage.dataRoot || "-"}</Typography>
          <Typography variant="body2"><strong>DB path:</strong> {status?.storage.dbPath || "-"}</Typography>
          <Typography variant="body2"><strong>Companies:</strong> {status?.storage.companyCount ?? 0}</Typography>
          <Typography variant="body2"><strong>Jobs:</strong> {status?.storage.jobCount ?? 0}</Typography>
          <Typography variant="body2"><strong>Deleted jobs:</strong> {status?.storage.deletedCount ?? 0}</Typography>
          <Typography variant="body2"><strong>Content root:</strong> {status?.contentRoot || "-"}</Typography>
        </Paper>

        <Paper sx={{ p: 2 }}>
          <Typography variant="h6" sx={{ fontWeight: 900, mb: 1 }}>Email</Typography>
          <Typography variant="body2"><strong>From:</strong> {status?.email.from || "-"}</Typography>
          <Typography variant="body2"><strong>From name:</strong> {status?.email.fromName || "-"}</Typography>
          <Typography variant="body2"><strong>Host:</strong> {status?.email.host || "-"}</Typography>
          <Typography variant="body2"><strong>Port:</strong> {status?.email.port ?? "-"}</Typography>
          <Typography variant="body2"><strong>SSL:</strong> {status?.email.enableSsl ? "Yes" : "No"}</Typography>
        </Paper>
      </Box>

      <Paper sx={{ p: 2 }}>
        <Typography variant="h6" sx={{ fontWeight: 900, mb: 1 }}>Summarizer telemetry</Typography>
        <Box sx={{ display: "grid", gridTemplateColumns: { xs: "1fr", md: "repeat(5, 1fr)" }, gap: 2 }}>
          <Box>
            <Typography variant="overline" sx={{ color: "text.secondary" }}>Requests</Typography>
            <Typography variant="h6" sx={{ fontWeight: 900 }}>{status?.summarizer.requests ?? 0}</Typography>
          </Box>
          <Box>
            <Typography variant="overline" sx={{ color: "text.secondary" }}>Cache hits</Typography>
            <Typography variant="h6" sx={{ fontWeight: 900 }}>{status?.summarizer.cacheHits ?? 0}</Typography>
          </Box>
          <Box>
            <Typography variant="overline" sx={{ color: "text.secondary" }}>Failures</Typography>
            <Typography variant="h6" sx={{ fontWeight: 900 }}>{status?.summarizer.failures ?? 0}</Typography>
          </Box>
          <Box>
            <Typography variant="overline" sx={{ color: "text.secondary" }}>Avg latency</Typography>
            <Typography variant="h6" sx={{ fontWeight: 900 }}>{status?.summarizer.averageLatencyMs != null ? `${status.summarizer.averageLatencyMs} ms` : "-"}</Typography>
          </Box>
          <Box>
            <Typography variant="overline" sx={{ color: "text.secondary" }}>Probe latency</Typography>
            <Typography variant="h6" sx={{ fontWeight: 900 }}>{status?.summarizer.probeLatencyMs != null ? `${status.summarizer.probeLatencyMs} ms` : "-"}</Typography>
          </Box>
        </Box>
        <Typography variant="body2" sx={{ mt: 1 }}><strong>Probe failures:</strong> {status?.summarizer.probeFailures ?? 0}</Typography>
        {status?.summarizer.lastError ? <Alert severity="warning" sx={{ mt: 2 }}>{status.summarizer.lastError}</Alert> : null}
      </Paper>
    </Box>
  );
}