tlc-claude-code 1.2.26 → 1.2.28

package/dashboard/dist/components/TaskDetail.test.js

@@ -0,0 +1,164 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { describe, it, expect, vi } from 'vitest';
+import { render } from 'ink-testing-library';
+import { TaskDetail } from './TaskDetail.js';
+const sampleTask = {
+    id: 't1',
+    title: 'Create user schema',
+    status: 'in_progress',
+    priority: 'high',
+    assignee: 'alice',
+    description: 'Define the database schema for users table with proper constraints and indexes.',
+    tests: { passing: 8, failing: 2 },
+    activity: [
+        { id: 'a1', type: 'status_change', timestamp: '10 min ago', user: 'alice', detail: 'Started work' },
+        { id: 'a2', type: 'comment', timestamp: '5 min ago', user: 'bob', detail: 'Looks good so far!' },
+        { id: 'a3', type: 'test_run', timestamp: '2 min ago', detail: '8/10 tests passing' },
+    ],
+    files: [
+        'src/db/schema/users.ts',
+        'src/db/migrations/001_users.sql',
+    ],
+    acceptanceCriteria: [
+        { id: 'ac1', text: 'Has id, email, passwordHash, createdAt', done: true },
+        { id: 'ac2', text: 'Email unique constraint', done: true },
+        { id: 'ac3', text: 'Password hashed with bcrypt', done: false },
+    ],
+};
+describe('TaskDetail', () => {
+    describe('Header', () => {
+        it('renders task title', () => {
+            const { lastFrame } = render(_jsx(TaskDetail, { task: sampleTask }));
+            expect(lastFrame()).toContain('Create user schema');
+        });
+        it('renders task status', () => {
+            const { lastFrame } = render(_jsx(TaskDetail, { task: sampleTask }));
+            expect(lastFrame()).toMatch(/in.progress|working/i);
+        });
+        it('renders priority', () => {
+            const { lastFrame } = render(_jsx(TaskDetail, { task: sampleTask }));
+            expect(lastFrame()).toContain('high');
+        });
+        it('renders assignee', () => {
+            const { lastFrame } = render(_jsx(TaskDetail, { task: sampleTask }));
+            expect(lastFrame()).toContain('alice');
+        });
+    });
+    describe('Description', () => {
+        it('shows full description', () => {
+            const { lastFrame } = render(_jsx(TaskDetail, { task: sampleTask }));
+            expect(lastFrame()).toContain('Define the database schema');
+        });
+    });
+    describe('Acceptance Criteria', () => {
+        it('shows acceptance criteria', () => {
+            const { lastFrame } = render(_jsx(TaskDetail, { task: sampleTask }));
+            expect(lastFrame()).toContain('Has id, email');
+            expect(lastFrame()).toContain('Email unique');
+        });
+        it('shows completed criteria with checkmark', () => {
+            const { lastFrame } = render(_jsx(TaskDetail, { task: sampleTask }));
+            expect(lastFrame()).toMatch(/\[x\]|✓/);
+        });
+        it('shows incomplete criteria without checkmark', () => {
+            const { lastFrame } = render(_jsx(TaskDetail, { task: sampleTask }));
+            expect(lastFrame()).toContain('Password hashed');
+        });
+        it('shows criteria count', () => {
+            const { lastFrame } = render(_jsx(TaskDetail, { task: sampleTask }));
+            expect(lastFrame()).toContain('2/3');
+        });
+    });
+    describe('Test Status', () => {
+        it('shows test counts', () => {
+            const { lastFrame } = render(_jsx(TaskDetail, { task: sampleTask }));
+            expect(lastFrame()).toContain('8');
+            expect(lastFrame()).toContain('10');
+        });
+        it('shows failing tests', () => {
+            const { lastFrame } = render(_jsx(TaskDetail, { task: sampleTask }));
+            expect(lastFrame()).toMatch(/2.*(fail|✗)/i);
+        });
+    });
+    describe('Files', () => {
+        it('shows related files', () => {
+            const { lastFrame } = render(_jsx(TaskDetail, { task: sampleTask }));
+            expect(lastFrame()).toContain('users.ts');
+            expect(lastFrame()).toContain('001_users.sql');
+        });
+    });
+    describe('Activity', () => {
+        it('shows activity entries', () => {
+            const { lastFrame } = render(_jsx(TaskDetail, { task: sampleTask }));
+            expect(lastFrame()).toContain('Started work');
+            expect(lastFrame()).toContain('Looks good');
+        });
+        it('shows activity timestamps', () => {
+            const { lastFrame } = render(_jsx(TaskDetail, { task: sampleTask }));
+            expect(lastFrame()).toContain('10 min ago');
+        });
+        it('shows activity users', () => {
+            const { lastFrame } = render(_jsx(TaskDetail, { task: sampleTask }));
+            expect(lastFrame()).toContain('alice');
+            expect(lastFrame()).toContain('bob');
+        });
+    });
+    describe('Actions', () => {
+        it('shows claim action for unassigned task', () => {
+            const unassignedTask = { ...sampleTask, assignee: undefined };
+            const { lastFrame } = render(_jsx(TaskDetail, { task: unassignedTask }));
+            expect(lastFrame()).toContain('c');
+        });
+        it('shows release action for assigned task', () => {
+            const { lastFrame } = render(_jsx(TaskDetail, { task: sampleTask }));
+            expect(lastFrame()).toContain('r');
+        });
+        it('shows status change actions', () => {
+            const { lastFrame } = render(_jsx(TaskDetail, { task: sampleTask }));
+            // Shows [d]one action for in-progress task
+            expect(lastFrame()).toContain('[d]one');
+        });
+    });
+    describe('Navigation', () => {
+        it('shows back navigation hint', () => {
+            const { lastFrame } = render(_jsx(TaskDetail, { task: sampleTask }));
+            expect(lastFrame()).toContain('Esc');
+        });
+        it('calls onBack when provided', () => {
+            const onBack = vi.fn();
+            const { lastFrame } = render(_jsx(TaskDetail, { task: sampleTask, onBack: onBack }));
+            expect(lastFrame()).toContain('Esc');
+        });
+    });
+    describe('Callbacks', () => {
+        it('calls onClaim when claim action triggered', () => {
+            const onClaim = vi.fn();
+            render(_jsx(TaskDetail, { task: sampleTask, onClaim: onClaim }));
+            // Claim happens on 'c' key
+        });
+        it('calls onRelease when release action triggered', () => {
+            const onRelease = vi.fn();
+            render(_jsx(TaskDetail, { task: sampleTask, onRelease: onRelease }));
+            // Release happens on 'r' key
+        });
+        it('calls onStatusChange when status changed', () => {
+            const onStatusChange = vi.fn();
+            render(_jsx(TaskDetail, { task: sampleTask, onStatusChange: onStatusChange }));
+            // Status change happens on specific keys
+        });
+    });
+    describe('Minimal Task', () => {
+        it('renders with minimal data', () => {
+            const minimalTask = {
+                id: 'min',
+                title: 'Minimal',
+                status: 'pending',
+                activity: [],
+                files: [],
+                acceptanceCriteria: [],
+            };
+            const { lastFrame } = render(_jsx(TaskDetail, { task: minimalTask }));
+            expect(lastFrame()).toContain('Minimal');
+        });
+    });
+});

