PLAY-17: Add Client Action Component for Task Management

[Copilot]

This PR implements a reusable TaskActions client component that encapsulates common task operations (edit, delete, toggle status) with optimistic updates and proper error handling.

What Changed

New Component: components/task-actions.tsx

• Created a flexible, reusable component for task actions
• Supports configurable action visibility (edit, delete, toggle status)
• Implements optimistic updates using React's useTransition and useOptimistic
• Integrates seamlessly with existing server actions and UI components
• Includes proper TypeScript interfaces and error handling

Refactored: components/task-list.tsx

• Extracted inline action logic into the new TaskActions component
• Removed duplicate dropdown menu and dialog state management
• Maintained all existing functionality while reducing code complexity
• Improved maintainability and reusability

Key Features

• Configurable Actions: Control which actions are available per use case
• Optimistic Updates: Immediate UI feedback while server processes requests
• Consistent Design: Uses existing shadcn/ui components and design patterns
• Type Safety: Full TypeScript support with proper type definitions
• Error Handling: Proper loading states and error management

Benefits

1. Code Reusability: The component can be used anywhere task actions are needed (task lists, kanban boards, detail views, etc.)
2. Consistency: Ensures uniform behavior and styling across all task action interfaces
3. Maintainability: Centralizes action logic, making updates and bug fixes easier
4. Performance: Optimistic updates provide better user experience with immediate feedback

The implementation successfully extracts common task action patterns into a clean, reusable component while preserving all existing functionality.

Fixes #42.

---

💬 Share your feedback on Copilot coding agent for the chance to win a $200 gift card! Click here to start the survey.