Skip to content

Close heatmap modal when swiping to muscle list#49

Merged
pineapplestrikesback merged 1 commit intomainfrom
codex/fix-modal-not-closing-after-swipe
Jan 24, 2026
Merged

Close heatmap modal when swiping to muscle list#49
pineapplestrikesback merged 1 commit intomainfrom
codex/fix-modal-not-closing-after-swipe

Conversation

@pineapplestrikesback
Copy link
Owner

@pineapplestrikesback pineapplestrikesback commented Jan 24, 2026

Motivation

  • The muscle detail modal opened from the heatmap persisted when the user swiped to the muscle list; the modal should dismiss when navigating away from the heatmap.

Description

  • Add an optional isActive?: boolean prop to MobileHeatmap with a default of true to indicate whether the heatmap slide is currently visible.
  • Add a useEffect in MobileHeatmap that clears selectedRegion (closing the modal) when isActive becomes false by calling setSelectedRegion(null).
  • Wire carousel state into the heatmap by passing isActive={selectedIndex === 0} from MobileCarousel so the modal closes automatically when swiping to the muscle list.

Testing

  • No automated tests were executed for this change.

Codex Task

Summary by CodeRabbit

  • Bug Fixes
    • Mobile carousel heatmap now automatically resets selected regions and closes related modals when navigating to different slides, preventing orphaned UI state and ensuring a cleaner experience.

✏️ Tip: You can customize this high-level summary in your review settings.

@vercel
Copy link

vercel bot commented Jan 24, 2026

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Review Updated (UTC)
gym-analytics Ready Ready Preview, Comment Jan 24, 2026 10:48am

@coderabbitai
Copy link
Contributor

coderabbitai bot commented Jan 24, 2026

📝 Walkthrough

Walkthrough

The PR introduces an isActive prop to the MobileHeatmap component to control its active state. MobileCarousel now passes isActive={true} when the heatmap slide is selected. When isActive becomes false, the component clears the selected region state as a cleanup mechanism.

Changes

Cohort / File(s) Summary
Active state prop introduction
src/ui/components/mobile/MobileCarousel.tsx, src/ui/components/mobile/MobileHeatmap.tsx
MobileCarousel now conditionally passes isActive={true} to MobileHeatmap when selectedIndex is 0. MobileHeatmap interface and signature updated to accept optional isActive prop (defaults to true). New side effect clears selectedRegion state when isActive becomes false.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~10 minutes

Poem

🐰 Through the carousel we hop and we slide,
When the heatmap's active, there's nowhere to hide!
But when we move on, it clears without fuss,
Resetting its regions with ease, for all of us,
Props dancing through components like quantum carrot flux! 🥕

🚥 Pre-merge checks | ✅ 3
✅ Passed checks (3 passed)
Check name Status Explanation
Description Check ✅ Passed Check skipped - CodeRabbit’s high-level summary is enabled.
Title check ✅ Passed The title 'Close heatmap modal when swiping to muscle list' accurately describes the main change—adding an isActive prop to automatically close the modal when users navigate away from the heatmap slide.
Docstring Coverage ✅ Passed Docstring coverage is 100.00% which is sufficient. The required threshold is 80.00%.

✏️ Tip: You can configure your own custom pre-merge checks in the settings.

✨ Finishing touches
  • 📝 Generate docstrings

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

Comment @coderabbitai help to get the list of available commands and usage tips.

@claude
Copy link

claude bot commented Jan 24, 2026

Code review

No issues found. Checked for bugs and CLAUDE.md compliance.

@pineapplestrikesback pineapplestrikesback merged commit 6123bab into main Jan 24, 2026
4 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant