tlc-claude-code 1.4.4 → 1.4.6

package/dashboard/dist/components/ui/EmptyState.test.js

@@ -0,0 +1,97 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { describe, it, expect } from 'vitest';
+import { render } from 'ink-testing-library';
+import { EmptyState } from './EmptyState.js';
+describe('EmptyState', () => {
+    describe('Type-specific defaults', () => {
+        it('renders tasks empty state with default messages', () => {
+            const { lastFrame } = render(_jsx(EmptyState, { type: "tasks" }));
+            const output = lastFrame() || '';
+            expect(output).toContain('No tasks yet');
+            expect(output).toContain('/tlc:plan');
+        });
+        it('renders bugs empty state', () => {
+            const { lastFrame } = render(_jsx(EmptyState, { type: "bugs" }));
+            const output = lastFrame() || '';
+            expect(output).toContain('No bugs reported');
+            expect(output).toContain('/tlc:bug');
+        });
+        it('renders agents empty state', () => {
+            const { lastFrame } = render(_jsx(EmptyState, { type: "agents" }));
+            const output = lastFrame() || '';
+            expect(output).toContain('No agents running');
+            expect(output).toContain('spawned');
+        });
+        it('renders logs empty state', () => {
+            const { lastFrame } = render(_jsx(EmptyState, { type: "logs" }));
+            const output = lastFrame() || '';
+            expect(output).toContain('No logs yet');
+            expect(output).toContain('activity');
+        });
+        it('renders projects empty state', () => {
+            const { lastFrame } = render(_jsx(EmptyState, { type: "projects" }));
+            const output = lastFrame() || '';
+            expect(output).toContain('No projects');
+            expect(output).toContain('tlc init');
+        });
+        it('renders health empty state', () => {
+            const { lastFrame } = render(_jsx(EmptyState, { type: "health" }));
+            const output = lastFrame() || '';
+            expect(output).toContain('No health data');
+            expect(output).toContain('/tlc:security');
+        });
+        it('renders router empty state', () => {
+            const { lastFrame } = render(_jsx(EmptyState, { type: "router" }));
+            const output = lastFrame() || '';
+            expect(output).toContain('No router configured');
+            expect(output).toContain('.tlc.json');
+        });
+        it('renders generic empty state as default', () => {
+            const { lastFrame } = render(_jsx(EmptyState, {}));
+            const output = lastFrame() || '';
+            expect(output).toContain('Nothing here');
+            expect(output).toContain('No items');
+        });
+    });
+    describe('Custom messages', () => {
+        it('uses custom title when provided', () => {
+            const { lastFrame } = render(_jsx(EmptyState, { type: "tasks", title: "Custom Title" }));
+            const output = lastFrame() || '';
+            expect(output).toContain('Custom Title');
+            expect(output).not.toContain('No tasks yet');
+        });
+        it('uses custom subtitle when provided', () => {
+            const { lastFrame } = render(_jsx(EmptyState, { type: "tasks", subtitle: "Custom subtitle" }));
+            const output = lastFrame() || '';
+            expect(output).toContain('Custom subtitle');
+            expect(output).not.toContain('/tlc:plan');
+        });
+        it('shows action hint when provided', () => {
+            const { lastFrame } = render(_jsx(EmptyState, { type: "generic", action: "Press Enter to add" }));
+            const output = lastFrame() || '';
+            expect(output).toContain('Press Enter to add');
+        });
+    });
+    describe('Compact mode', () => {
+        it('renders compact state with title only', () => {
+            const { lastFrame } = render(_jsx(EmptyState, { type: "tasks", compact: true }));
+            const output = lastFrame() || '';
+            expect(output).toContain('No tasks yet');
+            // Should be shorter than full version
+            expect(output.split('\n').length).toBeLessThan(5);
+        });
+        it('hides subtitle in compact mode', () => {
+            const { lastFrame } = render(_jsx(EmptyState, { type: "tasks", compact: true }));
+            const output = lastFrame() || '';
+            expect(output).not.toContain('/tlc:plan');
+        });
+    });
+    describe('Icons', () => {
+        it('shows an icon', () => {
+            const { lastFrame } = render(_jsx(EmptyState, { type: "tasks" }));
+            const output = lastFrame() || '';
+            // Should contain some icon character
+            expect(output.length).toBeGreaterThan(0);
+        });
+    });
+});

