diff --git a/client/src/components/board/KanbanBoard.jsx b/client/src/components/board/KanbanBoard.jsx index 7fd518b..d8b6d27 100644 --- a/client/src/components/board/KanbanBoard.jsx +++ b/client/src/components/board/KanbanBoard.jsx @@ -247,11 +247,9 @@ const KanbanBoard = ({ projectId, onTaskCreate, onTaskUpdate }) => { const response = await taskService.createTask(newTask); const createdTask = response.data?.task || response.data; - // Update local state - const newColumns = { ...columns }; - newColumns[columnId].tasks.push(createdTask); - setColumns(newColumns); - + // Don't update local state here - let socket event handle it to avoid duplicates + // The handleTaskCreated socket event will add the task to the UI + // Emit real-time event emitTaskCreated(projectId, createdTask); diff --git a/client/src/components/board/TaskCreateForm.jsx b/client/src/components/board/TaskCreateForm.jsx index ddb792f..ec8283e 100644 --- a/client/src/components/board/TaskCreateForm.jsx +++ b/client/src/components/board/TaskCreateForm.jsx @@ -1,6 +1,7 @@ -import React, { useState } from 'react'; +import React, { useState, useEffect } from 'react'; import { Button, Input, Textarea, Select } from '../common'; import { useToast } from '../../hooks/useToast'; +import { userService } from '../../services/userService'; import { Calendar, Flag, User } from 'lucide-react'; const TaskCreateForm = ({ onSubmit, onCancel }) => { @@ -9,11 +10,27 @@ const TaskCreateForm = ({ onSubmit, onCancel }) => { description: '', priority: 'medium', dueDate: '', - assignee: '' + assignedTo: '' }); + const [users, setUsers] = useState([]); const [loading, setLoading] = useState(false); const { toast } = useToast(); + useEffect(() => { + fetchUsers(); + }, []); + + const fetchUsers = async () => { + try { + const response = await userService.getUsers(); + const usersData = response.data?.users || response.users || response.data || []; + setUsers(Array.isArray(usersData) ? usersData : []); + } catch (error) { + console.error('Error fetching users:', error); + setUsers([]); + } + }; + const priorityOptions = [ { value: 'low', label: 'Low Priority', color: 'text-green-600' }, { value: 'medium', label: 'Medium Priority', color: 'text-yellow-600' }, @@ -34,7 +51,7 @@ const TaskCreateForm = ({ onSubmit, onCancel }) => { title: formData.title.trim(), description: formData.description.trim(), dueDate: formData.dueDate || null, - assignee: formData.assignee || null + assignedTo: formData.assignedTo || null }; await onSubmit(taskData); @@ -46,7 +63,7 @@ const TaskCreateForm = ({ onSubmit, onCancel }) => { description: '', priority: 'medium', dueDate: '', - assignee: '' + assignedTo: '' }); } catch (error) { const errorMessage = error.response?.data?.message || error.message || 'Failed to create task'; @@ -113,6 +130,23 @@ const TaskCreateForm = ({ onSubmit, onCancel }) => { className="border-0 shadow-none p-0 text-xs focus:ring-0 text-gray-600" /> + + {/* Assignee */} +
+ + +
{/* Actions */}