@gguf/coder 0.3.0 → 0.3.1

package/source/components/user-message.spec.tsx

@@ -0,0 +1,230 @@
+import test from 'ava';
+import {render} from 'ink-testing-library';
+import React from 'react';
+import {themes} from '../config/themes';
+import {ThemeContext} from '../hooks/useTheme';
+import UserMessage from './user-message';
+
+console.log(`\nuser-message.spec.tsx – ${React.version}`);
+
+// Mock ThemeProvider for testing
+const MockThemeProvider = ({children}: {children: React.ReactNode}) => {
+	const mockTheme = {
+		currentTheme: 'tokyo-night' as const,
+		colors: themes['tokyo-night'].colors,
+		setCurrentTheme: () => {},
+	};
+
+	return (
+		<ThemeContext.Provider value={mockTheme}>{children}</ThemeContext.Provider>
+	);
+};
+
+// ============================================================================
+// Component Rendering Tests
+// ============================================================================
+
+test('UserMessage renders with basic message', t => {
+	const {lastFrame} = render(
+		<MockThemeProvider>
+			<UserMessage message="Hello world" />
+		</MockThemeProvider>,
+	);
+
+	const output = lastFrame();
+	t.truthy(output);
+	t.regex(output!, /You:/);
+	t.regex(output!, /Hello world/);
+});
+
+test('UserMessage renders without file placeholders', t => {
+	const {lastFrame} = render(
+		<MockThemeProvider>
+			<UserMessage message="This is a normal message" />
+		</MockThemeProvider>,
+	);
+
+	const output = lastFrame();
+	t.truthy(output);
+	t.regex(output!, /This is a normal message/);
+});
+
+test('UserMessage renders with file placeholder', t => {
+	const {lastFrame} = render(
+		<MockThemeProvider>
+			<UserMessage message="Check [@src/app.tsx] for details" />
+		</MockThemeProvider>,
+	);
+
+	const output = lastFrame();
+	t.truthy(output);
+	t.regex(output!, /\[@src\/app\.tsx\]/);
+	t.regex(output!, /Check/);
+	t.regex(output!, /for details/);
+});
+
+test('UserMessage renders with file placeholder with line range', t => {
+	const {lastFrame} = render(
+		<MockThemeProvider>
+			<UserMessage message="Look at [@file.ts:10-20] please" />
+		</MockThemeProvider>,
+	);
+
+	const output = lastFrame();
+	t.truthy(output);
+	t.regex(output!, /\[@file\.ts:10-20\]/);
+});
+
+test('UserMessage renders with file placeholder with single line', t => {
+	const {lastFrame} = render(
+		<MockThemeProvider>
+			<UserMessage message="Check [@utils.ts:42] specifically" />
+		</MockThemeProvider>,
+	);
+
+	const output = lastFrame();
+	t.truthy(output);
+	t.regex(output!, /\[@utils\.ts:42\]/);
+});
+
+test('UserMessage renders with multiple file placeholders', t => {
+	const {lastFrame} = render(
+		<MockThemeProvider>
+			<UserMessage message="Compare [@src/app.tsx] with [@src/index.tsx]" />
+		</MockThemeProvider>,
+	);
+
+	const output = lastFrame();
+	t.truthy(output);
+	t.regex(output!, /\[@src\/app\.tsx\]/);
+	t.regex(output!, /\[@src\/index\.tsx\]/);
+	t.regex(output!, /Compare/);
+	t.regex(output!, /with/);
+});
+
+test('UserMessage renders multi-line message', t => {
+	const {lastFrame} = render(
+		<MockThemeProvider>
+			<UserMessage message="Line 1\nLine 2\nLine 3" />
+		</MockThemeProvider>,
+	);
+
+	const output = lastFrame();
+	t.truthy(output);
+	t.regex(output!, /Line 1/);
+	t.regex(output!, /Line 2/);
+	t.regex(output!, /Line 3/);
+});
+
+test('UserMessage renders multi-line message with file placeholders', t => {
+	const {lastFrame} = render(
+		<MockThemeProvider>
+			<UserMessage message="Check these files:\n[@src/app.tsx]\n[@src/utils.ts]" />
+		</MockThemeProvider>,
+	);
+
+	const output = lastFrame();
+	t.truthy(output);
+	t.regex(output!, /Check these files:/);
+	t.regex(output!, /\[@src\/app\.tsx\]/);
+	t.regex(output!, /\[@src\/utils\.ts\]/);
+});
+
+test('UserMessage renders file placeholder at start of message', t => {
+	const {lastFrame} = render(
+		<MockThemeProvider>
+			<UserMessage message="[@package.json] shows dependencies" />
+		</MockThemeProvider>,
+	);
+
+	const output = lastFrame();
+	t.truthy(output);
+	t.regex(output!, /\[@package\.json\]/);
+});
+
+test('UserMessage renders file placeholder at end of message', t => {
+	const {lastFrame} = render(
+		<MockThemeProvider>
+			<UserMessage message="Check the config in [@tsconfig.json]" />
+		</MockThemeProvider>,
+	);
+
+	const output = lastFrame();
+	t.truthy(output);
+	t.regex(output!, /\[@tsconfig\.json\]/);
+});
+
+test('UserMessage renders with empty message', t => {
+	const {lastFrame} = render(
+		<MockThemeProvider>
+			<UserMessage message="" />
+		</MockThemeProvider>,
+	);
+
+	const output = lastFrame();
+	t.truthy(output);
+	t.regex(output!, /You:/);
+});
+
+test('UserMessage handles file placeholder with special characters in path', t => {
+	const {lastFrame} = render(
+		<MockThemeProvider>
+			<UserMessage message="Check [@src/my-file.spec.ts:100-200]" />
+		</MockThemeProvider>,
+	);
+
+	const output = lastFrame();
+	t.truthy(output);
+	t.regex(output!, /\[@src\/my-file\.spec\.ts:100-200\]/);
+});
+
+test('UserMessage handles multiple placeholders on same line', t => {
+	const {lastFrame} = render(
+		<MockThemeProvider>
+			<UserMessage message="Compare [@a.ts] and [@b.ts] and [@c.ts]" />
+		</MockThemeProvider>,
+	);
+
+	const output = lastFrame();
+	t.truthy(output);
+	t.regex(output!, /\[@a\.ts\]/);
+	t.regex(output!, /\[@b\.ts\]/);
+	t.regex(output!, /\[@c\.ts\]/);
+});
+
+test('UserMessage does not render @ symbols that are not placeholders', t => {
+	const {lastFrame} = render(
+		<MockThemeProvider>
+			<UserMessage message="Email me at user@example.com" />
+		</MockThemeProvider>,
+	);
+
+	const output = lastFrame();
+	t.truthy(output);
+	t.regex(output!, /user@example\.com/);
+	// Should NOT have placeholder styling since it's not in [@...] format
+});
+
+test('UserMessage renders paragraphs with spacing', t => {
+	const {lastFrame} = render(
+		<MockThemeProvider>
+			<UserMessage message="First paragraph\n\nSecond paragraph\n\nThird paragraph" />
+		</MockThemeProvider>,
+	);
+
+	const output = lastFrame();
+	t.truthy(output);
+	t.regex(output!, /First paragraph/);
+	t.regex(output!, /Second paragraph/);
+	t.regex(output!, /Third paragraph/);
+});
+
+test('UserMessage renders without crashing', t => {
+	const {lastFrame} = render(
+		<MockThemeProvider>
+			<UserMessage message="Test" />
+		</MockThemeProvider>,
+	);
+
+	t.truthy(lastFrame());
+});

