mirror of
https://github.com/clash-verge-rev/clash-verge-rev.git
synced 2026-04-17 07:50:33 +08:00
refactor(theme): simplify useCustomTheme for Tauri only
This commit is contained in:
parent
8e27834e35
commit
a67abda72d
@ -7,6 +7,7 @@
|
|||||||
- 修复设置代理端口时检查端口占用
|
- 修复设置代理端口时检查端口占用
|
||||||
- 修复 Monaco 编辑器初始化卡 Loading
|
- 修复 Monaco 编辑器初始化卡 Loading
|
||||||
- 修复恢复备份时 `config.yaml` / `profiles.yaml` 文件内字段未正确恢复
|
- 修复恢复备份时 `config.yaml` / `profiles.yaml` 文件内字段未正确恢复
|
||||||
|
- 修复 Windows 下系统主题同步问题
|
||||||
|
|
||||||
<details>
|
<details>
|
||||||
<summary><strong> ✨ 新增功能 </strong></summary>
|
<summary><strong> ✨ 新增功能 </strong></summary>
|
||||||
|
|||||||
@ -31,9 +31,6 @@ const canUseCssScope = () => {
|
|||||||
if (cssScopeSupport !== null) {
|
if (cssScopeSupport !== null) {
|
||||||
return cssScopeSupport;
|
return cssScopeSupport;
|
||||||
}
|
}
|
||||||
if (typeof document === "undefined") {
|
|
||||||
return false;
|
|
||||||
}
|
|
||||||
try {
|
try {
|
||||||
const testStyle = document.createElement("style");
|
const testStyle = document.createElement("style");
|
||||||
testStyle.textContent = "@scope (:root) { }";
|
testStyle.textContent = "@scope (:root) { }";
|
||||||
@ -88,16 +85,6 @@ export const useCustomTheme = () => {
|
|||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
const preferBrowserMatchMedia =
|
|
||||||
typeof window !== "undefined" &&
|
|
||||||
typeof window.matchMedia === "function" &&
|
|
||||||
// Skip Tauri flow when running purely in browser.
|
|
||||||
!("__TAURI__" in window);
|
|
||||||
|
|
||||||
if (preferBrowserMatchMedia) {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
let isMounted = true;
|
let isMounted = true;
|
||||||
|
|
||||||
const timerId = setTimeout(() => {
|
const timerId = setTimeout(() => {
|
||||||
@ -135,63 +122,6 @@ export const useCustomTheme = () => {
|
|||||||
};
|
};
|
||||||
}, [theme_mode, appWindow, setMode]);
|
}, [theme_mode, appWindow, setMode]);
|
||||||
|
|
||||||
useEffect(() => {
|
|
||||||
if (theme_mode !== "system") {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
if (
|
|
||||||
typeof window === "undefined" ||
|
|
||||||
typeof window.matchMedia !== "function"
|
|
||||||
) {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
const mediaQuery = window.matchMedia("(prefers-color-scheme: dark)");
|
|
||||||
const syncMode = (isDark: boolean) => setMode(isDark ? "dark" : "light");
|
|
||||||
const handleChange = (event: MediaQueryListEvent) =>
|
|
||||||
syncMode(event.matches);
|
|
||||||
|
|
||||||
syncMode(mediaQuery.matches);
|
|
||||||
|
|
||||||
if (typeof mediaQuery.addEventListener === "function") {
|
|
||||||
mediaQuery.addEventListener("change", handleChange);
|
|
||||||
return () => mediaQuery.removeEventListener("change", handleChange);
|
|
||||||
}
|
|
||||||
|
|
||||||
type MediaQueryListLegacy = MediaQueryList & {
|
|
||||||
addListener?: (
|
|
||||||
listener: (this: MediaQueryList, event: MediaQueryListEvent) => void,
|
|
||||||
) => void;
|
|
||||||
removeListener?: (
|
|
||||||
listener: (this: MediaQueryList, event: MediaQueryListEvent) => void,
|
|
||||||
) => void;
|
|
||||||
};
|
|
||||||
|
|
||||||
const legacyQuery = mediaQuery as MediaQueryListLegacy;
|
|
||||||
const legacyAddListener = (
|
|
||||||
legacyQuery as {
|
|
||||||
addListener?: (
|
|
||||||
listener: (this: MediaQueryList, event: MediaQueryListEvent) => void,
|
|
||||||
) => void;
|
|
||||||
}
|
|
||||||
).addListener;
|
|
||||||
legacyAddListener?.call(legacyQuery, handleChange);
|
|
||||||
return () => {
|
|
||||||
const legacyRemoveListener = (
|
|
||||||
legacyQuery as {
|
|
||||||
removeListener?: (
|
|
||||||
listener: (
|
|
||||||
this: MediaQueryList,
|
|
||||||
event: MediaQueryListEvent,
|
|
||||||
) => void,
|
|
||||||
) => void;
|
|
||||||
}
|
|
||||||
).removeListener;
|
|
||||||
legacyRemoveListener?.call(legacyQuery, handleChange);
|
|
||||||
};
|
|
||||||
}, [theme_mode, setMode]);
|
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
if (theme_mode === undefined) {
|
if (theme_mode === undefined) {
|
||||||
return;
|
return;
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user