package/dashboard/dist/components/TaskFilter.d.ts

@@ -0,0 +1,12 @@
+import { TaskStatus, TaskPriority } from './TaskCard.js';
+export interface FilterState {
+    assignee?: string;
+    status?: TaskStatus[];
+    priority?: TaskPriority[];
+}
+export interface TaskFilterProps {
+    assignees: string[];
+    filters: FilterState;
+    onChange: (filters: FilterState) => void;
+}
+export declare function TaskFilter({ assignees, filters, onChange, }: TaskFilterProps): import("react/jsx-runtime").JSX.Element;

package/dashboard/dist/components/TaskFilter.js

@@ -0,0 +1,138 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState, useMemo } from 'react';
+import { Box, Text, useInput } from 'ink';
+const statuses = [
+    { key: 'pending', label: 'Pending' },
+    { key: 'in_progress', label: 'In Progress' },
+    { key: 'completed', label: 'Completed' },
+];
+const priorities = [
+    { key: 'high', label: 'High' },
+    { key: 'medium', label: 'Medium' },
+    { key: 'low', label: 'Low' },
+];
+export function TaskFilter({ assignees, filters, onChange, }) {
+    const [activeSection, setActiveSection] = useState(assignees.length > 0 ? 'assignee' : 'status');
+    const [activeIndex, setActiveIndex] = useState(0);
+    // Build options for current section
+    const currentOptions = useMemo(() => {
+        switch (activeSection) {
+            case 'assignee':
+                return ['All', ...assignees];
+            case 'status':
+                return statuses.map((s) => s.label);
+            case 'priority':
+                return priorities.map((p) => p.label);
+        }
+    }, [activeSection, assignees]);
+    // Count active filters
+    const activeFilterCount = useMemo(() => {
+        let count = 0;
+        if (filters.assignee)
+            count++;
+        if (filters.status && filters.status.length > 0)
+            count++;
+        if (filters.priority && filters.priority.length > 0)
+            count++;
+        return count;
+    }, [filters]);
+    // Get sections to show
+    const sections = useMemo(() => {
+        const s = [];
+        if (assignees.length > 0)
+            s.push('assignee');
+        s.push('status', 'priority');
+        return s;
+    }, [assignees]);
+    useInput((input, key) => {
+        // Section navigation (Tab)
+        if (key.tab) {
+            const currentIdx = sections.indexOf(activeSection);
+            const nextIdx = (currentIdx + 1) % sections.length;
+            setActiveSection(sections[nextIdx]);
+            setActiveIndex(0);
+            return;
+        }
+        // Item navigation
+        if (key.downArrow || input === 'j') {
+            setActiveIndex((prev) => Math.min(prev + 1, currentOptions.length - 1));
+        }
+        else if (key.upArrow || input === 'k') {
+            setActiveIndex((prev) => Math.max(prev - 1, 0));
+        }
+        // Toggle selection
+        else if (input === ' ' || key.return) {
+            handleToggle();
+        }
+        // Clear all
+        else if (input === 'c') {
+            onChange({});
+        }
+    });
+    const handleToggle = () => {
+        const newFilters = { ...filters };
+        switch (activeSection) {
+            case 'assignee': {
+                const selected = currentOptions[activeIndex];
+                if (selected === 'All') {
+                    delete newFilters.assignee;
+                }
+                else {
+                    newFilters.assignee = selected;
+                }
+                break;
+            }
+            case 'status': {
+                const statusKey = statuses[activeIndex].key;
+                const current = filters.status || [];
+                if (current.includes(statusKey)) {
+                    newFilters.status = current.filter((s) => s !== statusKey);
+                    if (newFilters.status.length === 0)
+                        delete newFilters.status;
+                }
+                else {
+                    newFilters.status = [...current, statusKey];
+                }
+                break;
+            }
+            case 'priority': {
+                const priorityKey = priorities[activeIndex].key;
+                const current = filters.priority || [];
+                if (current.includes(priorityKey)) {
+                    newFilters.priority = current.filter((p) => p !== priorityKey);
+                    if (newFilters.priority.length === 0)
+                        delete newFilters.priority;
+                }
+                else {
+                    newFilters.priority = [...current, priorityKey];
+                }
+                break;
+            }
+        }
+        onChange(newFilters);
+    };
+    const isSelected = (section, index) => {
+        switch (section) {
+            case 'assignee':
+                const option = index === 0 ? undefined : assignees[index - 1];
+                return filters.assignee === option;
+            case 'status':
+                return (filters.status || []).includes(statuses[index].key);
+            case 'priority':
+                return (filters.priority || []).includes(priorities[index].key);
+        }
+    };
+    return (_jsxs(Box, { flexDirection: "column", children: [_jsxs(Box, { marginBottom: 1, children: [_jsx(Text, { bold: true, children: "Filters" }), activeFilterCount > 0 && (_jsxs(Text, { dimColor: true, children: [" (", activeFilterCount, " active)"] }))] }), assignees.length > 0 && (_jsxs(Box, { flexDirection: "column", marginBottom: 1, children: [_jsx(Text, { bold: true, color: activeSection === 'assignee' ? 'cyan' : 'white', children: "Assignee" }), ['All', ...assignees].map((name, idx) => {
+                        const isActive = activeSection === 'assignee' && activeIndex === idx;
+                        const selected = name === 'All' ? !filters.assignee : filters.assignee === name;
+                        return (_jsxs(Box, { children: [_jsx(Text, { color: isActive ? 'cyan' : undefined, children: isActive ? '▶ ' : '  ' }), _jsx(Text, { color: selected ? 'green' : 'gray', children: selected ? '● ' : '○ ' }), _jsx(Text, { children: name })] }, name));
+                    })] })), _jsxs(Box, { flexDirection: "column", marginBottom: 1, children: [_jsx(Text, { bold: true, color: activeSection === 'status' ? 'cyan' : 'white', children: "Status" }), statuses.map((status, idx) => {
+                        const isActive = activeSection === 'status' && activeIndex === idx;
+                        const selected = (filters.status || []).includes(status.key);
+                        return (_jsxs(Box, { children: [_jsx(Text, { color: isActive ? 'cyan' : undefined, children: isActive ? '▶ ' : '  ' }), _jsx(Text, { color: selected ? 'green' : 'gray', children: selected ? '[x] ' : '[ ] ' }), _jsx(Text, { children: status.label })] }, status.key));
+                    })] }), _jsxs(Box, { flexDirection: "column", marginBottom: 1, children: [_jsx(Text, { bold: true, color: activeSection === 'priority' ? 'cyan' : 'white', children: "Priority" }), priorities.map((priority, idx) => {
+                        const isActive = activeSection === 'priority' && activeIndex === idx;
+                        const selected = (filters.priority || []).includes(priority.key);
+                        return (_jsxs(Box, { children: [_jsx(Text, { color: isActive ? 'cyan' : undefined, children: isActive ? '▶ ' : '  ' }), _jsx(Text, { color: selected ? 'green' : 'gray', children: selected ? '[x] ' : '[ ] ' }), _jsx(Text, { children: priority.label })] }, priority.key));
+                    })] }), _jsx(Box, { marginTop: 1, children: _jsx(Text, { dimColor: true, children: "\u2191/k \u2193/j navigate \u2022 Space toggle \u2022 Tab section \u2022 c clear" }) })] }));
+}