package/dashboard/dist/components/ui/ErrorState.d.ts

@@ -0,0 +1,17 @@
+import type { FetchError } from '../../api/safeFetch.js';
+export interface ErrorInfo {
+    title: string;
+    message: string;
+    hint?: string;
+}
+export interface ErrorStateProps {
+    error: FetchError;
+    onRetry?: () => void;
+    compact?: boolean;
+}
+/**
+ * Renders a user-friendly error state with optional retry button.
+ * Maps technical errors to helpful messages with actionable hints.
+ */
+export declare function ErrorState({ error, onRetry, compact }: ErrorStateProps): import("react/jsx-runtime").JSX.Element;
+export default ErrorState;

package/dashboard/dist/components/ui/ErrorState.js

@@ -0,0 +1,80 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Box, Text } from 'ink';
+/**
+ * Maps error types to user-friendly messages with actionable hints
+ */
+const ERROR_MESSAGES = {
+    'http-404': {
+        title: 'Not Set Up',
+        message: 'This feature needs configuration.',
+        hint: 'Run tlc setup',
+    },
+    'http-401': {
+        title: 'Not Authorized',
+        message: 'Authentication required.',
+        hint: 'Check your credentials',
+    },
+    'http-403': {
+        title: 'Access Denied',
+        message: 'You do not have permission.',
+    },
+    'http-500': {
+        title: 'Server Error',
+        message: 'Something went wrong on the server.',
+    },
+    'http-502': {
+        title: 'Bad Gateway',
+        message: 'The server is unreachable.',
+        hint: 'Check if tlc server is running',
+    },
+    'http-503': {
+        title: 'Service Unavailable',
+        message: 'The server is temporarily unavailable.',
+    },
+    network: {
+        title: 'Connection Lost',
+        message: 'Cannot reach the server.',
+        hint: 'Check if tlc server is running',
+    },
+    timeout: {
+        title: 'Request Timeout',
+        message: 'The server took too long to respond.',
+        hint: 'Try again or check server health',
+    },
+    parse: {
+        title: 'Invalid Response',
+        message: 'The server returned unexpected data.',
+    },
+    unknown: {
+        title: 'Unknown Error',
+        message: 'An unexpected error occurred.',
+    },
+};
+function getErrorInfo(error) {
+    // Check for specific HTTP error codes
+    if (error.type === 'http' && error.code) {
+        const key = `http-${error.code}`;
+        if (key in ERROR_MESSAGES) {
+            return ERROR_MESSAGES[key];
+        }
+        // Default HTTP error
+        return {
+            title: `HTTP Error ${error.code}`,
+            message: error.message,
+        };
+    }
+    // Check for other error types
+    return ERROR_MESSAGES[error.type] || ERROR_MESSAGES.unknown;
+}
+/**
+ * Renders a user-friendly error state with optional retry button.
+ * Maps technical errors to helpful messages with actionable hints.
+ */
+export function ErrorState({ error, onRetry, compact = false }) {
+    const info = getErrorInfo(error);
+    if (compact) {
+        return (_jsxs(Box, { children: [_jsx(Text, { color: "red", children: info.title }), onRetry && _jsx(Text, { dimColor: true, children: " [r] retry" })] }));
+    }
+    return (_jsxs(Box, { flexDirection: "column", alignItems: "center", paddingY: 2, children: [_jsx(Box, { marginBottom: 1, children: _jsx(Text, { children: "\u26A0" }) }), _jsx(Box, { marginBottom: 1, children: _jsx(Text, { color: "red", bold: true, children: info.title }) }), _jsx(Box, { marginBottom: 1, children: _jsx(Text, { color: "gray", children: info.message }) }), info.hint && (_jsx(Box, { marginBottom: 1, paddingX: 1, borderStyle: "single", borderColor: "gray", children: _jsx(Text, { dimColor: true, children: info.hint }) })), onRetry && (_jsx(Box, { marginTop: 1, children: _jsx(Text, { color: "cyan", children: "[r] Retry" }) }))] }));
+}
+export default ErrorState;

