"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.Viewers = Viewers;
exports.DehydratedViewers = DehydratedViewers;
const tslib_1 = require("tslib");
const jsx_runtime_1 = require("react/jsx-runtime");
const lucide_react_native_1 = require("lucide-react-native");
const __1 = require("../../..");
const atoms = tslib_1.__importStar(require("../../../lib/theme/atoms"));
const player_store_1 = require("../../../player-store");
const ui_1 = require("../../ui");
const viewer_count_1 = tslib_1.__importDefault(require("./viewer-count"));
// red reads as "live"; anything else (VOD total views) shouldn't
const LIVE_COLOR = "#fd5050";
const VIEWS_COLOR = "#fff";
function Viewers() {
    const views = (0, __1.useViews)();
    const mode = (0, player_store_1.usePlayerStore)((x) => x.mode);
    const color = mode === "live" ? LIVE_COLOR : VIEWS_COLOR;
    return (0, jsx_runtime_1.jsx)(DehydratedViewers, { viewers: views || 0, color: color });
}
function DehydratedViewers({ viewers, color = LIVE_COLOR, }) {
    return ((0, jsx_runtime_1.jsxs)(ui_1.View, { style: [
            atoms.layout.flex.center,
            atoms.layout.flex.row,
            atoms.gap.all[2],
        ], children: [(0, jsx_runtime_1.jsx)(lucide_react_native_1.Eye, { color: color }), (0, jsx_runtime_1.jsx)(viewer_count_1.default, { count: viewers, style: { color } })] }));
}
exports.default = Viewers;
//# sourceMappingURL=viewers.js.map