@hhoangphuoc/escape-room-cli
Version:
A CLI for playing AI-generated escape room games. Install globally with: npm install -g @hhoangphuoc/escape-room-cli
45 lines (44 loc) • 4.95 kB
JavaScript
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
import { Box, Text } from 'ink';
const CostMonitor = ({ costData, compact = false, showTokens = true }) => {
// Handle case where costData is undefined or null
if (!costData) {
return (_jsxs(Box, { flexDirection: "column", padding: 1, children: [_jsx(Box, { marginBottom: 1, children: _jsx(Text, { bold: true, color: "red", children: "\u274C COST MONITOR ERROR" }) }), _jsx(Text, { color: "gray", children: "Unable to load cost data. Please try again." })] }));
}
const formatCost = (cost) => {
if (cost === undefined || cost === null || isNaN(cost))
return '$0.00';
if (cost === 0)
return '$0.00';
return cost < 0.01 ? `$${cost.toFixed(5)}` : `$${cost.toFixed(3)}`;
};
const formatTokens = (tokens) => {
if (tokens === undefined || tokens === null || isNaN(tokens))
return '0';
return tokens.toLocaleString();
};
const getCostColor = (cost) => {
if (!cost || cost === 0 || isNaN(cost))
return 'gray';
if (cost < 0.01)
return 'green';
if (cost < 0.10)
return 'yellow';
return 'red';
};
const getSessionCostStatus = (sessionCost) => {
if (!sessionCost || sessionCost === 0 || isNaN(sessionCost))
return { emoji: '💤', color: 'gray' };
if (sessionCost < 0.05)
return { emoji: '💚', color: 'green' };
if (sessionCost < 0.25)
return { emoji: '💛', color: 'yellow' };
return { emoji: '🔥', color: 'red' };
};
if (compact) {
const status = getSessionCostStatus(costData.currentSessionCost);
return (_jsxs(Box, { children: [_jsxs(Text, { color: status.color, children: [status.emoji, " Session: ", formatCost(costData.currentSessionCost)] }), _jsx(Text, { color: "gray", children: " | " }), _jsxs(Text, { color: "cyan", children: ["Total: ", formatCost(costData.userTotalCost)] })] }));
}
return (_jsxs(Box, { flexDirection: "column", padding: 1, children: [_jsx(Box, { marginBottom: 1, children: _jsx(Text, { bold: true, color: "cyan", children: "\uD83D\uDCB0 AI COST MONITOR" }) }), _jsxs(Box, { marginBottom: 1, paddingLeft: 2, children: [_jsx(Box, { width: 20, children: _jsx(Text, { color: "green", children: "Current Session:" }) }), _jsx(Box, { width: 12, children: _jsx(Text, { bold: true, color: getCostColor(costData.currentSessionCost), children: formatCost(costData.currentSessionCost) }) }), showTokens && (_jsx(Box, { children: _jsxs(Text, { color: "gray", children: ["(", formatTokens(costData.currentSessionTokens), " tokens)"] }) }))] }), _jsxs(Box, { marginBottom: 1, paddingLeft: 2, children: [_jsx(Box, { width: 20, children: _jsx(Text, { color: "blue", children: "Total Usage:" }) }), _jsx(Box, { width: 12, children: _jsx(Text, { bold: true, color: getCostColor(costData.userTotalCost), children: formatCost(costData.userTotalCost) }) }), showTokens && (_jsx(Box, { children: _jsxs(Text, { color: "gray", children: ["(", formatTokens(costData.userTotalTokens), " tokens)"] }) }))] }), _jsxs(Box, { marginBottom: 1, paddingLeft: 2, children: [_jsx(Box, { width: 20, children: _jsx(Text, { color: "yellow", children: "Last Request:" }) }), _jsx(Box, { width: 12, children: _jsx(Text, { color: getCostColor(costData.lastRequestCost), children: formatCost(costData.lastRequestCost) }) }), showTokens && (_jsx(Box, { children: _jsxs(Text, { color: "gray", children: ["(", formatTokens(costData.lastRequestTokens), " tokens)"] }) }))] }), _jsxs(Box, { marginBottom: 1, paddingLeft: 2, children: [_jsx(Box, { width: 20, children: _jsx(Text, { color: "magenta", children: "Avg per Request:" }) }), _jsx(Box, { width: 12, children: _jsx(Text, { color: getCostColor(costData.averageCostPerRequest), children: formatCost(costData.averageCostPerRequest) }) })] }), costData.modelUsageBreakdown && Object.keys(costData.modelUsageBreakdown).length > 0 && (_jsxs(_Fragment, { children: [_jsx(Box, { marginY: 1, children: _jsx(Text, { bold: true, color: "cyan", children: "Model Usage Breakdown:" }) }), Object.entries(costData.modelUsageBreakdown).map(([model, data]) => (_jsxs(Box, { paddingLeft: 2, marginBottom: 0, children: [_jsx(Box, { width: 15, children: _jsxs(Text, { color: "white", children: [model, ":"] }) }), _jsx(Box, { width: 8, children: _jsxs(Text, { color: "gray", children: [data.requests, " req"] }) }), _jsx(Box, { width: 12, children: _jsx(Text, { color: getCostColor(data.cost), children: formatCost(data.cost) }) }), showTokens && (_jsx(Box, { children: _jsxs(Text, { color: "gray", children: ["(", formatTokens(data.tokens), " tokens)"] }) }))] }, model)))] })), _jsx(Box, { marginTop: 1, children: _jsx(Text, { color: "gray", children: "\uD83D\uDCA1 Use '/usage' for detailed analytics dashboard" }) })] }));
};
export default CostMonitor;