fix(theme): persist preference before view transition

[InstaZDLL]

Summary

• Persist the next theme value to localStorage before calling document.startViewTransition, so a crash inside WebKitGTK's View Transitions implementation no longer eats the user's choice
• Restore the stored value on mount, so dark mode now survives a restart on every platform (previously useState(false) reset on every launch)
• No regression for Windows/macOS or working Linux setups — the radial-reveal animation still runs everywhere

Context

Issue #34: on CachyOS (Arch + KDE Plasma Wayland + NVIDIA), clicking the dark-mode toggle freezes the webview process — KWin shows the "not responding" dialog. The crash happens inside WebKitGTK's startViewTransition compositor path; the JS event loop is fine.

We can't reliably feature-detect which webkit2gtk builds are buggy, and gating on navigator.userAgent.includes("linux") would kill the animation for every Linux user (Debian, Fedora, working Arch setups) as a regression to fix one bad config. Instead we keep the animation everywhere but make the crash a one-time annoyance: click → write localStorage → (possibly crash) → relaunch → dark mode applied.

Test plan

• Toggle theme on Windows — animation still plays, persists across restart
• Toggle theme on macOS — animation still plays, persists across restart
• Toggle theme on a working Linux build (Debian/Fedora) — animation still plays
• On the buggy CachyOS setup from bug: Dark mode crash #34: click → crash → relaunch → app opens in the newly-selected theme

Summary by CodeRabbit

Notes de version

• Corrections de bugs

  • La préférence de thème est désormais sauvegardée et restituée correctement au rechargement de la page.

• Améliorations

  • Animation de changement de thème optimisée avec support des transitions fluides sur les navigateurs modernes.

[coderabbitai]

📝 Walkthrough

Walkthrough

Le contexte de thème est refactorisé pour persister les préférences dans localStorage et amorcer une animation View Transitions lors du basculement. L'initialisation lit la préférence stockée, toggleTheme est mémorisé avec useCallback, et la transition "radial reveal" s'anime depuis le point de clic si l'API est disponible.

Changes

Persistance des thèmes et animations View Transitions

Couche / Fichier(s)	Résumé
Helpers de stockage et initialisation src/contexts/ThemeContext.tsx	Ajout de THEME_STORAGE_KEY et des fonctions readStoredTheme/writeStoredTheme pour gérer la lecture/écriture dans localStorage avec gestion des environnements sans window et des exceptions.
Basculement de thème avec persistance et View Transitions src/contexts/ThemeContext.tsx	toggleTheme est refactorisé en useCallback avec dépendance isDark. État initial lu depuis le stockage. Persistance écrite avant animation. Implémentation complète de la transition View Transitions avec calcul du rayon, attente de transition.ready, et animation clipPath radiale depuis le point de clic. Repli vers basculement instantané si l'API n'est pas disponible. Catch d'erreur conserve l'état togglé.

Estimated code review effort

🎯 3 (Modéré) | ⏱️ ~25 minutes

Poem

🌙 Le thème danse maintenant, glissant dans localStorage,
Puis révélé en cercle lumineux depuis votre clic—
Une transition fluide, du sombre au clair,
Avec grâce, et toujours sans oublier le chemin du retour. ✨

🚥 Pre-merge checks | ✅ 4 | ❌ 1

❌ Failed checks (1 warning)

Check name	Status	Explanation	Resolution
Docstring Coverage	⚠️ Warning	Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%.	Write docstrings for the functions missing them to satisfy the coverage threshold.

✅ Passed checks (4 passed)

Check name	Status	Explanation
Title check	✅ Passed	Le titre respecte le format Conventional Commits avec un scope valide (theme) et décrit le changement principal de manière claire et concise.
Linked Issues check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Description check	✅ Passed	La description respecte la majorité de la structure du template avec un résumé clair, un contexte détaillé et un plan de test concis.

_{✏️ 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 fix-theme-persist-webview-crash

---

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

• X
• Mastodon
• Reddit
• LinkedIn

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