From 023c8f603b19f9660c185391699550a84a590ece Mon Sep 17 00:00:00 2001 From: djmaze Date: Fri, 3 Sep 2021 16:37:20 +0200 Subject: [PATCH] some ko.computed() to addComputables()/addComputablesTo() --- dev/Settings/Admin/General.js | 13 ++--- dev/Settings/Admin/Packages.js | 17 +++--- dev/Settings/User/General.js | 55 ++++++++++---------- dev/Settings/User/Templates.js | 10 ++-- dev/Stores/User/Folder.js | 78 +++++++++++++--------------- dev/Stores/User/Pgp.js | 8 +-- dev/View/Popup/DomainAlias.js | 10 ++-- dev/View/Popup/Plugin.js | 6 ++- dev/View/User/MailBox/MessageList.js | 20 +++---- 9 files changed, 110 insertions(+), 107 deletions(-) diff --git a/dev/Settings/Admin/General.js b/dev/Settings/Admin/General.js index 7a0f459d6..26e1d8e29 100644 --- a/dev/Settings/Admin/General.js +++ b/dev/Settings/Admin/General.js @@ -7,7 +7,8 @@ import { changeTheme, convertThemeName, addObservablesTo, - addSubscribablesTo + addSubscribablesTo, + addComputablesTo } from 'Common/Utils'; import { Capa, SaveSettingsStep } from 'Common/Enums'; @@ -74,12 +75,12 @@ export class GeneralAdminSettings { ].join('') : ''; - this.themesOptions = ko.computed(() => - this.themes.map(theme => ({ optValue: theme, optText: convertThemeName(theme) })) - ); + addComputablesTo(this, { + themesOptions: () => this.themes.map(theme => ({ optValue: theme, optText: convertThemeName(theme) })), - this.languageFullName = ko.computed(() => convertLangName(this.language())); - this.languageAdminFullName = ko.computed(() => convertLangName(this.languageAdmin())); + languageFullName: () => convertLangName(this.language()), + languageAdminFullName: () => convertLangName(this.languageAdmin()) + }); this.languageAdminTrigger = ko.observable(SaveSettingsStep.Idle).extend({ debounce: 100 }); diff --git a/dev/Settings/Admin/Packages.js b/dev/Settings/Admin/Packages.js index 644146b55..13f780153 100644 --- a/dev/Settings/Admin/Packages.js +++ b/dev/Settings/Admin/Packages.js @@ -9,6 +9,7 @@ import Remote from 'Remote/Admin/Fetch'; import { showScreenPopup } from 'Knoin/Knoin'; import { PluginPopupView } from 'View/Popup/Plugin'; import { SettingsGet } from 'Common/Globals'; +import { addComputablesTo } from 'Common/Utils'; export class PackagesAdminSettings { constructor() { @@ -16,17 +17,13 @@ export class PackagesAdminSettings { this.packages = PackageAdminStore; - this.packagesCurrent = ko.computed(() => - PackageAdminStore.filter(item => item && item.installed && !item.canBeUpdated) - ); - this.packagesAvailableForUpdate = ko.computed(() => - PackageAdminStore.filter(item => item && item.installed && !!item.canBeUpdated) - ); - this.packagesAvailableForInstallation = ko.computed(() => - PackageAdminStore.filter(item => item && !item.installed) - ); + addComputablesTo(this, { + packagesCurrent: () => PackageAdminStore.filter(item => item && item.installed && !item.canBeUpdated), + packagesAvailableForUpdate: () => PackageAdminStore.filter(item => item && item.installed && !!item.canBeUpdated), + packagesAvailableForInstallation: () => PackageAdminStore.filter(item => item && !item.installed), - this.visibility = ko.computed(() => (PackageAdminStore.loading() ? 'visible' : 'hidden')); + visibility: () => (PackageAdminStore.loading() ? 'visible' : 'hidden') + }); this.enabledPlugins = ko.observable(!!SettingsGet('EnabledPlugins')); this.enabledPlugins.subscribe(value => diff --git a/dev/Settings/User/General.js b/dev/Settings/User/General.js index 386044dd2..41f177ada 100644 --- a/dev/Settings/User/General.js +++ b/dev/Settings/User/General.js @@ -4,7 +4,7 @@ import { MESSAGES_PER_PAGE_VALUES } from 'Common/Consts'; import { SaveSettingsStep } from 'Common/Enums'; import { EditorDefaultType, Layout } from 'Common/EnumsUser'; import { Settings, SettingsGet } from 'Common/Globals'; -import { isArray, settingsSaveHelperSimpleFunction, addObservablesTo, addSubscribablesTo } from 'Common/Utils'; +import { isArray, settingsSaveHelperSimpleFunction, addObservablesTo, addSubscribablesTo, addComputablesTo } from 'Common/Utils'; import { i18n, trigger as translatorTrigger, reload as translatorReload, convertLangName } from 'Common/Translator'; import { showScreenPopup } from 'Knoin/Knoin'; @@ -47,7 +47,6 @@ export class GeneralUserSettings { this.replySameFolder = SettingsUserStore.replySameFolder; this.allowLanguagesOnSettings = !!SettingsGet('AllowLanguagesOnSettings'); - this.languageFullName = ko.computed(() => convertLangName(this.language())); this.languageTrigger = ko.observable(SaveSettingsStep.Idle).extend({ debounce: 100 }); addObservablesTo(this, { @@ -59,33 +58,37 @@ export class GeneralUserSettings { this.identities = IdentityUserStore; - this.identityMain = ko.computed(() => { - const list = this.identities(); - return isArray(list) ? list.find(item => item && !item.id()) : null; - }); + addComputablesTo(this, { + languageFullName: () => convertLangName(this.language()), - this.identityMainDesc = ko.computed(() => { - const identity = this.identityMain(); - return identity ? identity.formattedName() : '---'; - }); + identityMain: () => { + const list = this.identities(); + return isArray(list) ? list.find(item => item && !item.id()) : null; + }, - this.editorDefaultTypes = ko.computed(() => { - translatorTrigger(); - return [ - { id: EditorDefaultType.Html, name: i18n('SETTINGS_GENERAL/LABEL_EDITOR_HTML') }, - { id: EditorDefaultType.Plain, name: i18n('SETTINGS_GENERAL/LABEL_EDITOR_PLAIN') }, - { id: EditorDefaultType.HtmlForced, name: i18n('SETTINGS_GENERAL/LABEL_EDITOR_HTML_FORCED') }, - { id: EditorDefaultType.PlainForced, name: i18n('SETTINGS_GENERAL/LABEL_EDITOR_PLAIN_FORCED') } - ]; - }); + identityMainDesc: () => { + const identity = this.identityMain(); + return identity ? identity.formattedName() : '---'; + }, - this.layoutTypes = ko.computed(() => { - translatorTrigger(); - return [ - { id: Layout.NoPreview, name: i18n('SETTINGS_GENERAL/LABEL_LAYOUT_NO_SPLIT') }, - { id: Layout.SidePreview, name: i18n('SETTINGS_GENERAL/LABEL_LAYOUT_VERTICAL_SPLIT') }, - { id: Layout.BottomPreview, name: i18n('SETTINGS_GENERAL/LABEL_LAYOUT_HORIZONTAL_SPLIT') } - ]; + editorDefaultTypes: () => { + translatorTrigger(); + return [ + { id: EditorDefaultType.Html, name: i18n('SETTINGS_GENERAL/LABEL_EDITOR_HTML') }, + { id: EditorDefaultType.Plain, name: i18n('SETTINGS_GENERAL/LABEL_EDITOR_PLAIN') }, + { id: EditorDefaultType.HtmlForced, name: i18n('SETTINGS_GENERAL/LABEL_EDITOR_HTML_FORCED') }, + { id: EditorDefaultType.PlainForced, name: i18n('SETTINGS_GENERAL/LABEL_EDITOR_PLAIN_FORCED') } + ]; + }, + + layoutTypes: () => { + translatorTrigger(); + return [ + { id: Layout.NoPreview, name: i18n('SETTINGS_GENERAL/LABEL_LAYOUT_NO_SPLIT') }, + { id: Layout.SidePreview, name: i18n('SETTINGS_GENERAL/LABEL_LAYOUT_VERTICAL_SPLIT') }, + { id: Layout.BottomPreview, name: i18n('SETTINGS_GENERAL/LABEL_LAYOUT_HORIZONTAL_SPLIT') } + ]; + } }); const fReloadLanguageHelper = (saveSettingsStep) => () => { diff --git a/dev/Settings/User/Templates.js b/dev/Settings/User/Templates.js index ad7b45981..341043034 100644 --- a/dev/Settings/User/Templates.js +++ b/dev/Settings/User/Templates.js @@ -8,15 +8,17 @@ import Remote from 'Remote/User/Fetch'; import { showScreenPopup } from 'Knoin/Knoin'; import { TemplatePopupView } from 'View/Popup/Template'; +import { addComputablesTo } from 'Common/Utils'; export class TemplatesUserSettings { constructor() { this.templates = TemplateUserStore.templates; - this.processText = ko.computed(() => - TemplateUserStore.templates.loading() ? i18n('SETTINGS_TEMPLETS/LOADING_PROCESS') : '' - ); - this.visibility = ko.computed(() => this.processText() ? 'visible' : 'hidden'); + addComputablesTo({ + processText: () => TemplateUserStore.templates.loading() ? i18n('SETTINGS_TEMPLETS/LOADING_PROCESS') : '', + + visibility: () => this.processText() ? 'visible' : 'hidden' + }); this.templateForDeletion = ko.observable(null).deleteAccessHelper(); } diff --git a/dev/Stores/User/Folder.js b/dev/Stores/User/Folder.js index 9f18df18c..802fd3df9 100644 --- a/dev/Stores/User/Folder.js +++ b/dev/Stores/User/Folder.js @@ -2,7 +2,7 @@ import ko from 'ko'; import { FolderType, FolderSortMode } from 'Common/EnumsUser'; import { UNUSED_OPTION_VALUE } from 'Common/Consts'; -import { addObservablesTo, addSubscribablesTo } from 'Common/Utils'; +import { addObservablesTo, addSubscribablesTo, addComputablesTo } from 'Common/Utils'; import { getFolderInboxName, getFolderFromCacheList } from 'Common/Cache'; import { Settings, SettingsGet } from 'Common/Globals'; //import Remote from 'Remote/User/Fetch'; Circular dependency @@ -52,50 +52,44 @@ export const FolderUserStore = new class { this.sieveAllowFileintoInbox = !!SettingsGet('SieveAllowFileintoInbox'); - this.draftFolderNotEnabled = ko.computed( - () => !this.draftFolder() || UNUSED_OPTION_VALUE === this.draftFolder() - ); + addComputablesTo(this, { - // foldersListWithSingleInboxRootFolder - /** returns true when there are no non-system folders in the root of the folders tree */ - this.singleRootFolder = ko.computed(() => { - let multiple = false; - this.folderList.forEach(folder => { - let subscribed = folder.subscribed(), - hasSub = folder.hasSubscribedSubfolders(); - multiple |= (!folder.isSystemFolder() || (hasSub && !folder.isInbox())) && (subscribed || hasSub) - }); - return !multiple; + draftFolderNotEnabled: () => !this.draftFolder() || UNUSED_OPTION_VALUE === this.draftFolder(), + + // foldersListWithSingleInboxRootFolder + /** returns true when there are no non-system folders in the root of the folders tree */ + singleRootFolder: () => { + let multiple = false; + this.folderList.forEach(folder => { + let subscribed = folder.subscribed(), + hasSub = folder.hasSubscribedSubfolders(); + multiple |= (!folder.isSystemFolder() || (hasSub && !folder.isInbox())) && (subscribed || hasSub) + }); + return !multiple; + }, + + currentFolderFullNameRaw: () => (this.currentFolder() ? this.currentFolder().fullNameRaw : ''), + + currentFolderFullName: () => (this.currentFolder() ? this.currentFolder().fullName : ''), + currentFolderFullNameHash: () => (this.currentFolder() ? this.currentFolder().fullNameHash : ''), + + foldersChanging: () => + this.foldersLoading() | this.foldersCreating() | this.foldersDeleting() | this.foldersRenaming(), + + folderListSystemNames: () => { + const list = [getFolderInboxName()], + others = [this.sentFolder(), this.draftFolder(), this.spamFolder(), this.trashFolder(), this.archiveFolder()]; + + this.folderList().length && + others.forEach(name => name && UNUSED_OPTION_VALUE !== name && list.push(name)); + + return list; + }, + + folderListSystem: () => + this.folderListSystemNames().map(name => getFolderFromCacheList(name)).filter(v => v) }); - this.currentFolderFullNameRaw = ko.computed(() => (this.currentFolder() ? this.currentFolder().fullNameRaw : '')); - - this.currentFolderFullName = ko.computed(() => (this.currentFolder() ? this.currentFolder().fullName : '')); - this.currentFolderFullNameHash = ko.computed(() => (this.currentFolder() ? this.currentFolder().fullNameHash : '')); - - this.foldersChanging = ko.computed(() => { - const loading = this.foldersLoading(), - creating = this.foldersCreating(), - deleting = this.foldersDeleting(), - renaming = this.foldersRenaming(); - - return loading || creating || deleting || renaming; - }); - - this.folderListSystemNames = ko.computed(() => { - const list = [getFolderInboxName()], - others = [this.sentFolder(), this.draftFolder(), this.spamFolder(), this.trashFolder(), this.archiveFolder()]; - - this.folderList().length && - others.forEach(name => name && UNUSED_OPTION_VALUE !== name && list.push(name)); - - return list; - }); - - this.folderListSystem = ko.computed(() => - this.folderListSystemNames().map(name => getFolderFromCacheList(name)).filter(v => v) - ); - const fRemoveSystemFolderType = (observable) => () => { const folder = getFolderFromCacheList(observable()); diff --git a/dev/Stores/User/Pgp.js b/dev/Stores/User/Pgp.js index 9db75d106..435f16a2d 100644 --- a/dev/Stores/User/Pgp.js +++ b/dev/Stores/User/Pgp.js @@ -1,7 +1,7 @@ import ko from 'ko'; import { i18n } from 'Common/Translator'; -import { isArray, arrayLength, pString } from 'Common/Utils'; +import { isArray, arrayLength, pString, addComputablesTo } from 'Common/Utils'; import { createElement } from 'Common/Globals'; import { AccountUserStore } from 'Stores/User/Account'; @@ -141,8 +141,10 @@ export const PgpUserStore = new class { this.openpgpkeys = ko.observableArray(); this.openpgpKeyring = null; - this.openpgpkeysPublic = ko.computed(() => this.openpgpkeys.filter(item => item && !item.isPrivate)); - this.openpgpkeysPrivate = ko.computed(() => this.openpgpkeys.filter(item => item && item.isPrivate)); + addComputablesTo(this, { + openpgpkeysPublic: () => this.openpgpkeys.filter(item => item && !item.isPrivate), + openpgpkeysPrivate: () => this.openpgpkeys.filter(item => item && item.isPrivate) + }); } /** diff --git a/dev/View/Popup/DomainAlias.js b/dev/View/Popup/DomainAlias.js index cecd86acb..3b0af3097 100644 --- a/dev/View/Popup/DomainAlias.js +++ b/dev/View/Popup/DomainAlias.js @@ -1,5 +1,3 @@ -import ko from 'ko'; - import { getNotification } from 'Common/Translator'; import { DomainAdminStore } from 'Stores/Admin/Domain'; @@ -22,11 +20,13 @@ class DomainAliasPopupView extends AbstractViewPopup { alias: '' }); - this.domains = ko.computed(() => DomainAdminStore.filter(item => item && !item.alias)); + this.addComputables({ + domains: () => DomainAdminStore.filter(item => item && !item.alias), - this.domainsOptions = ko.computed(() => this.domains().map(item => ({ optValue: item.name, optText: item.name }))); + domainsOptions: () => this.domains().map(item => ({ optValue: item.name, optText: item.name })), - this.canBeSaved = ko.computed(() => !this.saving() && this.name() && this.alias()); + canBeSaved: () => !this.saving() && this.name() && this.alias() + }); decorateKoCommands(this, { createCommand: self => self.canBeSaved() diff --git a/dev/View/Popup/Plugin.js b/dev/View/Popup/Plugin.js index d2f27688b..4fd8aefcf 100644 --- a/dev/View/Popup/Plugin.js +++ b/dev/View/Popup/Plugin.js @@ -23,8 +23,10 @@ class PluginPopupView extends AbstractViewPopup { this.configures = ko.observableArray(); - this.hasReadme = ko.computed(() => !!this.readme()); - this.hasConfiguration = ko.computed(() => 0 < this.configures().length); + this.addComputables({ + hasReadme: () => !!this.readme(), + hasConfiguration: () => 0 < this.configures().length + }); this.bDisabeCloseOnEsc = true; this.sDefaultScope = Scope.All; diff --git a/dev/View/User/MailBox/MessageList.js b/dev/View/User/MailBox/MessageList.js index f8baa23e0..00b26342f 100644 --- a/dev/View/User/MailBox/MessageList.js +++ b/dev/View/User/MailBox/MessageList.js @@ -66,8 +66,6 @@ export class MessageListMailBoxUserView extends AbstractViewRight { this.allowMessageListActions = Settings.capa(Capa.MessageListActions); this.allowDangerousActions = Settings.capa(Capa.DangerousActions); - this.popupVisibility = ko.computed(() => 0 < popupVisibilityNames().length); - this.messageList = MessageUserStore.list; this.sortSupported = FolderUserStore.sortSupported; @@ -78,13 +76,17 @@ export class MessageListMailBoxUserView extends AbstractViewRight { this.isMessageSelected = MessageUserStore.isMessageSelected; this.messageListSearch = MessageUserStore.listSearch; this.messageListError = MessageUserStore.listError; - this.folderMenuForMove = ko.computed(() => - folderListOptionsBuilder( - [FolderUserStore.currentFolderFullNameRaw()], - [], - item => item ? item.localName() : '' - ) - ); + + this.addComputables({ + popupVisibility: () => 0 < popupVisibilityNames().length, + + folderMenuForMove: () => + folderListOptionsBuilder( + [FolderUserStore.currentFolderFullNameRaw()], + [], + item => item ? item.localName() : '' + ) + }); this.useCheckboxesInList = SettingsUserStore.useCheckboxesInList;