Improve SettingsUserStore handling

dev/App/User.js

@@ -130,10 +130,6 @@ class AppUser extends AbstractApp {
 		const fn = (ev=>$htmlCL.toggle('rl-ctrl-key-pressed', ev.ctrlKey)).debounce(500);
 		['keydown','keyup'].forEach(t => doc.addEventListener(t, fn));
 
-		['touchstart','mousedown','mousemove','keydown'].forEach(
-			t => doc.addEventListener(t, SettingsUserStore.delayLogout, {passive:true})
-		);
-
 		shortcuts.add('escape,enter', '', Scope.All, () => rl.Dropdowns.detectVisibility());
 	}
 
@@ -884,7 +880,6 @@ class AppUser extends AbstractApp {
 
 		addEventListener('resize', () => leftPanelDisabled(ThemeStore.isMobile() || 1000 > innerWidth));
 
-		SettingsUserStore.populate();
 		NotificationUserStore.populate();
 		AccountUserStore.populate();
 		ContactUserStore.populate();
@@ -1011,6 +1006,11 @@ class AppUser extends AbstractApp {
 								}, 500);
 							}
 
+							['touchstart','mousedown','mousemove','keydown'].forEach(
+								t => doc.addEventListener(t, SettingsUserStore.delayLogout, {passive:true})
+							);
+							SettingsUserStore.delayLogout();
+
 							setTimeout(() => this.initVerticalLayoutResizer(), 1);
 						} else {
 							this.logout();

dev/Remote/User/Fetch.js

@@ -583,15 +583,13 @@ class RemoteUserFetch extends AbstractFetchRemote {
 
 	/**
 	 * @param {string} key
-	 * @param {?Function} valueFn
+	 * @param {?scalar} value
-	 * @param {?Function} fn
+	 * @param {?Function} fCallback
 	 */
-	saveSettingsHelper(key, valueFn, fn) {
+	saveSetting(key, value, fCallback) {
-		return (value) => {
+		this.saveSettings(fCallback, {
-			this.saveSettings(fn || null, {
+			[key]: value
-				[key]: valueFn ? valueFn(value) : value
+		});
-			});
-		};
 	}
 
 	/**

dev/Screen/User/MailBox.js

@@ -6,7 +6,6 @@ import { i18n } from 'Common/Translator';
 
 import { AppUserStore } from 'Stores/User/App';
 import { AccountUserStore } from 'Stores/User/Account';
-import { SettingsUserStore } from 'Stores/User/Settings';
 import { FolderUserStore } from 'Stores/User/Folder';
 import { MessageUserStore } from 'Stores/User/Message';
 import { ThemeStore } from 'Stores/Theme';
@@ -89,7 +88,6 @@ export class MailBoxUserScreen extends AbstractScreen {
 	onStart() {
 		if (!this.__started) {
 			super.onStart();
-			setTimeout(() => SettingsUserStore.layout.valueHasMutated(), 50);
 			setTimeout(() => warmUpScreenPopup(ComposePopupView), 500);
 
 			addEventListener('mailbox.inbox-unread-count', e => {

dev/Settings/User/General.js

@@ -84,7 +84,6 @@ export class GeneralUserSettings {
 			];
 		});
 
-
 		const fReloadLanguageHelper = (saveSettingsStep) => () => {
 				this.languageTrigger(saveSettingsStep);
 				setTimeout(() => this.languageTrigger(SaveSettingsStep.Idle), 1000);
@@ -93,56 +92,39 @@ export class GeneralUserSettings {
 			language: value => {
 				this.languageTrigger(SaveSettingsStep.Animate);
 				translatorReload(false, value)
-					.then(fReloadLanguageHelper(SaveSettingsStep.TrueResult), fReloadLanguageHelper(SaveSettingsStep.FalseResult))
+					.then(fReloadLanguageHelper(SaveSettingsStep.TrueResult),
-					.then(() => {
+						fReloadLanguageHelper(SaveSettingsStep.FalseResult))
-						Remote.saveSettings(null, {
+					.then(() => Remote.saveSetting('Language', value));
-							'Language': value
-						});
-					});
 			},
 
-			editorDefaultType:
+			editorDefaultType: value => Remote.saveSetting('EditorDefaultType', value,
-				Remote.saveSettingsHelper('EditorDefaultType', null,
+				settingsSaveHelperSimpleFunction(this.editorDefaultTypeTrigger, this)),
-					settingsSaveHelperSimpleFunction(this.editorDefaultTypeTrigger, this)),
 
-			messagesPerPage: Remote.saveSettingsHelper('MPP', null, settingsSaveHelperSimpleFunction(this.mppTrigger, this)),
+			messagesPerPage: value => Remote.saveSetting('MPP', value,
+				settingsSaveHelperSimpleFunction(this.mppTrigger, this)),
 
-			showImages: Remote.saveSettingsHelper('ShowImages', v=>v?'1':'0'),
+			showImages: value => Remote.saveSetting('ShowImages', value ? 1 : 0),
 
-			removeColors: Remote.saveSettingsHelper('RemoveColors', v=>v?'1':'0'),
+			removeColors: value => {
+				Remote.saveSetting('RemoveColors', value ? 1 : 0);
+			},
 
-			useCheckboxesInList: Remote.saveSettingsHelper('UseCheckboxesInList', v=>v?'1':'0'),
+			useCheckboxesInList: value => Remote.saveSetting('UseCheckboxesInList', value ? 1 : 0),
 
-			enableDesktopNotification: (value =>
+			enableDesktopNotification: value => Remote.saveSetting('DesktopNotifications', value ? 1 : 0),
-				Remote.saveSettings(null, {
-					'DesktopNotifications': value ? 1 : 0
-				})
-			).debounce(3000),
 
-			enableSoundNotification: (value =>
+			enableSoundNotification: value => Remote.saveSetting('SoundNotification', value ? 1 : 0),
-				Remote.saveSettings(null, {
-					'SoundNotification': value ? 1 : 0
-				})
-			).debounce(3000),
 
-			replySameFolder: (value =>
+			replySameFolder: value => Remote.saveSetting('ReplySameFolder', value ? 1 : 0),
-				Remote.saveSettings(null, {
-					'ReplySameFolder': value ? 1 : 0
-				})
-			).debounce(3000),
 
 			useThreads: value => {
 				MessageUserStore.list([]);
-				Remote.saveSettings(null, {
+				Remote.saveSetting('UseThreads', value ? 1 : 0);
-					'UseThreads': value ? 1 : 0
-				});
 			},
 
 			layout: value => {
 				MessageUserStore.list([]);
-				Remote.saveSettings(settingsSaveHelperSimpleFunction(this.layoutTrigger, this), {
+				Remote.saveSetting('Layout', value, settingsSaveHelperSimpleFunction(this.layoutTrigger, this));
-					'Layout': value
-				});
 			}
 		});
 	}

dev/Settings/User/OpenPgp.js

@@ -22,6 +22,8 @@ export class OpenPgpUserSettings {
 		this.openPgpKeyForDeletion = ko.observable(null).deleteAccessHelper();
 
 		this.allowDraftAutosave = SettingsUserStore.allowDraftAutosave;
+
+		this.allowDraftAutosave.subscribe(value => Remote.saveSetting('AllowDraftAutosave', value ? 1 : 0))
 	}
 
 	addOpenPgpKey() {
@@ -61,10 +63,4 @@ export class OpenPgpUserSettings {
 			}
 		}
 	}
-
-	onBuild() {
-		setTimeout(() => {
-			this.allowDraftAutosave.subscribe(Remote.saveSettingsHelper('AllowDraftAutosave', v=>v?'1':'0'));
-		}, 50);
-	}
 }

dev/Settings/User/Security.js

@@ -19,7 +19,7 @@ export class SecurityUserSettings {
 		this.capaTwoFactor = Settings.capa(Capa.TwoFactor);
 
 		this.autoLogout = SettingsUserStore.autoLogout;
-		this.autoLogout.trigger = ko.observable(SaveSettingsStep.Idle);
+		this.autoLogoutTrigger = ko.observable(SaveSettingsStep.Idle);
 
 		let i18nLogout = (key, params) => i18n('SETTINGS_SECURITY/AUTOLOGIN_' + key, params);
 		this.autoLogoutOptions = ko.computed(() => {
@@ -35,20 +35,16 @@ export class SecurityUserSettings {
 				{ 'id': 60 * 10, 'name': i18nLogout('HOURS_OPTION_NAME', { 'HOURS': 10 }) }
 			];
 		});
+
+		if (this.capaAutoLogout) {
+			this.autoLogout.subscribe(value => Remote.saveSetting(
+				'AutoLogout', pInt(value),
+				settingsSaveHelperSimpleFunction(this.autoLogoutTrigger, this)
+			));
+		}
 	}
 
 	configureTwoFactor() {
 		showScreenPopup(TwoFactorConfigurationPopupView);
 	}
-
-	onBuild() {
-		if (this.capaAutoLogout) {
-			setTimeout(() =>
-				this.autoLogout.subscribe(Remote.saveSettingsHelper(
-					'AutoLogout', pInt,
-					settingsSaveHelperSimpleFunction(this.autoLogout.trigger, this)
-				))
-			);
-		}
-	}
 }

dev/Stores/User/Settings.js

@@ -9,10 +9,10 @@ import { ThemeStore } from 'Stores/Theme';
 export const SettingsUserStore = new class {
 	constructor() {
 		this.layout = ko
-			.observable(Layout.SidePreview)
+			.observable(pInt(SettingsGet('Layout')))
 			.extend({ limitedList: [Layout.SidePreview, Layout.BottomPreview, Layout.NoPreview] });
 
-		this.editorDefaultType = ko.observable(EditorDefaultType.Html).extend({
+		this.editorDefaultType = ko.observable(SettingsGet('EditorDefaultType')).extend({
 			limitedList: [
 				EditorDefaultType.Html,
 				EditorDefaultType.Plain,
@@ -21,17 +21,17 @@ export const SettingsUserStore = new class {
 			]
 		});
 
-		this.messagesPerPage = ko.observable(20).extend({ limitedList: MESSAGES_PER_PAGE_VALUES });
+		this.messagesPerPage = ko.observable(SettingsGet('MPP')).extend({ limitedList: MESSAGES_PER_PAGE_VALUES });
 
 		addObservablesTo(this, {
-			showImages: false,
+			showImages: !!SettingsGet('ShowImages'),
-			removeColors: false,
+			removeColors: !!SettingsGet('RemoveColors'),
-			useCheckboxesInList: true,
+			useCheckboxesInList: !!(ThemeStore.isMobile() || SettingsGet('UseCheckboxesInList')),
-			allowDraftAutosave: true,
+			allowDraftAutosave: !!SettingsGet('AllowDraftAutosave'),
-			useThreads: false,
+			useThreads: !!SettingsGet('UseThreads'),
-			replySameFolder: false,
+			replySameFolder: !!SettingsGet('ReplySameFolder'),
 
-			autoLogout: 30
+			autoLogout: pInt(SettingsGet('AutoLogout'))
 		});
 
 		this.usePreviewPane = ko.computed(() => Layout.NoPreview !== this.layout() && !ThemeStore.isMobile());
@@ -54,21 +54,4 @@ export const SettingsUserStore = new class {
 			}
 		}).throttle(5000);
 	}
-
-	populate() {
-		this.layout(pInt(SettingsGet('Layout')));
-		this.editorDefaultType(SettingsGet('EditorDefaultType'));
-
-		this.autoLogout(pInt(SettingsGet('AutoLogout')));
-		this.messagesPerPage(SettingsGet('MPP'));
-
-		this.showImages(!!SettingsGet('ShowImages'));
-		this.removeColors(!!SettingsGet('RemoveColors'));
-		this.useCheckboxesInList(!!(ThemeStore.isMobile() || SettingsGet('UseCheckboxesInList')));
-		this.allowDraftAutosave(!!SettingsGet('AllowDraftAutosave'));
-		this.useThreads(!!SettingsGet('UseThreads'));
-		this.replySameFolder(!!SettingsGet('ReplySameFolder'));
-
-		this.delayLogout();
-	}
 };

snappymail/v/0.0.0/app/templates/Views/User/SettingsSecurity.html

@@ -14,7 +14,7 @@
 						inline: true,
 						options: autoLogoutOptions,
 						value: autoLogout,
-						trigger: autoLogout.trigger,
+						trigger: autoLogoutTrigger,
 						optionsText: 'name',
 						optionsValue: 'id'
 					}