JACoB PR for Issue Add Archive Functionality to Task Items

[jacob-ai-bot[bot]]

Summary:

Description

Implement an archive feature for tasks by allowing users to set a task's status to "closed." This feature will enable users to better manage and organize their tasks by archiving those that are no longer active.

Requirements

1. Archive Button Addition

   • Update the TaskItem component located in the assigned-tasks folder to include an "Archive" button.
   • Position the "Archive" button in the upper right corner of the task item, to the right of the status button.
   • Ensure there is sufficient spacing between the status button and the archive button.
   • Handle overflowing text for the task title gracefully to maintain UI integrity.

2. Functionality Implementation

   • When the "Archive" button is clicked, trigger a TRPC mutation to update the task's status to "closed."
   • Research existing TRPC routes for updating tasks:
     • If an appropriate TRPC mutation exists, reuse it.
     • If not, create a new TRPC mutation specifically for archiving tasks.

3. UI Consistency

   • The archive feature should mimic the look and feel of the existing archive functionality for to-do items.
   • Ensure the styling, including icons and button behavior, aligns with current design standards.
   • Reference the TodoItem component for styling consistency.

Acceptance Criteria

• An "Archive" button is present on each task item in the assigned-tasks section.
• Clicking the "Archive" button successfully updates the task's status to "closed" via the appropriate TRPC mutation.
• The UI of the "Archive" button matches the existing archive functionality for to-do items.
• Proper spacing is maintained between the status and archive buttons.
• Task titles with overflowing text are handled without breaking the layout.
• All code adheres to the project's coding standards and passes existing tests.

---

@jacob-ai-bot --skip-build

Plan:

Step 1: Edit /src/types.ts

Task: Add TaskStatus Enum to types.ts

Instructions: In the '/src/types.ts' file, add the 'TaskStatus' enum to define the possible status values for tasks, matching the server-side enum in '/src/server/db/enums.ts'. The enum should include 'TODO', 'IN_PROGRESS', 'DONE', 'ERROR', and 'CLOSED'. This will allow the client-side code to reference 'TaskStatus' for consistent status values across client and server.

Exit Criteria: The 'types.ts' file includes the 'TaskStatus' enum with the specified values, and it can be imported and used in client-side components like 'TaskItem'.

Step 2: Edit /src/app/dashboard/[org]/[repo]/assigned-tasks/components/TaskItem.tsx

Task: Add Archive Button and Functionality to TaskItem Component

Instructions: In the 'TaskItem' component located at '/src/app/dashboard/[org]/[repo]/assigned-tasks/components/TaskItem.tsx', add an 'Archive' button to allow users to archive tasks. Import the 'ArchiveBoxIcon' from '@heroicons/react/24/outline'. Add state variables to manage the confirmation dialog (e.g., 'showConfirmation' and 'isArchiving'). Implement event handlers 'handleArchiveClick', 'handleConfirmArchive', and 'handleCancelArchive', following the pattern used in the 'TodoItem' component for consistency. Position the 'Archive' button in the upper right corner of the task item, to the right of the status button, ensuring proper spacing between them. Style the button to match the existing archive functionality in 'TodoItem', including the confirmation dialog appearance and behavior. When the 'Archive' button is clicked and the user confirms the action, trigger the TRPC mutation to update the task's status to 'CLOSED'. Ensure that task titles with overflowing text are handled gracefully without breaking the layout.

Exit Criteria: An 'Archive' button appears on each task item in the assigned-tasks section. Clicking the 'Archive' button displays a confirmation dialog. Confirming the action updates the task's status to 'CLOSED' via the appropriate TRPC mutation. The UI matches the existing archive functionality for to-do items, with proper spacing and styling, and the task layout handles overflowing text gracefully.

Step 3: Edit /src/server/api/routers/events.ts

Task: Add updateTaskStatus Mutation to events TRPC Router

Instructions: In the TRPC router located at '/src/server/api/routers/events.ts', add a new protected procedure named 'updateTaskStatus'. The mutation should accept an input object containing 'taskId' (number) and 'status' (TaskStatus enum). Implement the mutation to update the task's status in the database by inserting a new event with the updated status. Use the 'emitTaskEvent' function to emit the event so that subscribers receive the updated task information. Ensure appropriate validation of inputs and error handling are in place.

Exit Criteria: The 'events.ts' router includes a new mutation 'updateTaskStatus' that allows updating the status of a task. The mutation successfully updates the task's status to 'CLOSED' when called, and the change is reflected in the application. Proper input validation and error handling are implemented.

[jacob-ai-bot[bot]]

Hello human! 👋

This PR was created by JACoB to address the issue Add Archive Functionality to Task Items

Next Steps

1. Please review the PR carefully. Auto-generated code can and will contain subtle bugs and mistakes.

2. If you identify code that needs to be changed, please reject the PR with a specific reason. Be as detailed as possible in your comments. JACoB will take these comments, make changes to the code and push up changes. Please note that this process will take a few minutes.

3. Once the code looks good, approve the PR and merge the code.

[kleneway]

This is not really possible since we don't have a specific task item, it's wrapped up in events. we'll have to take another look at the best way to handle this...