"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.default = Header;
const tslib_1 = require("tslib");
const jsx_runtime_1 = require("react/jsx-runtime");
const lucide_react_native_1 = require("lucide-react-native");
const react_native_1 = require("react-native");
const zero = tslib_1.__importStar(require("../../ui"));
const { bg, r, borders, px, py, text, layout, gap } = zero;
function MetricItem({ icon: Icon, label, value, status }) {
    const statusColors = {
        good: text.green[400],
        warning: text.yellow[400],
        error: text.red[400],
    };
    const statusColor = status ? statusColors[status] : text.gray[300];
    return ((0, jsx_runtime_1.jsxs)(react_native_1.View, { style: [layout.flex.row, layout.flex.alignCenter, gap.all[2]], children: [(0, jsx_runtime_1.jsx)(Icon, { size: 16, color: "#9ca3af" }), (0, jsx_runtime_1.jsxs)(react_native_1.View, { style: [layout.flex.column], children: [(0, jsx_runtime_1.jsx)(react_native_1.Text, { style: [text.gray[400], { fontSize: 11, fontWeight: "500" }], children: label }), (0, jsx_runtime_1.jsx)(react_native_1.Text, { style: [statusColor, { fontSize: 13, fontWeight: "600" }], children: value })] })] }));
}
function StatusIndicator({ status, isLive }) {
    const getStatusColor = () => {
        if (!isLive)
            return bg.gray[500];
        switch (status) {
            case "pre-live":
                return bg.blue[500];
            case "excellent":
                return bg.green[500];
            case "good":
                return bg.yellow[500];
            case "poor":
                return bg.orange[500];
            case "offline":
                return bg.red[500];
            default:
                return bg.gray[500];
        }
    };
    const getStatusText = () => {
        if (!isLive)
            return "OFFLINE";
        switch (status) {
            case "pre-live":
                return "NOT LIVE";
            case "excellent":
                return "EXCELLENT";
            case "good":
                return "GOOD";
            case "poor":
                return "POOR";
            case "offline":
                return "OFFLINE";
            default:
                return "UNKNOWN";
        }
    };
    return ((0, jsx_runtime_1.jsxs)(react_native_1.View, { style: [layout.flex.row, layout.flex.alignCenter, gap.all[2]], children: [(0, jsx_runtime_1.jsx)(react_native_1.View, { style: [
                    { width: 8, height: 8, borderRadius: 4 },
                    getStatusColor(),
                    !isLive && { opacity: 0.6 },
                ] }), (0, jsx_runtime_1.jsx)(react_native_1.Text, { style: [
                    text.white,
                    { fontSize: 12, fontWeight: "700", letterSpacing: 0.5 },
                    !isLive && text.gray[400],
                ], children: getStatusText() })] }));
}
function Header({ isLive, streamTitle = "Live Stream", uptime = "00:00:00", bitrate = "0 mbps", timeBetweenSegments = 0, connectionStatus = "offline", problemsCount = 0, onProblemsPress, }) {
    const getConnectionQuality = () => {
        if (timeBetweenSegments <= 1500)
            return "good";
        if (timeBetweenSegments <= 3000)
            return "warning";
        return "error";
    };
    return ((0, jsx_runtime_1.jsxs)(react_native_1.View, { style: [
            px[4],
            py[3],
            r.lg,
            layout.flex.row,
            layout.flex.spaceBetween,
            bg.neutral[900],
            borders.width.thin,
            borders.color.neutral[700],
        ], children: [(0, jsx_runtime_1.jsx)(react_native_1.View, { style: [layout.flex.row, layout.flex.alignCenter, gap.all[4]], children: (0, jsx_runtime_1.jsxs)(react_native_1.View, { children: [(0, jsx_runtime_1.jsx)(react_native_1.Text, { style: [text.white, { fontSize: 18, fontWeight: "600" }], children: streamTitle }), (0, jsx_runtime_1.jsxs)(react_native_1.View, { style: [layout.flex.row, layout.flex.alignCenter, gap.all[3]], children: [(0, jsx_runtime_1.jsx)(StatusIndicator, { status: connectionStatus, isLive: isLive }), problemsCount > 0 && ((0, jsx_runtime_1.jsx)(react_native_1.Pressable, { onPress: onProblemsPress, children: (0, jsx_runtime_1.jsxs)(react_native_1.View, { style: [
                                            layout.flex.row,
                                            layout.flex.alignCenter,
                                            gap.all[1],
                                            px[2],
                                            py[1],
                                            r.md,
                                            bg.orange[900],
                                            borders.width.thin,
                                            borders.color.orange[700],
                                            { marginVertical: -8 },
                                        ], children: [(0, jsx_runtime_1.jsx)(lucide_react_native_1.AlertCircle, { size: 14, color: "#fb923c" }), (0, jsx_runtime_1.jsxs)(react_native_1.Text, { style: [
                                                    text.orange[400],
                                                    { fontSize: 11, fontWeight: "600" },
                                                ], children: [problemsCount, " ", problemsCount === 1 ? "Issue" : "Issues"] })] }) }))] })] }) }), (0, jsx_runtime_1.jsx)(react_native_1.View, { style: [layout.flex.row, layout.flex.alignCenter, gap.all[6]], children: !isLive && ((0, jsx_runtime_1.jsxs)(react_native_1.View, { style: [layout.flex.row, layout.flex.alignCenter, gap.all[2]], children: [(0, jsx_runtime_1.jsx)(lucide_react_native_1.Radio, { size: 16, color: "#6b7280" }), (0, jsx_runtime_1.jsx)(react_native_1.Text, { style: [text.gray[400], { fontSize: 13 }], children: "Stream offline" })] })) })] }));
}
//# sourceMappingURL=header.js.map