From bc1f9341f4e0caf3aa2d395583935ebf795ec3c1 Mon Sep 17 00:00:00 2001
From: Jason <farion1231@gmail.com>
Date: Sat, 2 May 2026 17:38:21 +0800
Subject: [PATCH] refactor(theme): remove circular reveal animation for theme
 switching
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

The View Transitions API used here crashes WebKitGTK with SIGSEGV on
Linux. Rather than gating document.startViewTransition per platform
(see PR #2502), drop the animation entirely — it's a low-value visual
flourish on a low-frequency action that doesn't justify a permanent
platform branch.

Removes the ::view-transition-* CSS block and the coordinate plumbing
in setTheme. The optional event parameter is kept on the API surface
to keep call sites compiling; they'll be cleaned up in a follow-up
commit.
---
 src/components/theme-provider.tsx | 31 ++-----------------------
 src/index.css                     | 38 -------------------------------
 2 files changed, 2 insertions(+), 67 deletions(-)

diff --git a/src/components/theme-provider.tsx b/src/components/theme-provider.tsx
index 8eba9b979..d9da57261 100644
--- a/src/components/theme-provider.tsx
+++ b/src/components/theme-provider.tsx
@@ -5,7 +5,6 @@ import React, {
   useMemo,
   useState,
 } from "react";
-import { isLinux } from "@/lib/platform";
 import { invoke } from "@tauri-apps/api/core";
 
 type Theme = "light" | "dark" | "system";
@@ -131,35 +130,9 @@ export function ThemeProvider({
   const value = useMemo<ThemeContextValue>(
     () => ({
       theme,
-      setTheme: (nextTheme: Theme, event?: React.MouseEvent) => {
-        // Skip if same theme
+      setTheme: (nextTheme: Theme) => {
         if (nextTheme === theme) return;
-
-        // Set transition origin coordinates from click event
-        const x = event?.clientX ?? window.innerWidth / 2;
-        const y = event?.clientY ?? window.innerHeight / 2;
-        document.documentElement.style.setProperty(
-          "--theme-transition-x",
-          `${x}px`,
-        );
-        document.documentElement.style.setProperty(
-          "--theme-transition-y",
-          `${y}px`,
-        );
-
-        // Use View Transitions API if available, otherwise fall back to instant change
-        // Disable for Linux, since WebKitGTK crashes on `document.startViewTransition`
-        if (
-          typeof document !== "undefined" &&
-          document.startViewTransition &&
-          !isLinux()
-        ) {
-          document.startViewTransition(() => {
-            setThemeState(nextTheme);
-          });
-        } else {
-          setThemeState(nextTheme);
-        }
+        setThemeState(nextTheme);
       },
     }),
     [theme],
diff --git a/src/index.css b/src/index.css
index b5094c7f5..dab861f72 100644
--- a/src/index.css
+++ b/src/index.css
@@ -191,41 +191,3 @@ input[type="password"]::-ms-reveal,
 input[type="password"]::-ms-clear {
   display: none;
 }
-
-::view-transition-old(root),
-::view-transition-new(root) {
-  animation: none;
-  mix-blend-mode: normal;
-}
-
-::view-transition-old(root) {
-  z-index: 1;
-}
-
-::view-transition-new(root) {
-  z-index: 9999;
-}
-
-@keyframes theme-circle-expand {
-  from {
-    clip-path: circle(
-      0% at var(--theme-transition-x, 50%) var(--theme-transition-y, 50%)
-    );
-  }
-
-  to {
-    clip-path: circle(
-      150% at var(--theme-transition-x, 50%) var(--theme-transition-y, 50%)
-    );
-  }
-}
-
-::view-transition-new(root) {
-  animation: theme-circle-expand 0.4s ease-out;
-}
-
-@media (prefers-reduced-motion: reduce) {
-  ::view-transition-new(root) {
-    animation: none;
-  }
-}