ulysia/Vencord
1
0
Fork 0
Code Pull requests Activity

fix: settings reset not refreshing

Browse source
This commit is contained in:
Lewis Crichton 2024-01-14 16:37:24 +00:00
parent 6c551650d0
commit 686bb118b4
No known key found for this signature in database
2 changed files with 17 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
src/components/ThemeSettings/ThemesTab.tsx
View file

@ -116,9 +116,10 @@ interface UserCSSCardProps {
enabled: boolean;
onChange: (enabled: boolean) => void;
onDelete: () => void;
onSettingsReset: () => void;
}
function UserCSSThemeCard({ theme, enabled, onChange, onDelete }: UserCSSCardProps) {
function UserCSSThemeCard({ theme, enabled, onChange, onDelete, onSettingsReset }: UserCSSCardProps) {
const missingPlugins = useMemo(() =>
theme.requiredPlugins?.filter(p => !isPluginEnabled(p)), [theme]);
@ -148,7 +149,7 @@ function UserCSSThemeCard({ theme, enabled, onChange, onDelete }: UserCSSCardPro
{theme.vars && (
<div style={{ cursor: "pointer" }} onClick={
() => openModal(modalProps =>
<UserCSSSettingsModal modalProps={modalProps} theme={theme} />)
<UserCSSSettingsModal modalProps={modalProps} theme={theme} onSettingsReset={onSettingsReset} />)
}>
<CogWheel />
</div>
@ -392,6 +393,7 @@ function ThemesTab() {
await VencordNative.themes.deleteTheme(theme.fileName);
refreshLocalThemes();
}}
onSettingsReset={refreshLocalThemes}
theme={theme as UserstyleHeader}
/>
)))}

16
src/components/ThemeSettings/UserCSSModal.tsx
View file

@ -18,6 +18,7 @@ import { SettingBooleanComponent, SettingColorComponent, SettingNumberComponent,
interface UserCSSSettingsModalProps {
modalProps: ModalProps;
theme: UserstyleHeader;
onSettingsReset: () => void;
}
function ExportButton({ themeSettings }: { themeSettings: Settings["userCssVars"][""]; }) {
@ -73,7 +74,14 @@ function ImportButton({ themeSettings }: { themeSettings: Settings["userCssVars"
</Tooltip>;
}
function ResetButton({ themeSettings, themeId }: { themeSettings: Settings["userCssVars"]; themeId: string; }) {
interface ResetButtonProps {
themeSettings: Settings["userCssVars"];
themeId: string;
close: () => Promise<void>;
onReset: () => void;
}
function ResetButton({ themeSettings, themeId, close, onReset }: ResetButtonProps) {
return <Tooltip text={"Reset settings to default"}>
{({ onMouseLeave, onMouseEnter }) => (
<div
@ -82,7 +90,9 @@ function ResetButton({ themeSettings, themeId }: { themeSettings: Settings["user
onMouseLeave={onMouseLeave}
onClick={async () => {
await close(); // close the modal first to stop rendering
delete themeSettings[themeId];
onReset();
}}>
<ResetIcon />
</div>
@ -90,7 +100,7 @@ function ResetButton({ themeSettings, themeId }: { themeSettings: Settings["user
</Tooltip>;
}
export function UserCSSSettingsModal({ modalProps, theme }: UserCSSSettingsModalProps) {
export function UserCSSSettingsModal({ modalProps, theme, onSettingsReset }: UserCSSSettingsModalProps) {
// @ts-expect-error UseSettings<> can't determine this is a valid key
const { userCssVars } = useSettings(["userCssVars"], false);
@ -181,7 +191,7 @@ export function UserCSSSettingsModal({ modalProps, theme }: UserCSSSettingsModal
<Flex style={{ gap: 4, marginRight: 4 }} className="vc-settings-usercss-ie-buttons">
<ExportButton themeSettings={themeVars} />
<ImportButton themeSettings={themeVars} />
<ResetButton themeSettings={userCssVars} themeId={theme.id} />
<ResetButton themeSettings={userCssVars} themeId={theme.id} close={modalProps.onClose} onReset={onSettingsReset} />
</Flex>
<ModalCloseButton onClick={modalProps.onClose} />
</ModalHeader>