package/dashboard/dist/components/TaskFilter.test.d.ts

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

package/dashboard/dist/components/TaskFilter.test.js

@@ -0,0 +1,109 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { describe, it, expect, vi } from 'vitest';
+import { render } from 'ink-testing-library';
+import { TaskFilter } from './TaskFilter.js';
+describe('TaskFilter', () => {
+    describe('Assignee Filter', () => {
+        it('shows assignee options', () => {
+            const { lastFrame } = render(_jsx(TaskFilter, { assignees: ['alice', 'bob', 'carol'], filters: {}, onChange: () => { } }));
+            expect(lastFrame()).toContain('alice');
+            expect(lastFrame()).toContain('bob');
+            expect(lastFrame()).toContain('carol');
+        });
+        it('shows selected assignee', () => {
+            const { lastFrame } = render(_jsx(TaskFilter, { assignees: ['alice', 'bob'], filters: { assignee: 'alice' }, onChange: () => { } }));
+            // Should indicate alice is selected
+            expect(lastFrame()).toMatch(/alice.*\[x\]|\[x\].*alice|●.*alice/i);
+        });
+        it('shows "All" option for assignee', () => {
+            const { lastFrame } = render(_jsx(TaskFilter, { assignees: ['alice'], filters: {}, onChange: () => { } }));
+            expect(lastFrame()).toMatch(/all|any/i);
+        });
+    });
+    describe('Status Filter', () => {
+        it('shows status toggle options', () => {
+            const { lastFrame } = render(_jsx(TaskFilter, { assignees: [], filters: {}, onChange: () => { } }));
+            expect(lastFrame()).toContain('Pending');
+            expect(lastFrame()).toContain('In Progress');
+            expect(lastFrame()).toContain('Completed');
+        });
+        it('shows active status filter', () => {
+            const { lastFrame } = render(_jsx(TaskFilter, { assignees: [], filters: { status: ['pending', 'in_progress'] }, onChange: () => { } }));
+            expect(lastFrame()).toContain('Pending');
+            expect(lastFrame()).toContain('In Progress');
+        });
+    });
+    describe('Priority Filter', () => {
+        it('shows priority toggle options', () => {
+            const { lastFrame } = render(_jsx(TaskFilter, { assignees: [], filters: {}, onChange: () => { } }));
+            expect(lastFrame()).toContain('High');
+            expect(lastFrame()).toContain('Medium');
+            expect(lastFrame()).toContain('Low');
+        });
+        it('shows active priority filter', () => {
+            const { lastFrame } = render(_jsx(TaskFilter, { assignees: [], filters: { priority: ['high'] }, onChange: () => { } }));
+            expect(lastFrame()).toContain('High');
+        });
+    });
+    describe('Clear Filters', () => {
+        it('shows clear all option', () => {
+            const { lastFrame } = render(_jsx(TaskFilter, { assignees: ['alice'], filters: { assignee: 'alice' }, onChange: () => { } }));
+            expect(lastFrame()).toMatch(/clear|reset/i);
+        });
+        it('calls onChange with empty filters on clear', () => {
+            const onChange = vi.fn();
+            render(_jsx(TaskFilter, { assignees: ['alice'], filters: { assignee: 'alice' }, onChange: onChange }));
+            // Clear happens on specific key press
+        });
+    });
+    describe('Active Filter Count', () => {
+        it('shows filter count when filters active', () => {
+            const { lastFrame } = render(_jsx(TaskFilter, { assignees: ['alice'], filters: { assignee: 'alice', status: ['pending'] }, onChange: () => { } }));
+            // Should show "2 active" or similar
+            expect(lastFrame()).toMatch(/2.*active|filters.*2/i);
+        });
+        it('shows no count when no filters', () => {
+            const { lastFrame } = render(_jsx(TaskFilter, { assignees: ['alice'], filters: {}, onChange: () => { } }));
+            expect(lastFrame()).not.toMatch(/\d+ active/i);
+        });
+    });
+    describe('Navigation', () => {
+        it('shows navigation hints', () => {
+            const { lastFrame } = render(_jsx(TaskFilter, { assignees: ['alice'], filters: {}, onChange: () => { } }));
+            expect(lastFrame()).toMatch(/↑|↓|j|k/);
+        });
+        it('shows toggle hint', () => {
+            const { lastFrame } = render(_jsx(TaskFilter, { assignees: ['alice'], filters: {}, onChange: () => { } }));
+            expect(lastFrame()).toMatch(/space|enter|toggle/i);
+        });
+    });
+    describe('Section Labels', () => {
+        it('shows Assignee label', () => {
+            const { lastFrame } = render(_jsx(TaskFilter, { assignees: ['alice'], filters: {}, onChange: () => { } }));
+            expect(lastFrame()).toContain('Assignee');
+        });
+        it('shows Status label', () => {
+            const { lastFrame } = render(_jsx(TaskFilter, { assignees: [], filters: {}, onChange: () => { } }));
+            expect(lastFrame()).toContain('Status');
+        });
+        it('shows Priority label', () => {
+            const { lastFrame } = render(_jsx(TaskFilter, { assignees: [], filters: {}, onChange: () => { } }));
+            expect(lastFrame()).toContain('Priority');
+        });
+    });
+    describe('Callbacks', () => {
+        it('calls onChange when filter changed', () => {
+            const onChange = vi.fn();
+            render(_jsx(TaskFilter, { assignees: ['alice'], filters: {}, onChange: onChange }));
+            // onChange happens on selection
+        });
+    });
+    describe('Empty Assignees', () => {
+        it('hides assignee section when no assignees', () => {
+            const { lastFrame } = render(_jsx(TaskFilter, { assignees: [], filters: {}, onChange: () => { } }));
+            // Should still show Status and Priority
+            expect(lastFrame()).toContain('Status');
+            expect(lastFrame()).toContain('Priority');
+        });
+    });
+});

