termcode
Version:
Superior terminal AI coding agent with enterprise-grade security, intelligent error recovery, performance monitoring, and plugin system - Advanced Claude Code alternative
36 lines (35 loc) • 3.78 kB
JavaScript
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import React from 'react';
import { Box, Text } from 'ink';
export const Sidebar = ({ width, height, active, mode, session, onTaskSubmit, onRunTests, onRollback, onCreatePR, onMerge, }) => {
const borderColor = active ? 'blue' : 'gray';
// Mock task history - in real implementation, this would come from session
const recentTasks = session?.recentTasks?.map((task, index) => ({
id: `task-${index}`,
task,
timestamp: new Date(Date.now() - (index * 30000)), // 30 seconds ago per task
files: [`file${index}.ts`],
status: index === 0 ? 'completed' : 'completed',
})) || [];
const formatTime = (date) => {
const now = new Date();
const diff = now.getTime() - date.getTime();
const minutes = Math.floor(diff / 60000);
if (minutes < 1)
return 'now';
if (minutes < 60)
return `${minutes}m`;
return `${Math.floor(minutes / 60)}h`;
};
const getStatusIcon = (status) => {
switch (status) {
case 'completed': return '✅';
case 'running': return '⏳';
case 'failed': return '❌';
default: return '⏸️';
}
};
return (_jsxs(Box, { width: width, height: height, borderStyle: "single", borderColor: borderColor, flexDirection: "column", children: [_jsx(Box, { paddingX: 1, borderStyle: "single", borderTop: false, borderLeft: false, borderRight: false, children: _jsx(Text, { color: "cyan", bold: true, children: "Task History" }) }), _jsx(Box, { flexDirection: "column", paddingX: 1, paddingY: 1, flexGrow: 1, children: recentTasks.length === 0 ? (_jsx(Text, { color: "gray", dimColor: true, children: "No tasks yet" })) : (recentTasks.slice(0, Math.floor((height - 8) / 3)).map((task, index) => (_jsx(Box, { marginBottom: 1, children: _jsxs(Box, { width: "100%", flexDirection: "column", children: [_jsxs(Box, { children: [_jsxs(Text, { color: "gray", children: [getStatusIcon(task.status), " "] }), _jsx(Text, { color: "white", wrap: "wrap", children: task.task.length > width - 8
? task.task.substring(0, width - 11) + '...'
: task.task })] }), _jsxs(Box, { justifyContent: "space-between", children: [_jsx(Text, { color: "gray", dimColor: true, children: formatTime(task.timestamp) }), _jsxs(Text, { color: "cyan", dimColor: true, children: [task.files.length, " files"] })] })] }) }, task.id)))) }), mode === 'pro' && (_jsxs(Box, { borderStyle: "single", borderBottom: false, borderLeft: false, borderRight: false, paddingX: 1, paddingY: 1, flexDirection: "column", children: [_jsx(Text, { color: "yellow", bold: true, marginBottom: 1, children: "Quick Actions" }), _jsxs(Box, { flexDirection: "column", gap: 1, children: [_jsxs(Box, { children: [_jsx(Text, { color: "green", children: "F5" }), _jsx(Text, { color: "gray", children: " Run Tests" })] }), _jsxs(Box, { children: [_jsx(Text, { color: "red", children: "F7" }), _jsx(Text, { color: "gray", children: " Rollback" })] }), _jsxs(Box, { children: [_jsx(Text, { color: "blue", children: "F8" }), _jsx(Text, { color: "gray", children: " Create PR" })] }), _jsxs(Box, { children: [_jsx(Text, { color: "magenta", children: "F9" }), _jsx(Text, { color: "gray", children: " Merge" })] })] })] })), _jsxs(Box, { borderStyle: "single", borderBottom: false, borderLeft: false, borderRight: false, paddingX: 1, justifyContent: "space-between", children: [_jsxs(Text, { color: "gray", dimColor: true, children: [session?.totalTokensUsed || 0, " tokens"] }), _jsxs(Text, { color: "gray", dimColor: true, children: ["$", (session?.totalCostUSD || 0).toFixed(3)] })] })] }));
};