Prefs manager TS

app/assets/javascripts/@types/app/assets/javascripts/services/preferencesManager.d.ts

@@ -1,4 +1,4 @@
-export namespace PrefKeys {
+export namespace WebPrefKey {
     export const TagsPanelWidth: string;
     export const NotesPanelWidth: string;
     export const EditorWidth: string;

app/assets/javascripts/controllers/editor.ts

@@ -13,7 +13,7 @@ import {
   Uuids,
   ComponentArea,
   ComponentAction,
-  PayloadSource
+  WebPrefKey
 } from 'snjs';
 import find from 'lodash/find';
 import { isDesktopApplication } from '@/utils';
@@ -30,7 +30,6 @@ import {
   StringDeleteNote,
   StringEmptyTrash
 } from '@/strings';
-import { PrefKeys } from '@/services/preferencesManager';
 import { RawPayload } from '@/../../../../snjs/dist/@types/protocol/payloads/generator';
 import { ComponentMutator } from '@/../../../../snjs/dist/@types/models';
 
@@ -115,9 +114,9 @@ class EditorCtrl extends PureCtrl {
       onReady: () => this.reloadPreferences()
     };
     /** Used by .pug template */
-    this.prefKeyMonospace = PrefKeys.EditorMonospaceEnabled;
+    this.prefKeyMonospace = WebPrefKey.EditorMonospaceEnabled;
-    this.prefKeySpellcheck = PrefKeys.EditorSpellcheck;
+    this.prefKeySpellcheck = WebPrefKey.EditorSpellcheck;
-    this.prefKeyMarginResizers = PrefKeys.EditorResizersEnabled;
+    this.prefKeyMarginResizers = WebPrefKey.EditorResizersEnabled;
 
     this.editorMenuOnSelect = this.editorMenuOnSelect.bind(this);
     this.onPanelResizeFinish = this.onPanelResizeFinish.bind(this);
@@ -867,13 +866,13 @@ class EditorCtrl extends PureCtrl {
   onPanelResizeFinish(width: number, left: number, isMaxWidth: boolean) {
     if (isMaxWidth) {
       this.application.getPrefsService().setUserPrefValue(
-        PrefKeys.EditorWidth,
+        WebPrefKey.EditorWidth,
         null
       );
     } else {
       if (width !== undefined && width !== null) {
         this.application.getPrefsService().setUserPrefValue(
-          PrefKeys.EditorWidth,
+          WebPrefKey.EditorWidth,
           width
         );
         this.leftPanelPuppet!.setWidth!(width);
@@ -881,7 +880,7 @@ class EditorCtrl extends PureCtrl {
     }
     if (left !== undefined && left !== null) {
       this.application.getPrefsService().setUserPrefValue(
-        PrefKeys.EditorLeft,
+        WebPrefKey.EditorLeft,
         left
       );
       this.rightPanelPuppet!.setLeft!(left);
@@ -891,15 +890,15 @@ class EditorCtrl extends PureCtrl {
 
   reloadPreferences() {
     const monospaceEnabled = this.application.getPrefsService().getValue(
-      PrefKeys.EditorMonospaceEnabled,
+      WebPrefKey.EditorMonospaceEnabled,
       true
     );
     const spellcheck = this.application.getPrefsService().getValue(
-      PrefKeys.EditorSpellcheck,
+      WebPrefKey.EditorSpellcheck,
       true
     );
     const marginResizersEnabled = this.application.getPrefsService().getValue(
-      PrefKeys.EditorResizersEnabled,
+      WebPrefKey.EditorResizersEnabled,
       true
     );
     this.setState({
@@ -921,7 +920,7 @@ class EditorCtrl extends PureCtrl {
       this.rightPanelPuppet!.ready
     ) {
       const width = this.application.getPrefsService().getValue(
-        PrefKeys.EditorWidth,
+        WebPrefKey.EditorWidth,
         null
       );
       if (width != null) {
@@ -929,7 +928,7 @@ class EditorCtrl extends PureCtrl {
         this.rightPanelPuppet!.setWidth!(width);
       }
       const left = this.application.getPrefsService().getValue(
-        PrefKeys.EditorLeft,
+        WebPrefKey.EditorLeft,
         null
       );
       if (left != null) {
@@ -957,7 +956,7 @@ class EditorCtrl extends PureCtrl {
     }
   }
 
-  async togglePrefKey(key: string) {
+  async toggleWebPrefKey(key: string) {
     (this as any)[key] = !(this as any)[key];
     this.application.getPrefsService().setUserPrefValue(
       key,
@@ -966,7 +965,7 @@ class EditorCtrl extends PureCtrl {
     );
     this.reloadFont();
 
-    if (key === PrefKeys.EditorSpellcheck) {
+    if (key === WebPrefKey.EditorSpellcheck) {
       /** Allows textarea to reload */
       await this.setState({
         noteReady: false
@@ -975,7 +974,7 @@ class EditorCtrl extends PureCtrl {
         noteReady: true
       });
       this.reloadFont();
-    } else if (key === PrefKeys.EditorResizersEnabled && (this as any)[key] === true) {
+    } else if (key === WebPrefKey.EditorResizersEnabled && (this as any)[key] === true) {
       this.$timeout(() => {
         this.leftPanelPuppet!.flash!();
         this.rightPanelPuppet!.flash!();

app/assets/javascripts/controllers/notes/notes.ts

@@ -1,13 +1,10 @@
 import { PanelPuppet, WebDirective } from './../../types';
 import angular from 'angular';
 import template from '%/notes.pug';
-import { ApplicationEvent, ContentType, removeFromArray, SNNote, SNTag } from 'snjs';
+import { ApplicationEvent, ContentType, removeFromArray, SNNote, SNTag, WebPrefKey } from 'snjs';
 import { PureCtrl } from '@Controllers/abstract/pure_ctrl';
 import { AppStateEvent } from '@/services/state';
 import { KeyboardModifier, KeyboardKey } from '@/services/keyboardManager';
-import {
-  PrefKeys
-} from '@/services/preferencesManager';
 import {
   PANEL_NAME_NOTES
 } from '@/controllers/constants';
@@ -375,7 +372,7 @@ class NotesCtrl extends PureCtrl {
     const viewOptions = {} as NotesState;
     const prevSortValue = this.getState().sortBy;
     let sortBy = this.application!.getPrefsService().getValue(
-      PrefKeys.SortNotesBy,
+      WebPrefKey.SortNotesBy,
       NoteSortKey.CreatedAt
     );
     if (sortBy === NoteSortKey.UpdatedAt) {
@@ -384,27 +381,27 @@ class NotesCtrl extends PureCtrl {
     }
     viewOptions.sortBy = sortBy;
     viewOptions.sortReverse = this.application!.getPrefsService().getValue(
-      PrefKeys.SortNotesReverse,
+      WebPrefKey.SortNotesReverse,
       false
     );
     viewOptions.showArchived = this.application!.getPrefsService().getValue(
-      PrefKeys.NotesShowArchived,
+      WebPrefKey.NotesShowArchived,
       false
     );
     viewOptions.hidePinned = this.application!.getPrefsService().getValue(
-      PrefKeys.NotesHidePinned,
+      WebPrefKey.NotesHidePinned,
       false
     );
     viewOptions.hideNotePreview = this.application!.getPrefsService().getValue(
-      PrefKeys.NotesHideNotePreview,
+      WebPrefKey.NotesHideNotePreview,
       false
     );
     viewOptions.hideDate = this.application!.getPrefsService().getValue(
-      PrefKeys.NotesHideDate,
+      WebPrefKey.NotesHideDate,
       false
     );
     viewOptions.hideTags = this.application!.getPrefsService().getValue(
-      PrefKeys.NotesHideTags,
+      WebPrefKey.NotesHideTags,
       false
     );
     this.setState({
@@ -414,7 +411,7 @@ class NotesCtrl extends PureCtrl {
       this.selectFirstNote();
     }
     const width = this.application!.getPrefsService().getValue(
-      PrefKeys.NotesPanelWidth
+      WebPrefKey.NotesPanelWidth
     );
     if (width && this.panelPuppet!.ready) {
       this.panelPuppet!.setWidth!(width);
@@ -434,7 +431,7 @@ class NotesCtrl extends PureCtrl {
     isCollapsed: boolean
   ) {
     this.application!.getPrefsService().setUserPrefValue(
-      PrefKeys.NotesPanelWidth,
+      WebPrefKey.NotesPanelWidth,
       newWidth
     );
     this.application!.getPrefsService().syncUserPreferences();
@@ -658,7 +655,7 @@ class NotesCtrl extends PureCtrl {
     this.setShowMenuFalse();
   }
 
-  togglePrefKey(key: string) {
+  toggleWebPrefKey(key: string) {
     this.application!.getPrefsService().setUserPrefValue(key, !this.state[key]);
     this.application!.getPrefsService().syncUserPreferences();
   }
@@ -678,7 +675,7 @@ class NotesCtrl extends PureCtrl {
   toggleReverseSort() {
     this.selectedMenuItem();
     this.application!.getPrefsService().setUserPrefValue(
-      PrefKeys.SortNotesReverse,
+      WebPrefKey.SortNotesReverse,
       !this.getState().sortReverse
     );
     this.application!.getPrefsService().syncUserPreferences();
@@ -686,7 +683,7 @@ class NotesCtrl extends PureCtrl {
 
   setSortBy(type: NoteSortKey) {
     this.application!.getPrefsService().setUserPrefValue(
-      PrefKeys.SortNotesBy,
+      WebPrefKey.SortNotesBy,
       type
     );
     this.application!.getPrefsService().syncUserPreferences();

app/assets/javascripts/controllers/tags.ts

@@ -8,12 +8,12 @@ import {
   ComponentAction,
   SNSmartTag,
   ComponentArea,
-  SNComponent
+  SNComponent,
+  WebPrefKey
 } from 'snjs';
 import template from '%/tags.pug';
 import { AppStateEvent } from '@/services/state';
 import { PANEL_NAME_TAGS } from '@/controllers/constants';
-import { PrefKeys } from '@/services/preferencesManager';
 import { STRING_DELETE_TAG } from '@/strings';
 import { PureCtrl } from '@Controllers/abstract/pure_ctrl';
 import { UuidString } from '@/../../../../snjs/dist/@types/types';
@@ -174,7 +174,7 @@ class TagsPanelCtrl extends PureCtrl {
     if (!this.panelPuppet.ready) {
       return;
     }
-    const width = this.application.getPrefsService().getValue(PrefKeys.TagsPanelWidth);
+    const width = this.application.getPrefsService().getValue(WebPrefKey.TagsPanelWidth);
     if (width) {
       this.panelPuppet.setWidth!(width);
       if (this.panelPuppet.isCollapsed!()) {
@@ -193,7 +193,7 @@ class TagsPanelCtrl extends PureCtrl {
     isCollapsed: boolean
   ) => {
     this.application.getPrefsService().setUserPrefValue(
-      PrefKeys.TagsPanelWidth,
+      WebPrefKey.TagsPanelWidth,
       newWidth,
       true
     );

app/assets/javascripts/services/nativeExtManager.js

@@ -1,7 +1,7 @@
 import { isDesktopApplication, dictToArray } from '@/utils';
 import {
   SNPredicate,
-  ContentTypes,
+  ContentType,
   CreateMaxPayloadFromAnyObject,
   ApplicationService
 } from 'snjs';
@@ -127,7 +127,7 @@ export class NativeExtManager extends ApplicationService {
       name: 'Batch Manager',
       identifier: this.batchManagerId
     };
-    const allContentTypes = dictToArray(ContentTypes);
+    const allContentType = dictToArray(ContentType);
     const content = {
       name: packageInfo.name,
       area: 'modal',
@@ -135,7 +135,7 @@ export class NativeExtManager extends ApplicationService {
       permissions: [
         {
           name: STREAM_ITEMS_PERMISSION,
-          content_types: allContentTypes
+          content_types: allContentType
         }
       ]
     };

app/assets/javascripts/services/preferencesManager.js

@@ -1,80 +0,0 @@
-import {
-  SNPredicate,
-  ContentTypes,
-  CreateMaxPayloadFromAnyObject,
-  ApplicationService
-} from 'snjs';
-
-export const PrefKeys = {
-  TagsPanelWidth: 'tagsPanelWidth',
-  NotesPanelWidth: 'notesPanelWidth',
-  EditorWidth: 'editorWidth',
-  EditorLeft: 'editorLeft',
-  EditorMonospaceEnabled: 'monospaceFont',
-  EditorSpellcheck: 'spellcheck',
-  EditorResizersEnabled: 'marginResizersEnabled',
-  SortNotesBy: 'sortBy',
-  SortNotesReverse: 'sortReverse',
-  NotesShowArchived: 'showArchived',
-  NotesHidePinned: 'hidePinned',
-  NotesHideNotePreview: 'hideNotePreview',
-  NotesHideDate: 'hideDate',
-  NotesHideTags: 'hideTags'
-};
-
-export class PreferencesManager extends ApplicationService {
-  
-  /** @override */
-  onAppLaunch() {
-    super.onAppLaunch();
-    this.streamPreferences();
-    this.loadSingleton();
-  }
-
-  streamPreferences() {
-    this.application.streamItems({
-      contentType: ContentType.UserPrefs,
-      stream: () => {
-        this.loadSingleton();
-      }
-    });
-  }
-
-  async loadSingleton() {
-    const contentType = ContentType.UserPrefs;
-    const predicate = new SNPredicate('content_type', '=', contentType);
-    this.userPreferences = await this.application.singletonManager.findOrCreateSingleton({
-      predicate: predicate,
-      createPayload: CreateMaxPayloadFromAnyObject({
-        object: {
-          content_type: contentType,
-          content: {}
-        }
-      })
-    });
-    this.preferencesDidChange();
-  }
-
-  preferencesDidChange() {
-    this.application.getAppState().setUserPreferences(this.userPreferences);
-  }
-
-  syncUserPreferences() {
-    if (this.userPreferences) {
-      this.application.saveItem({ item: this.userPreferences });
-    }
-  }
-
-  getValue(key, defaultValue) {
-    if (!this.userPreferences) { return defaultValue; }
-    const value = this.userPreferences.getAppDataItem(key);
-    return (value !== undefined && value != null) ? value : defaultValue;
-  }
-
-  setUserPrefValue(key, value, sync) {
-    this.userPreferences.setAppDataItem(key, value);
-    if (sync) {
-      this.syncUserPreferences();
-    }
-  }
-}

app/assets/javascripts/services/preferencesManager.ts

@@ -0,0 +1,75 @@
+import { WebApplication } from '@/application';
+import {
+  SNPredicate,
+  ContentType,
+  ApplicationService,
+  SNUserPrefs,
+  WebPrefKey,
+  UserPrefsMutator
+} from 'snjs';
+import { FillItemContent } from '@/../../../../snjs/dist/@types/models/generator';
+
+export class PreferencesManager extends ApplicationService {
+
+  private userPreferences!: SNUserPrefs
+
+  /** @override */
+  async onAppLaunch() {
+    super.onAppLaunch();
+    this.streamPreferences();
+    this.loadSingleton();
+  }
+
+  get webApplication() {
+    return this.application as WebApplication;
+  }
+
+  streamPreferences() {
+    this.application!.streamItems(
+      ContentType.UserPrefs,
+      () => {
+        this.loadSingleton();
+      }
+    );
+  }
+
+  async loadSingleton() {
+    const contentType = ContentType.UserPrefs;
+    const predicate = new SNPredicate('content_type', '=', contentType);
+    this.userPreferences = (await this.application!.singletonManager!.findOrCreateSingleton(
+      predicate,
+      contentType,
+      FillItemContent({})
+    )) as SNUserPrefs;
+    this.preferencesDidChange();
+  }
+
+  preferencesDidChange() {
+    this.webApplication.getAppState().setUserPreferences(this.userPreferences);
+  }
+
+  syncUserPreferences() {
+    if (this.userPreferences) {
+      this.application!.saveItem(this.userPreferences.uuid);
+    }
+  }
+
+  getValue(key: WebPrefKey, defaultValue: any) {
+    if (!this.userPreferences) { return defaultValue; }
+    const value = this.userPreferences.getPref(key);
+    return (value !== undefined && value !== null) ? value : defaultValue;
+  }
+
+  setUserPrefValue(key: WebPrefKey, value: any, sync = false) {
+    this.application!.changeItem(
+      this.userPreferences.uuid,
+      (m) => {
+        const mutator = m as UserPrefsMutator;
+        mutator.setWebPref(key, value);
+      }
+    )
+    if (sync) {
+      this.syncUserPreferences();
+    }
+  }
+}

app/assets/templates/editor.pug

@@ -130,7 +130,7 @@
               .sk-menu-panel-header
                 .sk-menu-panel-header-title Global Display
               menu-row(
-                action="self.selectedMenuItem(true); self.togglePrefKey(self.prefKeyMonospace)", 
+                action="self.selectedMenuItem(true); self.toggleWebPrefKey(self.prefKeyMonospace)", 
                 circle="self.state.monospaceEnabled ? 'success' : 'neutral'", 
                 desc="'Toggles the font style for the default editor'", 
                 disabled='self.state.selectedEditor', 
@@ -138,7 +138,7 @@
                 subtitle="self.state.selectedEditor ? 'Not available with editor extensions' : null"
                 )
               menu-row(
-                action="self.selectedMenuItem(true); self.togglePrefKey(self.prefKeySpellcheck)", 
+                action="self.selectedMenuItem(true); self.toggleWebPrefKey(self.prefKeySpellcheck)", 
                 circle="self.state.spellcheck ? 'success' : 'neutral'", 
                 desc="'Toggles spellcheck for the default editor'", 
                 disabled='self.state.selectedEditor', 
@@ -149,7 +149,7 @@
                     : (self.state.isDesktop ? 'May degrade editor performance' : null)
                   `)
               menu-row(
-                action="self.selectedMenuItem(true); self.togglePrefKey(self.prefKeyMarginResizers)", 
+                action="self.selectedMenuItem(true); self.toggleWebPrefKey(self.prefKeyMarginResizers)", 
                 circle="self.state.marginResizersEnabled ? 'success' : 'neutral'", 
                 desc="'Allows for editor left and right margins to be resized'", 
                 faded='!self.state.marginResizersEnabled', 

app/assets/templates/notes.pug

@@ -65,7 +65,7 @@
                 .sk-menu-panel-header
                   .sk-menu-panel-header-title Display
                 menu-row(
-                  action="self.selectedMenuItem(); self.togglePrefKey('showArchived')"
+                  action="self.selectedMenuItem(); self.toggleWebPrefKey('showArchived')"
                   circle="self.state.showArchived ? 'success' : 'danger'"
                   desc=`'Archived notes are usually hidden.
                     You can explicitly show them with this option.'`
@@ -73,7 +73,7 @@
                   label="'Archived Notes'"
                   )
                 menu-row(
-                  action="self.selectedMenuItem(); self.togglePrefKey('hidePinned')"
+                  action="self.selectedMenuItem(); self.toggleWebPrefKey('hidePinned')"
                   circle="self.state.hidePinned ? 'danger' : 'success'"
                   desc=`'Pinned notes always appear on top. You can hide them temporarily
                     with this option so you can focus on other notes in the list.'`
@@ -81,21 +81,21 @@
                   label="'Pinned Notes'"
                   )
                 menu-row(
-                  action="self.selectedMenuItem(); self.togglePrefKey('hideNotePreview')"
+                  action="self.selectedMenuItem(); self.toggleWebPrefKey('hideNotePreview')"
                   circle="self.state.hideNotePreview ? 'danger' : 'success'"
                   desc="'Hide the note preview for a more condensed list of notes'"
                   faded="self.state.hideNotePreview"
                   label="'Note Preview'"
                   )
                 menu-row(
-                  action="self.selectedMenuItem(); self.togglePrefKey('hideDate')"
+                  action="self.selectedMenuItem(); self.toggleWebPrefKey('hideDate')"
                   circle="self.state.hideDate ? 'danger' : 'success'"
                   desc="'Hide the date displayed in each row'"
                   faded="self.state.hideDate"
                   label="'Date'"
                   )
                 menu-row(
-                  action="self.selectedMenuItem(); self.togglePrefKey('hideTags')"
+                  action="self.selectedMenuItem(); self.toggleWebPrefKey('hideTags')"
                   circle="self.state.hideTags ? 'danger' : 'success'"
                   desc="'Hide the list of tags associated with each note'"
                   faded="self.state.hideTags"