diff --git a/app/soapbox/actions/settings.ts b/app/soapbox/actions/settings.ts index fd37735b1..44a22f666 100644 --- a/app/soapbox/actions/settings.ts +++ b/app/soapbox/actions/settings.ts @@ -17,6 +17,12 @@ const SETTINGS_UPDATE = 'SETTINGS_UPDATE'; const FE_NAME = 'soapbox_fe'; +/** Options when changing/saving settings. */ +type SettingOpts = { + /** Whether to display an alert when settings are saved. */ + showAlert?: boolean, +} + const messages = defineMessages({ saveSuccess: { id: 'settings.save.success', defaultMessage: 'Your preferences have been saved!' }, }); @@ -177,7 +183,7 @@ const getSettings = createSelector([ .mergeDeep(settings); }); -const changeSettingImmediate = (path: string[], value: any) => +const changeSettingImmediate = (path: string[], value: any, opts?: SettingOpts) => (dispatch: AppDispatch) => { dispatch({ type: SETTING_CHANGE, @@ -185,10 +191,10 @@ const changeSettingImmediate = (path: string[], value: any) => value, }); - dispatch(saveSettingsImmediate()); + dispatch(saveSettingsImmediate(opts)); }; -const changeSetting = (path: string[], value: any) => +const changeSetting = (path: string[], value: any, opts?: SettingOpts) => (dispatch: AppDispatch) => { dispatch({ type: SETTING_CHANGE, @@ -196,10 +202,10 @@ const changeSetting = (path: string[], value: any) => value, }); - return dispatch(saveSettings()); + return dispatch(saveSettings(opts)); }; -const saveSettingsImmediate = () => +const saveSettingsImmediate = (opts?: SettingOpts) => (dispatch: AppDispatch, getState: () => RootState) => { if (!isLoggedIn(getState)) return; @@ -215,14 +221,16 @@ const saveSettingsImmediate = () => })).then(() => { dispatch({ type: SETTING_SAVE }); - dispatch(snackbar.success(messages.saveSuccess)); + if (opts?.showAlert) { + dispatch(snackbar.success(messages.saveSuccess)); + } }).catch(error => { dispatch(showAlertForError(error)); }); }; -const saveSettings = () => - (dispatch: AppDispatch) => dispatch(saveSettingsImmediate()); +const saveSettings = (opts?: SettingOpts) => + (dispatch: AppDispatch) => dispatch(saveSettingsImmediate(opts)); export { SETTING_CHANGE, diff --git a/app/soapbox/features/notifications/components/setting_toggle.tsx b/app/soapbox/features/notifications/components/setting_toggle.tsx index 3cd9c65a2..5b7ca9100 100644 --- a/app/soapbox/features/notifications/components/setting_toggle.tsx +++ b/app/soapbox/features/notifications/components/setting_toggle.tsx @@ -13,7 +13,6 @@ interface ISettingToggle { settingPath: string[], /** Callback when the setting is toggled. */ onChange: (settingPath: string[], checked: boolean) => void, - } /** Stateful toggle to change user settings. */ diff --git a/app/soapbox/features/preferences/index.tsx b/app/soapbox/features/preferences/index.tsx index c666a847e..fe6e5fcce 100644 --- a/app/soapbox/features/preferences/index.tsx +++ b/app/soapbox/features/preferences/index.tsx @@ -96,11 +96,11 @@ const Preferences = () => { const settings = useAppSelector((state) => getSettings(state)); const onSelectChange = (event: React.ChangeEvent, path: string[]) => { - dispatch(changeSetting(path, event.target.value)); + dispatch(changeSetting(path, event.target.value, { showAlert: true })); }; const onToggleChange = (key: string[], checked: boolean) => { - dispatch(changeSetting(key, checked)); + dispatch(changeSetting(key, checked, { showAlert: true })); }; const displayMediaOptions = React.useMemo(() => ({