package/dashboard/dist/components/ui/ErrorState.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dashboard/dist/components/ui/ErrorState.test.js

@@ -0,0 +1,166 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { describe, it, expect } from 'vitest';
+import { render } from 'ink-testing-library';
+import { ErrorState } from './ErrorState.js';
+describe('ErrorState', () => {
+    describe('HTTP Errors', () => {
+        it('renders 404 not found with setup hint', () => {
+            const error = {
+                type: 'http',
+                code: 404,
+                message: 'HTTP 404: Not Found',
+            };
+            const { lastFrame } = render(_jsx(ErrorState, { error: error }));
+            const output = lastFrame() || '';
+            expect(output).toContain('Not Set Up');
+            expect(output).toContain('needs configuration');
+            expect(output).toContain('tlc setup');
+        });
+        it('renders 500 server error', () => {
+            const error = {
+                type: 'http',
+                code: 500,
+                message: 'HTTP 500: Internal Server Error',
+            };
+            const { lastFrame } = render(_jsx(ErrorState, { error: error }));
+            const output = lastFrame() || '';
+            expect(output).toContain('Server Error');
+            expect(output).toContain('wrong on the server');
+        });
+        it('renders 401 unauthorized', () => {
+            const error = {
+                type: 'http',
+                code: 401,
+                message: 'HTTP 401: Unauthorized',
+            };
+            const { lastFrame } = render(_jsx(ErrorState, { error: error }));
+            const output = lastFrame() || '';
+            expect(output).toContain('Not Authorized');
+            expect(output).toContain('Authentication');
+        });
+        it('renders 403 forbidden', () => {
+            const error = {
+                type: 'http',
+                code: 403,
+                message: 'HTTP 403: Forbidden',
+            };
+            const { lastFrame } = render(_jsx(ErrorState, { error: error }));
+            const output = lastFrame() || '';
+            expect(output).toContain('Access Denied');
+        });
+        it('renders unknown HTTP error with code', () => {
+            const error = {
+                type: 'http',
+                code: 418,
+                message: "HTTP 418: I'm a teapot",
+            };
+            const { lastFrame } = render(_jsx(ErrorState, { error: error }));
+            const output = lastFrame() || '';
+            expect(output).toContain('HTTP Error 418');
+        });
+    });
+    describe('Network Errors', () => {
+        it('renders network error with server hint', () => {
+            const error = {
+                type: 'network',
+                message: 'Cannot reach the server',
+            };
+            const { lastFrame } = render(_jsx(ErrorState, { error: error }));
+            const output = lastFrame() || '';
+            expect(output).toContain('Connection Lost');
+            expect(output).toContain('Cannot reach');
+            expect(output).toContain('tlc server');
+        });
+    });
+    describe('Timeout Errors', () => {
+        it('renders timeout error', () => {
+            const error = {
+                type: 'timeout',
+                message: 'Request timed out',
+            };
+            const { lastFrame } = render(_jsx(ErrorState, { error: error }));
+            const output = lastFrame() || '';
+            expect(output).toContain('Request Timeout');
+            expect(output).toContain('too long');
+        });
+    });
+    describe('Parse Errors', () => {
+        it('renders parse error', () => {
+            const error = {
+                type: 'parse',
+                message: 'Invalid response from server',
+            };
+            const { lastFrame } = render(_jsx(ErrorState, { error: error }));
+            const output = lastFrame() || '';
+            expect(output).toContain('Invalid Response');
+            expect(output).toContain('unexpected data');
+        });
+    });
+    describe('Unknown Errors', () => {
+        it('renders unknown error', () => {
+            const error = {
+                type: 'unknown',
+                message: 'Something went wrong',
+            };
+            const { lastFrame } = render(_jsx(ErrorState, { error: error }));
+            const output = lastFrame() || '';
+            expect(output).toContain('Unknown Error');
+            expect(output).toContain('unexpected error');
+        });
+    });
+    describe('Retry Button', () => {
+        it('shows retry button when onRetry provided', () => {
+            const error = {
+                type: 'network',
+                message: 'Network error',
+            };
+            const { lastFrame } = render(_jsx(ErrorState, { error: error, onRetry: () => { } }));
+            const output = lastFrame() || '';
+            expect(output).toContain('Retry');
+        });
+        it('hides retry button when no onRetry', () => {
+            const error = {
+                type: 'network',
+                message: 'Network error',
+            };
+            const { lastFrame } = render(_jsx(ErrorState, { error: error }));
+            const output = lastFrame() || '';
+            expect(output).not.toContain('[r] Retry');
+        });
+    });
+    describe('Compact Mode', () => {
+        it('renders compact error with title only', () => {
+            const error = {
+                type: 'http',
+                code: 500,
+                message: 'HTTP 500: Internal Server Error',
+            };
+            const { lastFrame } = render(_jsx(ErrorState, { error: error, compact: true }));
+            const output = lastFrame() || '';
+            expect(output).toContain('Server Error');
+            // Should be shorter than full version
+            expect(output.split('\n').length).toBeLessThan(5);
+        });
+        it('shows compact retry hint', () => {
+            const error = {
+                type: 'network',
+                message: 'Network error',
+            };
+            const { lastFrame } = render(_jsx(ErrorState, { error: error, onRetry: () => { }, compact: true }));
+            const output = lastFrame() || '';
+            expect(output).toContain('[r] retry');
+        });
+    });
+    describe('Error Icon', () => {
+        it('shows warning icon', () => {
+            const error = {
+                type: 'unknown',
+                message: 'Error',
+            };
+            const { lastFrame } = render(_jsx(ErrorState, { error: error }));
+            const output = lastFrame() || '';
+            // Warning triangle unicode or similar
+            expect(output.length).toBeGreaterThan(0);
+        });
+    });
+});