package/source/components/user-message.tsx

@@ -0,0 +1,84 @@
+import {useTheme} from '@/hooks/useTheme';
+import type {UserMessageProps} from '@/types/index';
+import {Box, Text} from 'ink';
+import {memo} from 'react';
+
+// Parse a line and return segments with file placeholders highlighted
+function parseLineWithPlaceholders(line: string) {
+	const segments: Array<{text: string; isPlaceholder: boolean}> = [];
+	const filePattern = /\[@[^\]]+\]/g;
+	let lastIndex = 0;
+	let match;
+
+	while ((match = filePattern.exec(line)) !== null) {
+		// Add text before the placeholder
+		if (match.index > lastIndex) {
+			segments.push({
+				text: line.slice(lastIndex, match.index),
+				isPlaceholder: false,
+			});
+		}
+
+		// Add the placeholder
+		segments.push({
+			text: match[0],
+			isPlaceholder: true,
+		});
+
+		lastIndex = match.index + match[0].length;
+	}
+
+	// Add remaining text
+	if (lastIndex < line.length) {
+		segments.push({
+			text: line.slice(lastIndex),
+			isPlaceholder: false,
+		});
+	}
+
+	return segments;
+}
+
+export default memo(function UserMessage({message}: UserMessageProps) {
+	const {colors} = useTheme();
+
+	const lines = message.split('\n');
+
+	return (
+		<Box flexDirection="column" marginBottom={1}>
+			<Box>
+				<Text color={colors.secondary} bold>
+					You:
+				</Text>
+			</Box>
+			<Box flexDirection="column">
+				{lines.map((line, lineIndex) => {
+					// Skip empty lines - they create paragraph spacing via marginBottom
+					if (line.trim() === '') {
+						return null;
+					}
+
+					const segments = parseLineWithPlaceholders(line);
+					const isEndOfParagraph =
+						lineIndex + 1 < lines.length && lines[lineIndex + 1].trim() === '';
+
+					return (
+						<Box key={lineIndex} marginBottom={isEndOfParagraph ? 1 : 0}>
+							<Text>
+								{segments.map((segment, segIndex) => (
+									<Text
+										key={segIndex}
+										color={segment.isPlaceholder ? colors.info : colors.white}
+										bold={segment.isPlaceholder}
+									>
+										{segment.text}
+									</Text>
+								))}
+							</Text>
+						</Box>
+					);
+				})}
+			</Box>
+		</Box>
+	);
+});

