import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { Box, Text } from "ink";
import { CacheEfficiencyNotice } from "./CacheEfficiencyNotice.js";
import { Pane } from "./design/Pane.js";
import { ProgressBar } from "./design/ProgressBar.js";
import { StatusIcon } from "./design/StatusIcon.js";
export function CachePanel(props) {
    const model = buildCachePanelModel(props.cache);
    return (_jsxs(Pane, { width: 42, title: "DeepSeek cache", tone: "brand", children: [_jsxs(Box, { flexDirection: "row", children: [_jsx(StatusIcon, { state: model.status, withSpace: true }), _jsx(Text, { children: model.headline })] }), _jsx(ProgressBar, { ratio: model.ratio, width: 24, showPercent: true }), _jsx(Text, { color: "gray", children: model.detail }), _jsx(CacheEfficiencyNotice, { cache: props.cache })] }));
}
export function buildCachePanelModel(cache) {
    const total = cache.hitTokens + cache.missTokens;
    const ratio = total > 0 ? cache.hitTokens / total : parsePercentRatio(cache.rate);
    const status = total === 0 ? "pending" : ratio >= 0.5 ? "success" : "warning";
    return {
        ratio,
        status,
        headline: total === 0 ? "waiting for provider telemetry" : `cache hit ${cache.rate}`,
        detail: `hit ${cache.hitTokens} / miss ${cache.missTokens} / runs ${cache.observedRuns}`,
    };
}
export function parsePercentRatio(value) {
    const match = value.trim().match(/^(\d+(?:\.\d+)?)%$/);
    if (!match)
        return 0;
    const percent = Number(match[1]);
    if (!Number.isFinite(percent))
        return 0;
    return Math.max(0, Math.min(1, percent / 100));
}
