Add right-click context menu on task card🖱️
Description
Currently, the only way to edit or delete a task is by opening the full task modal. Add a right-click context menu on task cards with quick actions so users don't need to open the modal for simple actions.
File
client/src/components/Board/TaskCard.jsx
Tasks
Detect right-click (onContextMenu) on the task card
Prevent default browser context menu
Show a small custom menu with options: Edit, Delete, Duplicate
Close the menu when clicking elsewhere
Wire up each action to existing handlers (edit → open modal, delete → existing delete function, duplicate → clone task with new ID)
Acceptance Criteria
Right-clicking a card shows a context menu instead of the browser's default menu
Clicking outside the menu closes it
Each action performs the correct behavior on the correct task
Suggested approach
const [contextMenu, setContextMenu] = useState(null);
const handleContextMenu = (e) => {
e.preventDefault();
setContextMenu({ x: e.pageX, y: e.pageY });
};
Add right-click context menu on task card🖱️
Description
Currently, the only way to edit or delete a task is by opening the full task modal. Add a right-click context menu on task cards with quick actions so users don't need to open the modal for simple actions.
File
client/src/components/Board/TaskCard.jsx
Tasks
Detect right-click (onContextMenu) on the task card
Prevent default browser context menu
Show a small custom menu with options: Edit, Delete, Duplicate
Close the menu when clicking elsewhere
Wire up each action to existing handlers (edit → open modal, delete → existing delete function, duplicate → clone task with new ID)
Acceptance Criteria
Right-clicking a card shows a context menu instead of the browser's default menu
Clicking outside the menu closes it
Each action performs the correct behavior on the correct task
Suggested approach
const [contextMenu, setContextMenu] = useState(null);
const handleContextMenu = (e) => {
e.preventDefault();
setContextMenu({ x: e.pageX, y: e.pageY });
};