Skip to content

fix: improve drag overlay behavior in routine builder#452

Merged
aryandas2911 merged 2 commits into
aryandas2911:mainfrom
KrithikaVellingiri:fix/drag-drop-animation
May 17, 2026
Merged

fix: improve drag overlay behavior in routine builder#452
aryandas2911 merged 2 commits into
aryandas2911:mainfrom
KrithikaVellingiri:fix/drag-drop-animation

Conversation

@KrithikaVellingiri
Copy link
Copy Markdown
Contributor

📌 Description

This PR improves the drag-and-drop experience in the Routine Builder by fixing visual layering and interaction issues during task scheduling.

Previously, the dragged task card appeared behind the weekly schedule grid while dragging, which caused poor visual feedback. Additionally, after dropping a task into the schedule, the dragged card visually snapped back into the Task Library even though the scheduling action had already succeeded, making the interaction feel confusing and inconsistent.

This implementation uses DragOverlay from @dnd-kit/core to create a separate overlay-based drag layer, improving drag visibility and eliminating the confusing snap-back behavior.

🔗 Related Issue

Closes #319

🛠 Changes Made

  • Fixed dragged task cards rendering behind the weekly schedule grid
  • Prevented the original draggable element from visually snapping back after drop
  • Added DragOverlay for overlay-only drag interactions

📸 Screenshots (if applicable)

before.vs.after.mp4

✅ Checklist

  • Code runs locally
  • Followed project structure
  • No console errors
  • Properly tested changes
  • Linked the issue

@aryandas2911 aryandas2911 merged commit c429686 into aryandas2911:main May 17, 2026
1 check passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Dragged task card appears behind routine column during drag-and-drop interaction in saved routines

2 participants