Skip to content

feat(lyrics): add immersive button to fullscreen lyrics header#124

Merged
InstaZDLL merged 1 commit into
mainfrom
feat/fullscreen-lyrics-immersive-button
May 23, 2026
Merged

feat(lyrics): add immersive button to fullscreen lyrics header#124
InstaZDLL merged 1 commit into
mainfrom
feat/fullscreen-lyrics-immersive-button

Conversation

@InstaZDLL
Copy link
Copy Markdown
Owner

@InstaZDLL InstaZDLL commented May 23, 2026

Summary

  • Adds a Maximize2 button next to the close X in FullscreenLyrics, symmetric to the Mic2 "switch to lyrics" button already present in FullscreenNowPlaying.
  • One-click round-trip Immersive ↔ Lyrics without leaving fullscreen, which closes the asymmetry called out in issue feat: add a Immersive Now Playing button from Fullscreen Lyrics #109.
  • Reuses the existing onOpenNowPlaying callback (parent already flips the fullscreen mutex) and the existing playerBar.openFullscreen i18n key — no new strings, no plumbing changes.

The pre-existing cover-thumbnail click on the header keeps working for users who already learned that gesture.

Closes #109

Test plan

  • Open Fullscreen Lyrics from the player bar — header shows a Maximize2 button between the cover thumbnail and the X.
  • Click Maximize2 → switches to Fullscreen Now Playing.
  • In Fullscreen Now Playing, click Mic2 → returns to Fullscreen Lyrics (existing path, sanity check).
  • Click the cover thumbnail in Fullscreen Lyrics — still works (legacy switch path).
  • Hover the new button — shows "Vue immersive" tooltip (French) / "Immersive view" (English).

Summary by CodeRabbit

  • Nouvelles fonctionnalités
    • Ajout de boutons de contrôle pour agrandir et fermer l'affichage des paroles en plein écran.

Review Change Stack

Mirrors the Mic2 "switch to lyrics" button that already exists in
the FullscreenNowPlaying top bar. Previously the only path from
Fullscreen Lyrics back to Immersive Now Playing was clicking the
small cover thumbnail in the header — discoverable for users who
read the hover title, but invisible otherwise.

Reuses the existing `onOpenNowPlaying` callback (parent already
flips the fullscreen mutex), the existing `playerBar.openFullscreen`
i18n key, and the Maximize2 icon used by the player bar's primary
immersive trigger.

Closes #109
@coderabbitai
Copy link
Copy Markdown

coderabbitai Bot commented May 23, 2026

📝 Walkthrough

Walkthrough

Ajout d'un bouton Maximize dans l'en-tête de Fullscreen Lyrics qui ouvre la vue Immersive Now Playing via onOpenNowPlaying. L'icône Maximize2 de lucide-react est importée, et les contrôles d'en-tête sont réorganisés en un bloc unifié.

Changes

Accès rapide à Immersive Now Playing

Couche / Fichier(s) Résumé
Bouton Maximize et réorganisation de l'en-tête
src/components/player/FullscreenLyrics.tsx
Import de Maximize2 depuis lucide-react. Refonte du bloc de contrôle d'en-tête : nouveau bouton Maximize (icône Maximize2) qui déclenche onOpenNowPlaying, regroupement avec le bouton de fermeture dans un conteneur dédié pour remplacer le simple bouton de fermeture précédent.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~8 minutes

Suggested labels

size: s, scope: frontend

Poem

🎵 Un clic de maximisation
Vers l'immersion sans détour
Lyrics et Now Playing en fusion
L'expérience s'éclaire au jour
Navigation fluide toujours ✨

🚥 Pre-merge checks | ✅ 5
✅ Passed checks (5 passed)
Check name Status Explanation
Title check ✅ Passed Le titre suit la convention Conventional Commits avec le scope 'lyrics' et décrit clairement l'ajout du bouton immersive dans l'en-tête des paroles en plein écran.
Linked Issues check ✅ Passed Le PR implémente exactement ce que demande l'issue #109 : ajouter un bouton pour basculer de Fullscreen Lyrics vers Immersive (Fullscreen Now Playing) sans passer par la fenêtre principale.
Out of Scope Changes check ✅ Passed Les changements sont limités au fichier FullscreenLyrics.tsx et consistent à ajouter le bouton Maximize2 avec ses contrôles — pas de modifications périphériques ou non liées à l'objectif.
Docstring Coverage ✅ Passed Docstring coverage is 100.00% which is sufficient. The required threshold is 80.00%.
Description check ✅ Passed La description PR suit le modèle requis : résumé clair avec justification, plan de test détaillé et checklist complète avec liaison à l'issue #109.

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

✨ Finishing Touches
📝 Generate docstrings
  • Create stacked PR
  • Commit on current branch
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Commit unit tests in branch feat/fullscreen-lyrics-immersive-button

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

@InstaZDLL InstaZDLL added scope: frontend React/Vite frontend (src/) type: feat New feature size: s 10-50 lines labels May 23, 2026
@InstaZDLL InstaZDLL self-assigned this May 23, 2026
@InstaZDLL InstaZDLL merged commit 09de8bc into main May 23, 2026
13 checks passed
@InstaZDLL InstaZDLL deleted the feat/fullscreen-lyrics-immersive-button branch May 23, 2026 19:32
InstaZDLL added a commit that referenced this pull request May 23, 2026
…der (#126)

The Immersive Now Playing section listed PlayerBar entry points but
not the new Maximize2 button in the FullscreenLyrics header (added
in PR #124 / issue #109), which closes the round-trip Lyrics →
Immersive.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

scope: frontend React/Vite frontend (src/) size: s 10-50 lines type: feat New feature

Projects

None yet

Development

Successfully merging this pull request may close these issues.

feat: add a Immersive Now Playing button from Fullscreen Lyrics

1 participant