package/dashboard/dist/components/TeamPanel.d.ts

@@ -0,0 +1,15 @@
+import { TeamMember } from './TeamPresence.js';
+import { Activity } from './ActivityFeed.js';
+import { Environment } from './EnvironmentBadge.js';
+export interface TeamPanelProps {
+    members: TeamMember[];
+    activities: Activity[];
+    environment: Environment;
+    currentUserId?: string;
+    connected?: boolean;
+    activityLimit?: number;
+    isActive?: boolean;
+    onRefresh?: () => void;
+    onReconnect?: () => void;
+}
+export declare function TeamPanel({ members, activities, environment, currentUserId, connected, activityLimit, isActive, onRefresh, onReconnect, }: TeamPanelProps): import("react/jsx-runtime").JSX.Element;

package/dashboard/dist/components/TeamPanel.js

@@ -0,0 +1,24 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Box, Text, useInput } from 'ink';
+import { TeamPresence } from './TeamPresence.js';
+import { ActivityFeed } from './ActivityFeed.js';
+export function TeamPanel({ members, activities, environment, currentUserId, connected = true, activityLimit = 10, isActive = true, onRefresh, onReconnect, }) {
+    useInput((input) => {
+        if (!isActive)
+            return;
+        if (input === 'r') {
+            if (!connected && onReconnect) {
+                onReconnect();
+            }
+            else if (onRefresh) {
+                onRefresh();
+            }
+        }
+    }, { isActive });
+    // Local mode - show minimal view
+    if (environment === 'local') {
+        return (_jsxs(Box, { flexDirection: "column", padding: 1, children: [_jsxs(Box, { marginBottom: 1, children: [_jsx(Text, { bold: true, children: "Team " }), _jsx(Text, { color: "green", children: "[local]" })] }), _jsx(Box, { children: _jsx(Text, { dimColor: true, children: "Solo mode - team features available on VPS" }) }), _jsx(Box, { marginTop: 1, children: _jsx(Text, { dimColor: true, children: "Run /tlc:deploy for team collaboration" }) })] }));
+    }
+    const onlineCount = members.filter((m) => m.status === 'online').length;
+    return (_jsxs(Box, { flexDirection: "column", children: [_jsxs(Box, { marginBottom: 1, children: [_jsx(Text, { bold: true, children: "Team " }), _jsxs(Text, { color: "cyan", children: ["[", environment, "]"] }), connected ? (_jsx(Text, { color: "green", children: " \u25CF connected" })) : (_jsx(Text, { color: "red", children: " \u25CB disconnected" }))] }), !connected && (_jsx(Box, { marginBottom: 1, borderStyle: "single", borderColor: "red", paddingX: 1, children: _jsx(Text, { color: "red", children: "Connection lost - press r to reconnect" }) })), _jsx(Box, { flexDirection: "column", borderStyle: "single", borderColor: "gray", paddingX: 1, marginBottom: 1, children: members.length === 0 ? (_jsxs(Box, { flexDirection: "column", children: [_jsx(Text, { bold: true, children: "Team Members" }), _jsx(Text, { dimColor: true, children: "No team members online (solo mode)" })] })) : (_jsx(TeamPresence, { members: members, currentUserId: currentUserId, compact: true })) }), _jsx(Box, { flexDirection: "column", borderStyle: "single", borderColor: "gray", paddingX: 1, children: activities.length === 0 ? (_jsxs(Box, { flexDirection: "column", children: [_jsx(Text, { bold: true, children: "Activity" }), _jsx(Text, { dimColor: true, children: "No activity yet - it's quiet here" })] })) : (_jsx(ActivityFeed, { activities: activities, limit: activityLimit, compact: true })) }), _jsx(Box, { marginTop: 1, children: _jsxs(Text, { dimColor: true, children: ["r ", connected ? 'refresh' : 'reconnect'] }) })] }));
+}