package/source/components/welcome-message.tsx

@@ -0,0 +1,76 @@
+import {Box, Text} from 'ink';
+import {memo} from 'react';
+
+import {TitledBox} from '@/components/ui/titled-box';
+import {useResponsiveTerminal} from '@/hooks/useTerminalWidth';
+import {useTheme} from '@/hooks/useTheme';
+
+import fs from 'fs';
+import path from 'path';
+import {fileURLToPath} from 'url';
+import BigText from 'ink-big-text';
+import Gradient from 'ink-gradient';
+
+const __filename = fileURLToPath(import.meta.url);
+const __dirname = path.dirname(__filename);
+
+// Read package.json once at module load time to avoid repeated file reads
+const packageJson = JSON.parse(
+	fs.readFileSync(path.join(__dirname, '../../package.json'), 'utf8'),
+) as {version: string};
+
+export default memo(function WelcomeMessage() {
+	const {boxWidth, isNarrow, isNormal} = useResponsiveTerminal();
+	const {colors} = useTheme();
+
+	return (
+		<>
+			{/* Narrow terminal: simple text without boxes */}
+			{isNarrow ? (
+				<>
+					<Gradient colors={[colors.primary, colors.tool]}>
+						<BigText text="coder" font="tiny" />
+					</Gradient>
+					<Box
+						flexDirection="column"
+						marginBottom={1}
+						borderStyle="round"
+						borderColor={colors.primary}
+						paddingY={1}
+						paddingX={2}
+					>
+						<Box marginBottom={1}>
+							<Text color={colors.primary} bold>
+								✻ Version {packageJson.version}
+							</Text>
+						</Box>
+						<Text color={colors.white}>Tips:</Text>
+						<Text color={colors.secondary}>• Use natural language</Text>
+						<Text color={colors.secondary}>• /help for commands</Text>
+						<Text color={colors.secondary}>• Ctrl+C to quit</Text>
+					</Box>
+				</>
+			) : (
+				/* Normal/Wide terminal: full version with TitledBox */
+				<>
+					<Gradient colors={[colors.primary, colors.tool]}>
+						<BigText text="coder" font="tiny" />
+					</Gradient>
+					<TitledBox
+						title={packageJson.version}
+						width={boxWidth}
+						borderColor={colors.primary}
+						paddingX={2}
+						paddingY={1}
+						flexDirection="column"
+						marginBottom={1}
+					>
+						<Box>
+							<Text color={colors.white}>🎊✨ Happy New Year 2026!🎉 /help for help</Text>
+						</Box>
+					</TitledBox>
+				</>
+			)}
+		</>
+	);
+});

package/source/config/env-substitution.ts

@@ -0,0 +1,65 @@
+import {logError} from '@/utils/message-queue';
+
+// Expand environment variable references in a string
+function expandEnvVar(str: string): string {
+	if (typeof str !== 'string') {
+		return str;
+	}
+
+	const regex = /\$\{([A-Z_][A-Z0-9_]*)(?::-(.*?))?\}|\$([A-Z_][A-Z0-9_]*)/g;
+
+	return str.replace(
+		regex,
+		(
+			_match: string,
+			bracedVarName: string | undefined,
+			defaultValue: string | undefined,
+			unbracedVarName: string | undefined,
+		) => {
+			const varName = bracedVarName || unbracedVarName;
+			if (!varName) return '';
+
+			const envValue = process.env[varName];
+
+			if (envValue !== undefined) {
+				return envValue;
+			}
+
+			if (defaultValue !== undefined) {
+				return defaultValue;
+			}
+
+			logError(
+				`Environment variable ${varName} not found in config, using empty string`,
+			);
+
+			return '';
+		},
+	);
+}
+
+// Recursively substitute environment variables in objects, arrays, and strings
+export function substituteEnvVars<T>(value: T): T {
+	if (value === null || value === undefined) {
+		return value;
+	}
+
+	if (typeof value === 'string') {
+		return expandEnvVar(value) as T;
+	}
+
+	if (Array.isArray(value)) {
+		return value.map((item: unknown) => substituteEnvVars(item)) as T;
+	}
+
+	if (typeof value === 'object') {
+		const result: Record<string, unknown> = {};
+		for (const [key, val] of Object.entries(value)) {
+			result[key] = substituteEnvVars(val);
+		}
+
+		return result as T;
+	}
+
+	return value;
+}

package/source/config/index.spec.ts

