chore: mark US-014 as complete and update progress log

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
Gustavo Henrique Santos Souza de Miranda 2026-01-21 04:19:37 -03:00
parent 87653b86cb
commit 9e03a2b9b3
2 changed files with 21 additions and 1 deletions

View File

@ -244,7 +244,7 @@
"Verify in browser using dev-browser skill" "Verify in browser using dev-browser skill"
], ],
"priority": 14, "priority": 14,
"passes": false, "passes": true,
"notes": "" "notes": ""
}, },
{ {

View File

@ -13,6 +13,8 @@
- Public auth routes: /login, /signup, /forgot-password, /reset-password - Public auth routes: /login, /signup, /forgot-password, /reset-password
- Protected routes: /dashboard, /editor/* (redirect to /login if unauthenticated) - Protected routes: /dashboard, /editor/* (redirect to /login if unauthenticated)
- Auth pages use 'use client' with useState, createClient() from lib/supabase/client.ts, and useRouter for redirects - Auth pages use 'use client' with useState, createClient() from lib/supabase/client.ts, and useRouter for redirects
- For lists with client-side updates (delete/add), use wrapper client component that receives initialData from server component
- Toast component in `src/components/Toast.tsx` for success/error notifications (auto-dismiss after 3s)
--- ---
@ -204,3 +206,21 @@
- ESLint rule react-hooks/set-state-in-effect warns against synchronous setState in useEffect - ESLint rule react-hooks/set-state-in-effect warns against synchronous setState in useEffect
- Initialize state from searchParams directly in useState() instead of setting in useEffect - Initialize state from searchParams directly in useState() instead of setting in useEffect
--- ---
## 2026-01-21 - US-014
- What was implemented: Delete project functionality with confirmation dialog and toast
- Files changed:
- src/components/ProjectCard.tsx - new client component replacing Link, with delete button and confirmation dialog
- src/components/ProjectList.tsx - new wrapper component to manage project list state and toast notifications
- src/components/Toast.tsx - new reusable toast notification component
- src/app/dashboard/page.tsx - updated to use ProjectList instead of inline rendering
- **Learnings for future iterations:**
- To enable client-side state updates (like removing items), extract list rendering from server components into client components
- ProjectList accepts initialProjects from server and manages state locally for immediate UI updates
- Use onDelete callback pattern to propagate deletion events from child (ProjectCard) to parent (ProjectList)
- Delete button uses e.stopPropagation() to prevent card click navigation when clicking delete
- Confirmation dialogs should disable close/cancel while action is in progress (isDeleting check)
- Toast component uses useCallback for handlers and auto-dismiss with setTimeout
- Toast animations can use TailwindCSS animate-in utilities (fade-in, slide-in-from-bottom-4)
- Delete icon appears on hover using group-hover:opacity-100 with parent group class
---