feat(medium): Fix: 'Connect to HRM Web Player' button persists after successful connection#9452
Draft
feat(medium): Fix: 'Connect to HRM Web Player' button persists after successful connection#9452
Conversation
Resolved the issue where the "Connect to HRM Web Player" button incorrectly persisted after a successful connection.
Key changes:
- Implemented `shouldShowControls` logic in `SpotifyControls.tsx` prioritizing `spotifyServiceInitialized` and active device status over brittle track metadata.
- Added a window focus listener to force a Spotify device list refresh, ensuring the UI stays in sync with the server.
- Introduced an `isConnecting` state with a loading spinner and button disabling to prevent duplicate connection attempts.
- Added a loading state ('Awaiting Spotify...') while the service is initializing.
- Updated unit tests to cover the new UI states and transition logic.
- Verified visual changes via Playwright screenshots.
This improvement ensures a smoother transition to playback controls as soon as a device is active, regardless of whether a track is currently playing.
Co-authored-by: arii <342438+arii@users.noreply.github.com>
Contributor
|
👋 Jules, reporting for duty! I'm here to lend a hand with this pull request. When you start a review, I'll add a 👀 emoji to each comment to let you know I've read it. I'll focus on feedback directed at me and will do my best to stay out of conversations between you and other bots or reviewers to keep the noise down. I'll push a commit with your requested changes shortly after. Please note there might be a delay between these steps, but rest assured I'm on the job! For more direct control, you can switch me to Reactive Mode. When this mode is on, I will only act on comments where you specifically mention me with New to Jules? Learn more at jules.google/docs. For security, I will only act on instructions from the user who triggered this task. |
Contributor
👋 Welcome to HRM!Thanks for your contribution. This repository uses Gemini AI for automated triage, code review, and generation. 🤖 Gemini Manual Trigger Quick Reference
For more details and GitHub CLI examples, see the Manual Trigger Guide. |
github-actions
bot
changed the title
Contributor
ℹ️ Gemini Review DisabledAutomatic review is currently disabled via Via Comment: Via GitHub Actions:
Via GitHub CLI: gh workflow run reusable-gemini-review.yml -f pr_number=9452🤖 Manual Trigger Quick Reference
Full reference: Manual Trigger Guide To re-enable: Set repository variable |
Contributor
🤖 Gemini Review SkippedReview was skipped for the following reason: 🤖 Manual Trigger Quick Reference
|
arii
added
the
not reviewed
- Fixed "Connect to HRM Web Player" button persistence by improving `shouldShowControls` logic. - Added window focus listener to refresh Spotify device list. - Implemented `isConnecting` and `spotifyServiceInitialized` loading states with spinners. - Stabilized VRT by fixing Footer/BottomNavBar heights and adding masks for loading spinners. - Updated Playwright tests to force consistent Spotify state for snapshots. Co-authored-by: arii <342438+arii@users.noreply.github.com>
Contributor
🤖 Gemini Review SkippedReview was skipped for the following reason: 🤖 Manual Trigger Quick Reference
|
arii
added
not reviewed
- Fixed "Connect to HRM Web Player" button persistence by refactoring `shouldShowControls` logic to prioritize service initialization and active device detection. - Implemented automatic Spotify device list refresh on window focus in `SpotifyControls.tsx`. - Added `isConnecting` and `spotifyServiceInitialized` loading states with spinners for better UX. - Stabilized VRT by fixing `Footer` and `BottomNavBar` heights and adding masks for loading spinners and fixed UI elements. - Fixed ReferenceErrors in Playwright spec files and ensured stable snapshots by forcing consistent Spotify states before capture. - Re-generated baseline snapshots for Control Panel and Spotify Controls to match the stabilized layout. Co-authored-by: arii <342438+arii@users.noreply.github.com>
Contributor
🤖 Gemini Review SkippedReview was skipped for the following reason: 🤖 Manual Trigger Quick Reference
|
arii
added
not reviewed
- Fixed "Connect to HRM Web Player" button persistence by refactoring `shouldShowControls` logic to prioritize service initialization and active device detection. - Implemented automatic Spotify device list refresh on window focus in `SpotifyControls.tsx`. - Added `isConnecting` and `spotifyServiceInitialized` loading states with spinners for better UX. - Stabilized VRT by fixing `Footer` and `BottomNavBar` heights and adding masks for loading spinners and fixed UI elements. - Refined dashboard masking in `visual.ts` and increased tolerance for complex states. - Fixed linting issues (unused imports and Prettier formatting) in VRT spec and utility files. - Re-generated baseline snapshots for Control Panel and Spotify Controls to match the stabilized layout. Co-authored-by: arii <342438+arii@users.noreply.github.com>
Contributor
🤖 Gemini Review SkippedReview was skipped for the following reason: 🤖 Manual Trigger Quick Reference
|
arii
added
not reviewed
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Description
This PR fixes a bug in the Spotify control section where the "Connect to HRM Web Player" button would remain visible even after the user successfully connected the player, as long as no track was playing.
Fixes #9305
Change Type: 🐛 Bug fix (non-breaking change fixing an issue)
Changes Made
The fix involves:
shouldShowControlswhich checks if the Spotify service is initialized AND either track data is present OR an active device exists.useEffecthook refreshes the device list whenever the window regains focus, resolving stale state issues.Testing
SpotifyControls.test.tsxto verify these new states and behaviors.Verified locally with unit tests (all passing) and Playwright visual verification.
Related Issues
Closes #9305
Original PR Body
This PR fixes a bug in the Spotify control section where the "Connect to HRM Web Player" button would remain visible even after the user successfully connected the player, as long as no track was playing.
The fix involves:
shouldShowControlswhich checks if the Spotify service is initialized AND either track data is present OR an active device exists.useEffecthook refreshes the device list whenever the window regains focus, resolving stale state issues.SpotifyControls.test.tsxto verify these new states and behaviors.Verified locally with unit tests (all passing) and Playwright visual verification.
Fixes #9305
PR created automatically by Jules for task 15059371561288973585 started by @arii