From 9a12ae9559e3045d7933099566dd57c78bc0c8d5 Mon Sep 17 00:00:00 2001 From: amsyarasyiq <82711525+amsyarasyiq@users.noreply.github.com> Date: Mon, 11 Mar 2024 16:02:11 +0800 Subject: [PATCH] Yet another theme fix --- src/core/ui/components/ThemeCard.tsx | 26 ++++++------------------ src/core/vendettaObject.ts | 2 +- src/lib/debug.ts | 6 +++--- src/lib/managers/themes.ts | 30 +++++++++++----------------- 4 files changed, 22 insertions(+), 42 deletions(-) diff --git a/src/core/ui/components/ThemeCard.tsx b/src/core/ui/components/ThemeCard.tsx index c94ba37..6ba3757 100644 --- a/src/core/ui/components/ThemeCard.tsx +++ b/src/core/ui/components/ThemeCard.tsx @@ -2,17 +2,17 @@ import { formatString, Strings } from "@core/i18n"; import Card, { CardWrapper } from "@core/ui/components/Card"; import { getAssetIDByName } from "@lib/api/assets"; import { useProxy } from "@lib/api/storage"; -import { applyTheme, fetchTheme, removeTheme, selectTheme, Theme, themes } from "@lib/managers/themes"; +import { applyTheme, fetchTheme, removeTheme, selectTheme, Theme } from "@lib/managers/themes"; import { settings } from "@lib/settings"; import { ButtonColors } from "@lib/utils/types"; import { clipboard } from "@metro/common"; import { showConfirmationAlert } from "@ui/alerts"; import { showToast } from "@ui/toasts"; -async function selectAndApply(value: boolean, id: string) { +function selectAndApply(value: boolean, theme: Theme) { try { - await selectTheme(value ? id : null); - applyTheme(value ? themes[id] : null); + selectTheme(value ? theme : null); + applyTheme(value ? theme : null); } catch (e: any) { console.error("Error while selectAndApply,", e); } @@ -21,8 +21,6 @@ async function selectAndApply(value: boolean, id: string) { export default function ThemeCard({ item: theme, index }: CardWrapper) { useProxy(theme); - // little hack, our useProxy is kinda not reliable here - const [, forceUpdate] = React.useReducer(n => ~n, 0); const [removed, setRemoved] = React.useState(false); // This is needed because of React™ @@ -39,8 +37,7 @@ export default function ThemeCard({ item: theme, index }: CardWrapper) { toggleType={!settings.safeMode?.enabled ? "radio" : undefined} toggleValue={theme.selected} onToggleChange={(v: boolean) => { - selectAndApply(v, theme.id); - forceUpdate(); + selectAndApply(v, theme); }} overflowTitle={theme.data.name} overflowActions={[ @@ -49,18 +46,7 @@ export default function ThemeCard({ item: theme, index }: CardWrapper) { label: Strings.REFETCH, onPress: () => { fetchTheme(theme.id, theme.selected).then(() => { - // if (theme.selected) { - // showConfirmationAlert({ - // title: Strings.MODAL_THEME_REFETCHED, - // content: Strings.MODAL_THEME_REFETCHED_DESC, - // confirmText: Strings.RELOAD, - // cancelText: Strings.CANCEL, - // confirmColor: ButtonColors.RED, - // onConfirm: () => BundleUpdaterManager.reload(), - // }); - // } else { showToast(Strings.THEME_REFETCH_SUCCESSFUL, getAssetIDByName("toast_image_saved")); - // } }).catch(() => { showToast(Strings.THEME_REFETCH_FAILED, getAssetIDByName("Small")); }); @@ -87,7 +73,7 @@ export default function ThemeCard({ item: theme, index }: CardWrapper) { onConfirm: () => { removeTheme(theme.id).then(wasSelected => { setRemoved(true); - if (wasSelected) selectAndApply(false, theme.id); + if (wasSelected) selectAndApply(false, theme); }).catch((e: Error) => { showToast(e.message, getAssetIDByName("Small")); }); diff --git a/src/core/vendettaObject.ts b/src/core/vendettaObject.ts index 9a05f34..8a66dae 100644 --- a/src/core/vendettaObject.ts +++ b/src/core/vendettaObject.ts @@ -130,7 +130,7 @@ export const initVendettaObject = (): any => { themes: themes.themes, fetchTheme: (id: string, selected?: boolean) => themes.fetchTheme(id, selected), installTheme: (id: string) => themes.installTheme(id), - selectTheme: (id: string) => themes.selectTheme(id === "default" ? null : id), + selectTheme: (id: string) => themes.selectTheme(id === "default" ? null : themes.themes[id]), removeTheme: (id: string) => themes.removeTheme(id), getCurrentTheme: () => themes.getThemeFromLoader(), updateThemes: () => themes.updateThemes() diff --git a/src/lib/debug.ts b/src/lib/debug.ts index ec3a258..728aef0 100644 --- a/src/lib/debug.ts +++ b/src/lib/debug.ts @@ -2,7 +2,7 @@ import { getAssetIDByName } from "@lib/api/assets"; import { getLoaderName, isThemeSupported } from "@lib/api/native/loader"; import { BundleUpdaterManager, ClientInfoManager, DeviceManager } from "@lib/api/native/modules"; import { after } from "@lib/api/patcher"; -import { getThemeFromLoader, selectTheme } from "@lib/managers/themes"; +import { getThemeFromLoader, selectTheme, themes } from "@lib/managers/themes"; import { settings } from "@lib/settings"; import { logger } from "@lib/utils/logger"; import { showToast } from "@ui/toasts"; @@ -36,9 +36,9 @@ export async function toggleSafeMode() { if (isThemeSupported()) { if (getThemeFromLoader()?.id) settings.safeMode!.currentThemeId = getThemeFromLoader()!.id; if (settings.safeMode?.enabled) { - await selectTheme("default"); + await selectTheme(null); } else if (settings.safeMode?.currentThemeId) { - await selectTheme(settings.safeMode?.currentThemeId); + await selectTheme(themes[settings.safeMode?.currentThemeId]); } } setTimeout(BundleUpdaterManager.reload, 400); diff --git a/src/lib/managers/themes.ts b/src/lib/managers/themes.ts index 331e4fa..8cb9635 100644 --- a/src/lib/managers/themes.ts +++ b/src/lib/managers/themes.ts @@ -187,16 +187,16 @@ export async function installTheme(id: string) { await fetchTheme(id); } -export async function selectTheme(id: string | null) { - Object.values(themes).forEach(s => s.selected = s.id === id); +export function selectTheme(theme: Theme | null) { + Object.keys(themes).forEach( + k => themes[k].selected = themes[k].id === theme?.id + ); - if (id === null) { - return await writeTheme({}); - } else { - themes[id].selected = true; + if (theme === null) { + return writeTheme({}); } - await writeTheme(themes[id]); + return writeTheme(theme); } export async function removeTheme(id: string) { @@ -225,7 +225,7 @@ const origRawColor = { ...color.RawColor }; let inc = 0; let vdKey = "vd-theme"; -let vdThemeFallback = "dark"; +let vdThemeFallback = "darker"; let enabled = false; let currentTheme: Theme | null; @@ -234,13 +234,6 @@ function isDiscordTheme(name: string) { return discordThemes.has(name); } -const dMapThemeType = { - dark: "dark", - darker: "dark", - midnight: "dark", - light: "light" -}; - function patchColor() { const isThemeModule = find(m => m.isThemeDark && Object.getOwnPropertyDescriptor(m, "isThemeDark")?.value); const callback = ([theme]: any[]) => theme === vdKey ? [vdThemeFallback] : void 0; @@ -302,7 +295,7 @@ function patchColor() { if (value._state?.theme) { const { theme } = value._state; if (isDiscordTheme(theme)) { - selectTheme("default"); + selectTheme(null); vdThemeFallback = theme; } else { value._state.theme = vdThemeFallback; @@ -319,7 +312,9 @@ function patchColor() { instead("resolveSemanticColor", color.default.meta ?? color.default.internal, (args, orig) => { if (!enabled || !currentTheme) return orig(...args); - if (args[1] !== vdKey) return orig(...args); + if (args[0] !== vdKey) return orig(...args); + + args[0] = vdThemeFallback; const [name, colorDef] = extractInfo(vdThemeFallback, args[1]); @@ -358,7 +353,6 @@ function getDefaultFallbackTheme(fallback: string = vdThemeFallback) { export function applyTheme(appliedTheme: Theme | null, fallbackTheme?: string, update = true) { if (!fallbackTheme) fallbackTheme = getDefaultFallbackTheme(); - fallbackTheme = (dMapThemeType as any)[fallbackTheme] ?? "dark"; currentTheme = appliedTheme; vdThemeFallback = fallbackTheme!!;