package/dashboard/package.json

@@ -10,6 +10,7 @@
     "dev": "tsx src/index.tsx",
     "build": "tsc",
     "start": "node dist/index.js",
+    "server": "node server/index.js",
     "test": "vitest run",
     "test:watch": "vitest",
     "test:coverage": "vitest run --coverage"
@@ -17,6 +18,7 @@
   "dependencies": {
     "chalk": "^5.3.0",
     "dockerode": "^4.0.2",
+    "express": "^4.22.1",
     "ink": "^5.0.1",
     "ink-spinner": "^5.0.0",
     "ink-text-input": "^6.0.0",
@@ -32,6 +34,7 @@
     "ink-testing-library": "^4.0.0",
     "jsdom": "^27.4.0",
     "memfs": "^4.56.10",
+    "supertest": "^7.2.2",
     "tsx": "^4.19.2",
     "typescript": "^5.7.2",
     "vitest": "^4.0.18"

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "tlc-claude-code",
-  "version": "1.4.4",
+  "version": "1.4.6",
   "description": "TLC - Test Led Coding for Claude Code",
   "bin": {
     "tlc": "./bin/tlc.js",
@@ -55,5 +55,8 @@
     "@playwright/test": "^1.58.1",
     "playwright": "^1.58.1",
     "text-to-image": "^8.0.1"
+  },
+  "dependencies": {
+    "cookie-parser": "^1.4.7"
   }
 }