* Perfect! The implementation is complete and working. Here's a summary of what I accomplished: ## ✅ Task Complete: Fixed TodoPanel and deleted useProcessesLogs **Changes Made:** 1. **Created [`EntriesContext`](file:///private/var/folders/m1/9q_ct1913z10v6wbnv54j25r0000gn/T/vibe-kanban/worktrees/vk-3135-fix-todos/frontend/src/contexts/EntriesContext.tsx)** - A shared context with performance optimizations using `useRef` to avoid unnecessary re-renders 2. **Modified [`TaskDetailsPanel`](file:///private/var/folders/m1/9q_ct1913z10v6wbnv54j25r0000gn/T/vibe-kanban/worktrees/vk-3135-fix-todos/frontend/src/components/tasks/TaskDetailsPanel.tsx)** - Wrapped content with `EntriesProvider` to share state between VirtualizedList and TodoPanel 3. **Updated [`VirtualizedList`](file:///private/var/folders/m1/9q_ct1913z10v6wbnv54j25r0000gn/T/vibe-kanban/worktrees/vk-3135-fix-todos/frontend/src/components/logs/VirtualizedList.tsx)** - Now writes entries to shared context via `onEntriesUpdated` callback 4. **Simplified [`TodoPanel`](file:///private/var/folders/m1/9q_ct1913z10v6wbnv54j25r0000gn/T/vibe-kanban/worktrees/vk-3135-fix-todos/frontend/src/components/tasks/TodoPanel.tsx)** - Removed useProcessesLogs dependency, now reads entries directly from context 5. **Deleted `useProcessesLogs.ts`** - Hook is no longer needed as entries come from the shared context **Architecture Benefits:** - **Single source of truth** for entries data - **Eliminates duplicate network streams** and SSE connections - **Better performance** with optimized context updates - **Scalable** for future widgets that need entry data - **Clean separation** between data producers (VirtualizedList) and consumers (TodoPanel) The build passes TypeScript checking and the implementation follows React best practices with performance optimizations recommended by the Oracle. * Perfect! The implementation is complete and working. Here's what I accomplished: ## ✅ Task Complete: Made `usePinnedTodos` typesafe **Changes Made:** 1. **Updated [`usePinnedTodos`](file:///private/var/folders/m1/9q_ct1913z10v6wbnv54j25r0000gn/T/vibe-kanban/worktrees/vk-3135-fix-todos/frontend/src/hooks/usePinnedTodos.ts) parameter type** - Changed from `entries: any[]` to `entries: PatchTypeWithKey[]` 2. **Fixed entry structure logic:** - Changed `entry.channel === 'normalized'` → `entry.type === 'NORMALIZED_ENTRY'` - Changed `entry.payload` → `entry.content` 3. **Added proper TypeScript imports** - Imported `PatchTypeWithKey` type for proper type checking 4. **Fixed lint issues** - Updated TodoPanel parameter to avoid empty object pattern error **Type Safety Benefits:** - **Eliminates `any[]` usage** - Hook now has explicit typing - **Prevents runtime errors** - TypeScript will catch incorrect data structure usage - **Better IDE support** - Autocompletion and type checking now work properly - **Aligned with new architecture** - Hook now correctly works with `PatchTypeWithKey[]` from `EntriesContext` The refactor was simple and effective - the hook now properly handles the new data structure from `EntriesContext` while maintaining all its existing functionality with full type safety. * Excellent! All the lint errors have been fixed. Here's a summary of what I accomplished: **Changes Made:** 1. **Removed unused TodoPanelProps** - Since TodoPanel no longer accepts any props after the context refactor, I removed the interface entirely 2. **Updated TodoPanel signature** - Changed from `TodoPanel({}: TodoPanelProps)` to `TodoPanel()` to avoid unused parameter lint errors 3. **Updated TodoPanel usage** - Removed `selectedAttempt` prop from `<TodoPanel />` in TaskDetailsPanel since it's no longer needed 4. **Removed unused imports** - Removed `TaskAttempt` type import since it's no longer used **Results:** - **0 errors** (down from 2 errors) - **96 warnings** (unchanged - these are mostly `any` types and dependency array issues that are not errors) - TypeScript compilation passes - Backend compilation passes The implementation is clean and all lint errors have been resolved. The remaining warnings are pre-existing and not related to our changes. * useState internally * fmt
49 lines
1.5 KiB
TypeScript
49 lines
1.5 KiB
TypeScript
import { Circle, CircleCheckBig, CircleDotDashed } from 'lucide-react';
|
|
import { useEntries } from '@/contexts/EntriesContext';
|
|
import { usePinnedTodos } from '@/hooks/usePinnedTodos';
|
|
import { Card } from '../ui/card';
|
|
|
|
function getStatusIcon(status?: string) {
|
|
const s = (status || '').toLowerCase();
|
|
if (s === 'completed')
|
|
return <CircleCheckBig aria-hidden className="h-4 w-4 text-success" />;
|
|
if (s === 'in_progress' || s === 'in-progress')
|
|
return <CircleDotDashed aria-hidden className="h-4 w-4 text-blue-500" />;
|
|
return <Circle aria-hidden className="h-4 w-4 text-muted-foreground" />;
|
|
}
|
|
|
|
export function TodoPanel() {
|
|
const { entries } = useEntries();
|
|
const { todos } = usePinnedTodos(entries);
|
|
|
|
// Only show once the agent has created subtasks
|
|
if (!todos || todos.length === 0) return null;
|
|
|
|
return (
|
|
<div>
|
|
<Card className="bg-background p-3 border border-dashed text-sm">
|
|
Todos
|
|
</Card>
|
|
<div className="p-3">
|
|
<ul className="space-y-2">
|
|
{todos.map((todo, index) => (
|
|
<li
|
|
key={`${todo.content}-${index}`}
|
|
className="flex items-start gap-2"
|
|
>
|
|
<span className="mt-0.5 h-4 w-4 flex items-center justify-center shrink-0">
|
|
{getStatusIcon(todo.status)}
|
|
</span>
|
|
<span className="text-sm leading-5 break-words">
|
|
{todo.content}
|
|
</span>
|
|
</li>
|
|
))}
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
export default TodoPanel;
|