fix: allow dragging pieces from the bar onto the board

[Copilot]

• Investigate bar drag bug
• Fix: set draggable={false} on <img> in Piece.tsx so the Piece div (not the img) is always the drag source, preventing browser native image-drag behavior from interfering with bar piece dragging
• TypeScript and tests pass

What was wrong

Piece.tsx rendered <img draggable={enabled}>, making the <img> element the innermost draggable element. When a bar piece is dragged, browsers treat an <img> as the native drag source and apply default image-drag behavior (e.g., setting effectAllowed to copyLink, including the image URL as drag data). This can prevent the custom onDragStart handler from working correctly, causing the drop to fail silently.

For board pieces this wasn't a problem because the dragstart event bubbles further up to the Point div, whose own onDragStart sets everything correctly. But for bar pieces there is no wrapping Point — only the Piece div handles the drag — so the native image-drag interference broke bar-piece dragging entirely.

Fix

Set draggable={false} on the <img> element inside Piece.tsx. This forces the Piece div (which has draggable={enabled} and the onDragStart handler) to always be the drag source. The browser (and the drag-drop-touch polyfill on mobile) will now correctly initiate the drag on the Piece div, and the custom drag data/logic takes effect without any image-drag interference.

[github-actions]

PR Preview Action v1.8.1
🚀 View preview at https://ProLoser.github.io/PeaceInTheMiddleEast/preview/pr-211/
Built to branch gh-pages at 2026-05-28 07:15 UTC. Preview will be ready when the GitHub Pages deployment is complete.

[Copilot]

Pull request overview

This PR fixes a drag-and-drop bug where pieces dragged from the bar could fail to drop onto the board due to the browser’s native image-drag behavior taking over when the <img> was draggable.

Changes:

• Disable native dragging on the piece <img> by setting draggable={false}.
• Ensure the outer .piece <div> remains the drag source (draggable={enabled}) so the custom onDragStart logic is consistently applied (including for bar pieces).

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.