Add bulk select to move multiple tasks at once ☑️
File: client/src/components/Board/Column.jsx
You can only move one task at a time 💀
Need to move 5 tasks? Click 5 times fr!!
Fix: add select mode toggle in column header:
const [selected, setSelected] = useState([])
const toggleSelect = (taskId) => {
setSelected(prev =>
prev.includes(taskId)
? prev.filter(id => id !== taskId)
: [...prev, taskId]
)
}
// checkbox on each card in select mode:
{selectMode && (
<input type="checkbox"
checked={selected.includes(task._id)}
onChange={() => toggleSelect(task._id)}
className="accent-purple-500"
onClick={e => e.stopPropagation()}
/>
)}
// bulk move button:
{selected.length > 0 && (
<select onChange={async (e) => {
await Promise.all(
selected.map(id =>
updateTask(id, { status: e.target.value })
)
)
setSelected([])
}}>
Move to...
Backlog
In Progress
Review
Done
)}
~20 lines! No backend changes needed 🎯
Add bulk select to move multiple tasks at once ☑️
File: client/src/components/Board/Column.jsx
You can only move one task at a time 💀
Need to move 5 tasks? Click 5 times fr!!
Fix: add select mode toggle in column header:
const [selected, setSelected] = useState([])
const toggleSelect = (taskId) => {
setSelected(prev =>
prev.includes(taskId)
? prev.filter(id => id !== taskId)
: [...prev, taskId]
)
}
// checkbox on each card in select mode:
{selectMode && (
<input type="checkbox"
checked={selected.includes(task._id)}
onChange={() => toggleSelect(task._id)}
className="accent-purple-500"
onClick={e => e.stopPropagation()}
/>
)}
// bulk move button:
{selected.length > 0 && (
<select onChange={async (e) => {
await Promise.all(
selected.map(id =>
updateTask(id, { status: e.target.value })
)
)
setSelected([])
}}>
Move to...
Backlog
In Progress
Review
Done
)}
~20 lines! No backend changes needed 🎯