moving column

src/pages/taskmanager/workspace.tsx

@@ -5,12 +5,16 @@ import HeaderWorkspace from "./components/HeaderWorkspace";
 import TaskDetailModal from "./components/task-detail/TaskDetailModal";
 import tasksData from "./data/tasks.json";
 import type { Task, WorkspaceData } from "./types";
+import { reorderColumns } from "./utils/reorderColumns";
 import { reorderTasks } from "./utils/reorderTasks";
 
 const Workspace: FC = () => {
-  const { columns } = tasksData as WorkspaceData;
+  const [columns, setColumns] = useState(
+    (tasksData as WorkspaceData).columns,
+  );
   const [tasks, setTasks] = useState<Task[]>(tasksData.tasks as Task[]);
   const [draggedTaskId, setDraggedTaskId] = useState<string | null>(null);
+  const [draggedColumnId, setDraggedColumnId] = useState<string | null>(null);
   const [selectedTask, setSelectedTask] = useState<Task | null>(null);
 
   const tasksByColumn = useMemo(() => {
@@ -36,6 +40,20 @@ const Workspace: FC = () => {
     setDraggedTaskId(null);
   };
 
+  const handleColumnDragStart = (columnId: string) => {
+    setDraggedColumnId(columnId);
+  };
+
+  const handleColumnDragEnd = () => {
+    setDraggedColumnId(null);
+  };
+
+  const handleColumnDrop = (overColumnId: string) => {
+    if (!draggedColumnId || draggedColumnId === overColumnId) return;
+    setColumns((prev) => reorderColumns(prev, draggedColumnId, overColumnId));
+    setDraggedColumnId(null);
+  };
+
   const selectedTaskColumn = selectedTask
     ? columns.find((column) => column.id === selectedTask.columnId)
     : null;
@@ -51,9 +69,13 @@ const Workspace: FC = () => {
               column={column}
               tasks={tasksByColumn[column.id] ?? []}
               draggedTaskId={draggedTaskId}
+              draggedColumnId={draggedColumnId}
               onDragStart={handleDragStart}
               onDragEnd={handleDragEnd}
               onDrop={handleDrop}
+              onColumnDragStart={handleColumnDragStart}
+              onColumnDragEnd={handleColumnDragEnd}
+              onColumnDrop={handleColumnDrop}
               onTaskClick={setSelectedTask}
             />
           ))}