package/dashboard/dist/components/TeamPanel.test.d.ts

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

package/dashboard/dist/components/TeamPanel.test.js

@@ -0,0 +1,109 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { describe, it, expect, vi } from 'vitest';
+import { render } from 'ink-testing-library';
+import { TeamPanel } from './TeamPanel.js';
+const sampleMembers = [
+    { id: 'u1', name: 'Alice', status: 'online', activity: 'Working on Task 3' },
+    { id: 'u2', name: 'Bob', status: 'away' },
+];
+const sampleActivities = [
+    { id: 'a1', type: 'commit', user: 'alice', message: 'Fixed bug', timestamp: '2 min ago' },
+    { id: 'a2', type: 'claim', user: 'bob', message: 'Claimed Task 5', timestamp: '5 min ago' },
+];
+describe('TeamPanel', () => {
+    describe('Presence Display', () => {
+        it('shows team members', () => {
+            const { lastFrame } = render(_jsx(TeamPanel, { members: sampleMembers, activities: sampleActivities, environment: "vps" }));
+            expect(lastFrame()).toContain('Alice');
+            expect(lastFrame()).toContain('Bob');
+        });
+        it('shows online count', () => {
+            const { lastFrame } = render(_jsx(TeamPanel, { members: sampleMembers, activities: sampleActivities, environment: "vps" }));
+            expect(lastFrame()).toMatch(/1.*online|online.*1/i);
+        });
+    });
+    describe('Activity Display', () => {
+        it('shows recent activities', () => {
+            const { lastFrame } = render(_jsx(TeamPanel, { members: sampleMembers, activities: sampleActivities, environment: "vps" }));
+            expect(lastFrame()).toContain('Fixed bug');
+            expect(lastFrame()).toContain('Claimed Task 5');
+        });
+    });
+    describe('Local Mode', () => {
+        it('shows minimal view in local mode', () => {
+            const { lastFrame } = render(_jsx(TeamPanel, { members: sampleMembers, activities: sampleActivities, environment: "local" }));
+            // Should show that team features are for VPS
+            expect(lastFrame()).toMatch(/local|team.*vps|solo/i);
+        });
+        it('hides team features in local mode', () => {
+            const { lastFrame } = render(_jsx(TeamPanel, { members: [], activities: [], environment: "local" }));
+            expect(lastFrame()).toMatch(/local|solo/i);
+        });
+    });
+    describe('VPS Mode', () => {
+        it('shows full team panel in VPS mode', () => {
+            const { lastFrame } = render(_jsx(TeamPanel, { members: sampleMembers, activities: sampleActivities, environment: "vps" }));
+            expect(lastFrame()).toContain('Alice');
+            expect(lastFrame()).toContain('Fixed bug');
+        });
+    });
+    describe('Connection Status', () => {
+        it('shows connected status', () => {
+            const { lastFrame } = render(_jsx(TeamPanel, { members: sampleMembers, activities: sampleActivities, environment: "vps", connected: true }));
+            expect(lastFrame()).toMatch(/●|connected|online/i);
+        });
+        it('shows disconnected status', () => {
+            const { lastFrame } = render(_jsx(TeamPanel, { members: sampleMembers, activities: sampleActivities, environment: "vps", connected: false }));
+            expect(lastFrame()).toMatch(/○|disconnected|offline|reconnect/i);
+        });
+        it('shows reconnect hint when disconnected', () => {
+            const { lastFrame } = render(_jsx(TeamPanel, { members: sampleMembers, activities: sampleActivities, environment: "vps", connected: false }));
+            expect(lastFrame()).toMatch(/reconnect|retry|r/i);
+        });
+    });
+    describe('Refresh Action', () => {
+        it('shows refresh hint', () => {
+            const { lastFrame } = render(_jsx(TeamPanel, { members: sampleMembers, activities: sampleActivities, environment: "vps" }));
+            expect(lastFrame()).toMatch(/refresh|r|reload/i);
+        });
+        it('calls onRefresh when triggered', () => {
+            const onRefresh = vi.fn();
+            render(_jsx(TeamPanel, { members: sampleMembers, activities: sampleActivities, environment: "vps", onRefresh: onRefresh }));
+            // Refresh happens on 'r' key
+        });
+    });
+    describe('Empty State', () => {
+        it('shows empty state for no members', () => {
+            const { lastFrame } = render(_jsx(TeamPanel, { members: [], activities: sampleActivities, environment: "vps" }));
+            expect(lastFrame()).toMatch(/no.*team|solo|alone/i);
+        });
+        it('shows empty state for no activity', () => {
+            const { lastFrame } = render(_jsx(TeamPanel, { members: sampleMembers, activities: [], environment: "vps" }));
+            expect(lastFrame()).toMatch(/no.*activity|quiet/i);
+        });
+    });
+    describe('Header', () => {
+        it('shows Team header', () => {
+            const { lastFrame } = render(_jsx(TeamPanel, { members: sampleMembers, activities: sampleActivities, environment: "vps" }));
+            expect(lastFrame()).toMatch(/team/i);
+        });
+        it('shows environment badge', () => {
+            const { lastFrame } = render(_jsx(TeamPanel, { members: sampleMembers, activities: sampleActivities, environment: "staging" }));
+            expect(lastFrame()).toMatch(/staging/i);
+        });
+    });
+    describe('Activity Limit', () => {
+        it('limits activities shown', () => {
+            const manyActivities = Array.from({ length: 20 }, (_, i) => ({
+                id: `a${i}`,
+                type: 'commit',
+                user: 'alice',
+                message: `Activity ${i}`,
+                timestamp: `${i} min ago`,
+            }));
+            const { lastFrame } = render(_jsx(TeamPanel, { members: sampleMembers, activities: manyActivities, environment: "vps", activityLimit: 5 }));
+            // Should show limited activities
+            expect(lastFrame()).toBeDefined();
+        });
+    });
+});

