termcode
Version:
Superior terminal AI coding agent with enterprise-grade security, intelligent error recovery, performance monitoring, and plugin system - Advanced Claude Code alternative
84 lines (83 loc) • 4.55 kB
JavaScript
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import React from 'react';
import { Box, Text } from 'ink';
export const DiffOutput = ({ width, height, active, output, currentDiff, streaming, }) => {
const borderColor = active ? 'blue' : 'gray';
const maxLines = height - 4; // Account for borders and padding
// Process diff content for syntax highlighting
const renderDiffLine = (line, index) => {
if (line.startsWith('+')) {
return (_jsx(Text, { color: "green", children: line }, index));
}
else if (line.startsWith('-')) {
return (_jsx(Text, { color: "red", children: line }, index));
}
else if (line.startsWith('@@')) {
return (_jsx(Text, { color: "cyan", bold: true, children: line }, index));
}
else if (line.startsWith('diff --git') || line.startsWith('index ') || line.startsWith('+++') || line.startsWith('---')) {
return (_jsx(Text, { color: "yellow", children: line }, index));
}
else {
return (_jsx(Text, { color: "white", children: line }, index));
}
};
// Process output lines with colors
const renderOutputLine = (line, index) => {
// Detect log levels and color accordingly
if (line.includes('✅') || line.includes('success') || line.includes('✓')) {
return (_jsx(Text, { color: "green", children: line }, index));
}
else if (line.includes('❌') || line.includes('error') || line.includes('failed')) {
return (_jsx(Text, { color: "red", children: line }, index));
}
else if (line.includes('⚠️') || line.includes('warning') || line.includes('⏳')) {
return (_jsx(Text, { color: "yellow", children: line }, index));
}
else if (line.includes('📝') || line.includes('🔄') || line.includes('🧪')) {
return (_jsx(Text, { color: "blue", children: line }, index));
}
else if (line.startsWith(' ') || line.includes('→')) {
return (_jsx(Text, { color: "gray", children: line }, index));
}
else {
return (_jsx(Text, { color: "white", children: line }, index));
}
};
// Determine what to display
let contentLines = [];
let isShowingDiff = false;
if (currentDiff) {
// Show diff content
contentLines = currentDiff.split('\n');
isShowingDiff = true;
}
else if (output.length > 0) {
// Show command output
contentLines = output;
}
else {
// Show welcome message
contentLines = [
'Welcome to TermCode TUI!',
'',
'This pane will show:',
'• Real-time command output',
'• File diffs and changes',
'• Test results and build logs',
'• AI agent responses',
'',
'Start by typing a task in the prompt below.',
];
}
// Trim to fit viewport and show recent content
const displayLines = contentLines.slice(-maxLines);
return (_jsxs(Box, { width: width, height: height, borderStyle: "single", borderColor: borderColor, flexDirection: "column", children: [_jsxs(Box, { paddingX: 1, borderStyle: "single", borderTop: false, borderLeft: false, borderRight: false, children: [_jsx(Text, { color: "cyan", bold: true, children: isShowingDiff ? 'Diff View' : 'Output' }), streaming && (_jsx(Text, { color: "yellow", marginLeft: 1, children: "\u23F3 Streaming..." }))] }), _jsxs(Box, { flexDirection: "column", paddingX: 1, paddingY: 1, flexGrow: 1, children: [displayLines.length === 0 ? (_jsx(Text, { color: "gray", dimColor: true, children: "No output to display" })) : (displayLines.map((line, index) => {
if (isShowingDiff) {
return renderDiffLine(line, index);
}
else {
return renderOutputLine(line, index);
}
})), streaming && (_jsx(Box, { marginTop: 1, children: _jsx(Text, { color: "yellow", dimColor: true, children: "\u25CF Receiving output..." }) }))] }), contentLines.length > maxLines && (_jsx(Box, { borderStyle: "single", borderBottom: false, borderLeft: false, borderRight: false, paddingX: 1, justifyContent: "center", children: _jsxs(Text, { color: "gray", dimColor: true, children: ["Showing ", displayLines.length, " of ", contentLines.length, " lines"] }) }))] }));
};