@@ -0,0 +1,171 @@
+import {existsSync, mkdirSync, readFileSync, rmSync, writeFileSync} from 'fs';
+import {tmpdir} from 'os';
+import {join} from 'path';
+import test from 'ava';
+import {confDirMap, getClosestConfigFile, reloadAppConfig} from './index';
+
+console.log(`\nindex.spec.ts`);
+
+// Create a temporary test directory
+const testDir = join(tmpdir(), `coder-test-${Date.now()}`);
+
+test.before(() => {
+	// Create test directory
+	mkdirSync(testDir, {recursive: true});
+});
+
+test.after.always(() => {
+	// Clean up test directory
+	if (existsSync(testDir)) {
+		rmSync(testDir, {recursive: true, force: true});
+	}
+});
+
+test('getClosestConfigFile creates default config if none exists', t => {
+	const fileName = 'test-config.json';
+	const configPath = getClosestConfigFile(fileName);
+
+	t.true(existsSync(configPath), 'Config file should be created');
+	t.true(configPath.includes(fileName), 'Config path should include filename');
+
+	// Clean up
+	if (existsSync(configPath)) {
+		rmSync(configPath, {force: true});
+	}
+});
+
+test('getClosestConfigFile prefers cwd config over home config', t => {
+	const fileName = 'test-priority.json';
+	const cwdConfig = join(process.cwd(), fileName);
+
+	// Create a config in cwd
+	writeFileSync(cwdConfig, JSON.stringify({test: 'cwd'}), 'utf-8');
+
+	try {
+		const configPath = getClosestConfigFile(fileName);
+		t.is(configPath, cwdConfig, 'Should prefer cwd config');
+		t.is(confDirMap[fileName], cwdConfig, 'Should store cwd path in map');
+
+		// Verify it returns the cwd config content
+		const content = JSON.parse(readFileSync(configPath, 'utf-8'));
+		t.deepEqual(content, {test: 'cwd'});
+	} finally {
+		// Clean up
+		if (existsSync(cwdConfig)) {
+			rmSync(cwdConfig, {force: true});
+		}
+	}
+});
+
+test('confDirMap stores config file locations', t => {
+	const fileName = 'test-map.json';
+
+	// Clear any existing entry
+	delete confDirMap[fileName];
+
+	const configPath = getClosestConfigFile(fileName);
+
+	t.true(fileName in confDirMap, 'Config map should have entry');
+	t.is(
+		confDirMap[fileName],
+		configPath,
+		'Config map should store correct path',
+	);
+
+	// Clean up
+	if (existsSync(configPath)) {
+		rmSync(configPath, {force: true});
+	}
+});
+
+test('getClosestConfigFile handles missing config directory gracefully', t => {
+	const fileName = 'new-config.json';
+
+	// This should create the config directory and file
+	t.notThrows(() => {
+		const configPath = getClosestConfigFile(fileName);
+		t.true(existsSync(configPath), 'Should create config file');
+	});
+
+	// Clean up
+	const configPath = confDirMap[fileName];
+	if (configPath && existsSync(configPath)) {
+		rmSync(configPath, {force: true});
+	}
+});
+
+test('reloadAppConfig can be called without errors', t => {
+	// This test ensures reloadAppConfig doesn't throw
+	t.notThrows(() => {
+		reloadAppConfig();
+	});
+});
+
+test('default config file contains valid JSON', t => {
+	const fileName = 'test-default.json';
+	const configPath = getClosestConfigFile(fileName);
+
+	// Read and parse the created config
+	const content = readFileSync(configPath, 'utf-8');
+
+	t.notThrows(() => {
+		JSON.parse(content);
+	}, 'Default config should be valid JSON');
+
+	// Clean up
+	if (existsSync(configPath)) {
+		rmSync(configPath, {force: true});
+	}
+});
+
+test('promptPath points to main-prompt.md', async t => {
+	// Dynamic import to get the promptPath
+	const {promptPath} = await import('./index.js');
+
+	t.true(
+		promptPath.includes('main-prompt.md'),
+		'promptPath should point to main-prompt.md',
+	);
+	t.true(
+		promptPath.includes('source/app/prompts'),
+		'promptPath should include source/app/prompts directory',
+	);
+});
+
+test('loadAppConfig handles malformed JSON gracefully', async t => {
+	const fileName = 'malformed-config.json';
+	const configPath = getClosestConfigFile(fileName);
+
+	// Write malformed JSON to the config file
+	writeFileSync(configPath, '{ "coder": { "providers": [ }, "mcpServers": [ ] }', 'utf-8');
+
+	try {
+		// This should not throw, but should log a warning
+		const {reloadAppConfig} = await import('./index.js');
+		reloadAppConfig();
+		t.pass('Should handle malformed JSON without throwing');
+	} finally {
+		// Clean up
+		if (existsSync(configPath)) {
+			rmSync(configPath, {force: true});
+		}
+	}
+});
+
+test('loadAppConfig handles missing file gracefully', async t => {
+	// This test ensures that when the config file is missing,
+	// the function falls back to defaults without throwing
+	const originalCwd = process.cwd();
+	
+	try {
+		// Change to a directory where the config file doesn't exist
+		process.chdir(testDir);
+		
+		const {reloadAppConfig} = await import('./index.js');
+		reloadAppConfig();
+		t.pass('Should handle missing config file without throwing');
+	} finally {
+		// Restore original directory
+		process.chdir(originalCwd);
+	}
+});