Add project selector in task detail, archive completed tasks

src/stores/tasks.ts

@@ -4,6 +4,7 @@ import { api } from '@/lib/api';
 
 interface TasksState {
   tasks: Task[];
+  completedTasks: Task[];
   projects: Project[];
   labels: Label[];
   users: User[];
@@ -16,6 +17,7 @@ interface TasksState {
   
   // Actions
   fetchTasks: (params?: Parameters<typeof api.getTasks>[0]) => Promise<void>;
+  fetchCompletedTasks: (params?: Parameters<typeof api.getTasks>[0]) => Promise<void>;
   fetchProjects: () => Promise<void>;
   fetchLabels: () => Promise<void>;
   fetchUsers: () => Promise<void>;
@@ -33,6 +35,7 @@ interface TasksState {
 
 export const useTasksStore = create<TasksState>((set, get) => ({
   tasks: [],
+  completedTasks: [],
   projects: [],
   labels: [],
   users: [],
@@ -52,6 +55,15 @@ export const useTasksStore = create<TasksState>((set, get) => ({
     }
   },
 
+  fetchCompletedTasks: async (params) => {
+    try {
+      const completedTasks = await api.getTasks({ ...params, completed: true });
+      set({ completedTasks });
+    } catch (error) {
+      console.error('Failed to fetch completed tasks:', error);
+    }
+  },
+
   fetchProjects: async () => {
     try {
       const projects = await api.getProjects();
@@ -110,15 +122,25 @@ export const useTasksStore = create<TasksState>((set, get) => ({
   },
 
   toggleComplete: async (id) => {
-    const task = get().tasks.find((t) => t.id === id);
+    const task = get().tasks.find((t) => t.id === id) || get().completedTasks.find((t) => t.id === id);
     if (!task) return;
     
     const updated = await api.updateTask(id, { isCompleted: !task.isCompleted });
-    set((state) => ({
-      tasks: state.tasks.map((t) => 
-        t.id === id ? { ...t, isCompleted: !task.isCompleted, completedAt: updated.completedAt } : t
-      ),
-    }));
+    const updatedTask = { ...task, isCompleted: !task.isCompleted, completedAt: updated.completedAt };
+    
+    if (updatedTask.isCompleted) {
+      // Move from tasks to completedTasks
+      set((state) => ({
+        tasks: state.tasks.filter((t) => t.id !== id),
+        completedTasks: [updatedTask, ...state.completedTasks],
+      }));
+    } else {
+      // Move from completedTasks to tasks
+      set((state) => ({
+        tasks: [updatedTask, ...state.tasks],
+        completedTasks: state.completedTasks.filter((t) => t.id !== id),
+      }));
+    }
   },
 
   setSelectedTask: (task) => set({ selectedTask: task }),