From a67443c195047cfebf0338e7e071941118497039 Mon Sep 17 00:00:00 2001
From: Michael Shamoon <4887959+nikonratm@users.noreply.github.com>
Date: Tue, 29 Dec 2020 16:53:42 -0800
Subject: [PATCH] Compatability with new settings service

---
 src-ui/src/app/services/app-view.service.ts | 14 +++++++++-----
 src-ui/src/app/services/settings.service.ts |  6 +++++-
 2 files changed, 14 insertions(+), 6 deletions(-)

diff --git a/src-ui/src/app/services/app-view.service.ts b/src-ui/src/app/services/app-view.service.ts
index b44c8965f..6af2e43af 100644
--- a/src-ui/src/app/services/app-view.service.ts
+++ b/src-ui/src/app/services/app-view.service.ts
@@ -1,6 +1,6 @@
 import { Inject, Injectable, Renderer2, RendererFactory2 } from '@angular/core';
 import { DOCUMENT } from '@angular/common';
-import { GENERAL_SETTINGS } from 'src/app/data/storage-keys';
+import { SettingsService, SETTINGS_KEYS } from './settings.service';
 
 @Injectable({
   providedIn: 'root'
@@ -8,22 +8,26 @@ import { GENERAL_SETTINGS } from 'src/app/data/storage-keys';
 export class AppViewService {
   private renderer: Renderer2;
 
-  constructor(rendererFactory: RendererFactory2, @Inject(DOCUMENT) private document) {
+  constructor(
+    private settings: SettingsService,
+    private rendererFactory: RendererFactory2,
+    @Inject(DOCUMENT) private document
+  ) {
     this.renderer = rendererFactory.createRenderer(null, null);
 
     this.updateDarkModeSettings()
   }
 
   updateDarkModeSettings() {
-    let darkModeUseSystem = JSON.parse(localStorage.getItem(GENERAL_SETTINGS.DARK_MODE_USE_SYSTEM)) && GENERAL_SETTINGS.DARK_MODE_USE_SYSTEM_DEFAULT
-    let darkModeEnabled = JSON.parse(localStorage.getItem(GENERAL_SETTINGS.DARK_MODE_ENABLED)) || GENERAL_SETTINGS.DARK_MODE_ENABLED_DEFAULT
+    let darkModeUseSystem = this.settings.get(SETTINGS_KEYS.DARK_MODE_USE_SYSTEM)
+    let darkModeEnabled = this.settings.get(SETTINGS_KEYS.DARK_MODE_ENABLED)
 
     if (darkModeUseSystem) {
       this.renderer.addClass(this.document.body, 'color-scheme-system')
       this.renderer.removeClass(this.document.body, 'color-scheme-dark')
     } else {
       this.renderer.removeClass(this.document.body, 'color-scheme-system')
-      darkModeEnabled ? this.renderer.addClass(this.document.body, 'color-scheme-dark') : this.renderer.removeClass(this.document.body, 'dark-mode')
+      darkModeEnabled ? this.renderer.addClass(this.document.body, 'color-scheme-dark') : this.renderer.removeClass(this.document.body, 'color-scheme-dark')
     }
 
   }
diff --git a/src-ui/src/app/services/settings.service.ts b/src-ui/src/app/services/settings.service.ts
index 00e6ff639..7b1cfe9e3 100644
--- a/src-ui/src/app/services/settings.service.ts
+++ b/src-ui/src/app/services/settings.service.ts
@@ -10,12 +10,16 @@ export const SETTINGS_KEYS = {
   BULK_EDIT_CONFIRMATION_DIALOGS: 'general-settings:bulk-edit:confirmation-dialogs',
   BULK_EDIT_APPLY_ON_CLOSE: 'general-settings:bulk-edit:apply-on-close',
   DOCUMENT_LIST_SIZE: 'general-settings:documentListSize',
+  DARK_MODE_USE_SYSTEM: 'general-settings:dark-mode:use-system',
+  DARK_MODE_ENABLED: 'general-settings:dark-mode:enabled'
 }
 
 const SETTINGS: PaperlessSettings[] = [
   {key: SETTINGS_KEYS.BULK_EDIT_CONFIRMATION_DIALOGS, type: "boolean", default: true},
   {key: SETTINGS_KEYS.BULK_EDIT_APPLY_ON_CLOSE, type: "boolean", default: false},
-  {key: SETTINGS_KEYS.DOCUMENT_LIST_SIZE, type: "number", default: 50}
+  {key: SETTINGS_KEYS.DOCUMENT_LIST_SIZE, type: "number", default: 50},
+  {key: SETTINGS_KEYS.DARK_MODE_USE_SYSTEM, type: "boolean", default: true},
+  {key: SETTINGS_KEYS.DARK_MODE_ENABLED, type: "boolean", default: false}
 ]
 
 @Injectable({