package/dashboard/dist/components/TeamPresence.d.ts

@@ -0,0 +1,14 @@
+export type MemberStatus = 'online' | 'away' | 'offline';
+export interface TeamMember {
+    id: string;
+    name: string;
+    status: MemberStatus;
+    activity?: string;
+    avatar?: string;
+}
+export interface TeamPresenceProps {
+    members: TeamMember[];
+    currentUserId?: string;
+    compact?: boolean;
+}
+export declare function TeamPresence({ members, currentUserId, compact, }: TeamPresenceProps): import("react/jsx-runtime").JSX.Element;

package/dashboard/dist/components/TeamPresence.js

@@ -0,0 +1,31 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useMemo } from 'react';
+import { Box, Text } from 'ink';
+const statusIndicators = {
+    online: { icon: '●', color: 'green' },
+    away: { icon: '◐', color: 'yellow' },
+    offline: { icon: '○', color: 'gray' },
+};
+const statusOrder = {
+    online: 0,
+    away: 1,
+    offline: 2,
+};
+export function TeamPresence({ members, currentUserId, compact = false, }) {
+    // Sort members: online first, then away, then offline
+    const sortedMembers = useMemo(() => {
+        return [...members].sort((a, b) => {
+            return statusOrder[a.status] - statusOrder[b.status];
+        });
+    }, [members]);
+    const onlineCount = members.filter((m) => m.status === 'online').length;
+    // Empty state
+    if (members.length === 0) {
+        return (_jsxs(Box, { flexDirection: "column", padding: 1, children: [_jsx(Text, { bold: true, children: "Team" }), _jsx(Box, { marginTop: 1, children: _jsx(Text, { dimColor: true, children: "No team members (solo mode)" }) })] }));
+    }
+    return (_jsxs(Box, { flexDirection: "column", children: [_jsxs(Box, { marginBottom: 1, children: [_jsx(Text, { bold: true, children: "Team " }), _jsxs(Text, { dimColor: true, children: ["(", onlineCount, " online of ", members.length, ")"] })] }), sortedMembers.map((member) => {
+                const { icon, color } = statusIndicators[member.status];
+                const isCurrentUser = member.id === currentUserId;
+                return (_jsxs(Box, { marginBottom: compact ? 0 : 1, flexDirection: compact ? 'row' : 'column', children: [_jsxs(Box, { children: [_jsxs(Text, { color: color, children: [icon, " "] }), member.avatar && (_jsxs(Text, { color: "magenta", children: ["[", member.avatar, "] "] })), _jsx(Text, { bold: isCurrentUser, color: isCurrentUser ? 'cyan' : 'white', children: member.name }), isCurrentUser && (_jsx(Text, { dimColor: true, children: " (you)" })), compact && member.activity && member.status !== 'offline' && (_jsxs(Text, { dimColor: true, children: [" - ", member.activity.slice(0, 30)] }))] }), !compact && member.activity && (_jsx(Box, { marginLeft: 3, children: _jsx(Text, { dimColor: true, children: member.activity }) }))] }, member.id));
+            })] }));
+}

package/dashboard/dist/components/TeamPresence.test.d.ts

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