From 4cc812fc65b826c0db33f6e8d9f34e0a8a8c88e6 Mon Sep 17 00:00:00 2001
From: Michael Mayer <michael@liquidbytes.net>
Date: Fri, 25 Dec 2020 20:30:18 +0100
Subject: [PATCH] Config: Fix settings loading in non-public mode

Signed-off-by: Michael Mayer <michael@liquidbytes.net>
---
 frontend/src/common/config.js           | 22 +++++++++++++----
 frontend/src/css/app.css                |  5 ++++
 frontend/src/pages/library/import.vue   | 32 ++++++++++++++++++-------
 frontend/src/pages/library/index.vue    | 30 +++++++++++++++++------
 frontend/src/pages/settings/general.vue |  7 ++++--
 frontend/src/pages/settings/library.vue |  7 ++++--
 internal/config/client.go               |  4 ++++
 7 files changed, 84 insertions(+), 23 deletions(-)

diff --git a/frontend/src/common/config.js b/frontend/src/common/config.js
index 5304945ed..0f4d0d9b2 100644
--- a/frontend/src/common/config.js
+++ b/frontend/src/common/config.js
@@ -77,11 +77,25 @@ export default class Config {
     }
   }
 
+  ready() {
+    return this.values.mode && this.values.mode !== "public";
+  }
+
+  wait() {
+    if (!this.ready()) {
+      return this.update();
+    }
+
+    return Promise.resolve();
+  }
+
   update() {
-    Api.get("config").then(
-      (response) => this.setValues(response.data),
-      () => console.warn("failed pulling updated client config")
-    );
+    return Api.get("config")
+      .then(
+        (response) => this.setValues(response.data),
+        () => console.warn("failed pulling updated client config")
+      )
+      .finally(() => Promise.resolve());
   }
 
   setValues(values) {
diff --git a/frontend/src/css/app.css b/frontend/src/css/app.css
index bb0f0dd94..b8a3c20f3 100644
--- a/frontend/src/css/app.css
+++ b/frontend/src/css/app.css
@@ -151,3 +151,8 @@ main {
 #photoprism .v-card .caption {
     overflow-wrap: anywhere;
 }
+
+#photoprism .body-1,
+#photoprism .body-2 {
+    word-wrap: break-word;
+}
diff --git a/frontend/src/pages/library/import.vue b/frontend/src/pages/library/import.vue
index 0fc64f639..ee78f575a 100644
--- a/frontend/src/pages/library/import.vue
+++ b/frontend/src/pages/library/import.vue
@@ -17,7 +17,7 @@
             hide-no-data flat solo browser-autocomplete="off"
             :items="dirs"
             :loading="loading"
-            :disabled="busy"
+            :disabled="busy || !ready"
             item-text="name"
             item-value="path"
             @change="onChange"
@@ -34,7 +34,7 @@
           <v-flex xs12 class="px-2 pb-2 pt-2">
             <v-checkbox
                 v-model="settings.import.move"
-                :disabled="busy"
+                :disabled="busy || !ready"
                 class="ma-0 pa-0"
                 color="secondary-dark"
                 :label="$gettext('Move Files')"
@@ -56,7 +56,7 @@
         </v-layout>
 
         <v-btn
-            :disabled="!busy"
+            :disabled="!busy || !ready"
             color="secondary-dark"
             class="white--text ml-0 action-cancel"
             depressed
@@ -66,7 +66,7 @@
         </v-btn>
 
         <v-btn v-if="!$config.values.readonly && $config.feature('upload')"
-               :disabled="busy"
+               :disabled="busy || !ready"
                color="secondary-dark"
                class="white--text ml-0 hidden-xs-only action-upload"
                depressed
@@ -77,7 +77,7 @@
         </v-btn>
 
         <v-btn
-            :disabled="busy"
+            :disabled="busy || !ready"
             color="secondary-dark"
             class="white--text ml-0 mt-2 action-import"
             depressed
@@ -104,10 +104,10 @@ export default {
   name: 'PTabImport',
   data() {
     const root = {"path": "/", "name": this.$gettext("All files from import folder")};
-    const settings = new Settings(this.$config.settings());
 
     return {
-      settings: settings,
+      ready: this.$config.ready(),
+      settings: new Settings(this.$config.settings()),
       started: false,
       busy: false,
       loading: false,
@@ -116,16 +116,32 @@ export default {
       fileName: '',
       source: null,
       root: root,
-      dirs: [root, {path: settings.import.path, name: "/" + Util.truncate(settings.import.path, 100, "…")}],
+      dirs: [root],
     };
   },
   created() {
     this.subscriptionId = Event.subscribe('import', this.handleEvent);
+    this.load();
   },
   destroyed() {
     Event.unsubscribe(this.subscriptionId);
   },
   methods: {
+    load() {
+      this.$config.wait().then(() => {
+        this.settings.setValues(this.$config.settings());
+        this.dirs = [this.root];
+
+        if (this.settings.import.path !== this.root.path) {
+          this.dirs.push({
+            path: this.settings.import.path,
+            name: "/" + Util.truncate(this.settings.import.path, 100, "…")
+          });
+        }
+
+        this.ready = true;
+      })
+    },
     onChange() {
       this.settings.save();
     },
diff --git a/frontend/src/pages/library/index.vue b/frontend/src/pages/library/index.vue
index 4a73cb437..c7d50520f 100644
--- a/frontend/src/pages/library/index.vue
+++ b/frontend/src/pages/library/index.vue
@@ -20,7 +20,7 @@
             browser-autocomplete="off"
             :items="dirs"
             :loading="loading"
-            :disabled="busy"
+            :disabled="busy || !ready"
             item-text="name"
             item-value="path"
         >
@@ -35,7 +35,7 @@
           <v-flex xs12 sm6 lg4 class="px-2 pb-2 pt-2">
             <v-checkbox
                 @change="onChange"
-                :disabled="busy"
+                :disabled="busy || !ready"
                 class="ma-0 pa-0"
                 v-model="settings.index.rescan"
                 color="secondary-dark"
@@ -49,7 +49,7 @@
         </v-layout>
 
         <v-btn
-            :disabled="!busy"
+            :disabled="!busy || !ready"
             color="secondary-dark"
             class="white--text ml-0 mt-2 action-cancel"
             depressed
@@ -59,7 +59,7 @@
         </v-btn>
 
         <v-btn
-            :disabled="busy"
+            :disabled="busy || !ready"
             color="secondary-dark"
             class="white--text ml-0 mt-2 action-index"
             depressed
@@ -99,10 +99,10 @@ export default {
   name: 'p-tab-index',
   data() {
     const root = {"path": "/", "name": this.$gettext("All originals")}
-    const settings = new Settings(this.$config.settings());
 
     return {
-      settings: settings,
+      ready: this.$config.ready(),
+      settings: new Settings(this.$config.settings()),
       readonly: this.$config.get("readonly"),
       config: this.$config.values,
       started: false,
@@ -114,10 +114,25 @@ export default {
       fileName: "",
       source: null,
       root: root,
-      dirs: [root, {path: settings.index.path, name: "/" + Util.truncate(settings.index.path, 100, "…")}],
+      dirs: [root],
     }
   },
   methods: {
+    load() {
+      this.$config.wait().then(() => {
+        this.settings.setValues(this.$config.settings());
+        this.dirs = [this.root];
+
+        if (this.settings.index.path !== this.root.path) {
+          this.dirs.push({
+            path: this.settings.index.path,
+            name: "/" + Util.truncate(this.settings.index.path, 100, "…")
+          });
+        }
+
+        this.ready = true;
+      })
+    },
     onChange() {
       this.settings.save();
     },
@@ -250,6 +265,7 @@ export default {
   },
   created() {
     this.subscriptionId = Event.subscribe('index', this.handleEvent);
+    this.load();
   },
   destroyed() {
     Event.unsubscribe(this.subscriptionId);
diff --git a/frontend/src/pages/settings/general.vue b/frontend/src/pages/settings/general.vue
index 70102c511..86bca06f2 100644
--- a/frontend/src/pages/settings/general.vue
+++ b/frontend/src/pages/settings/general.vue
@@ -289,7 +289,7 @@ export default {
       config: this.$config.values,
       settings: new Settings(this.$config.settings()),
       options: options,
-      busy: false,
+      busy: this.$config.ready(),
       subscriptions: [],
     };
   },
@@ -304,7 +304,10 @@ export default {
   },
   methods: {
     load() {
-      this.settings.load();
+      this.$config.wait().then(() => {
+        this.settings.setValues(this.$config.settings());
+        this.busy = false;
+      })
     },
     onChange() {
       const reload = this.settings.changed("ui", "language");
diff --git a/frontend/src/pages/settings/library.vue b/frontend/src/pages/settings/library.vue
index ec933ad9f..21ae0cdd0 100644
--- a/frontend/src/pages/settings/library.vue
+++ b/frontend/src/pages/settings/library.vue
@@ -141,7 +141,7 @@ export default {
       config: this.$config.values,
       settings: new Settings(this.$config.settings()),
       options: options,
-      busy: false,
+      busy: this.$config.ready(),
       subscriptions: [],
     };
   },
@@ -156,7 +156,10 @@ export default {
   },
   methods: {
     load() {
-      this.settings.load();
+      this.$config.wait().then(() => {
+        this.settings.setValues(this.$config.settings());
+        this.busy = false;
+      })
     },
     onChange() {
       const reload = this.settings.changed("ui", "language");
diff --git a/internal/config/client.go b/internal/config/client.go
index 767cc2b5a..e138c9d31 100644
--- a/internal/config/client.go
+++ b/internal/config/client.go
@@ -12,6 +12,7 @@ import (
 
 // ClientConfig represents HTTP client / Web UI config options.
 type ClientConfig struct {
+	Mode            string              `json:"mode"`
 	Name            string              `json:"name"`
 	Version         string              `json:"version"`
 	Copyright       string              `json:"copyright"`
@@ -151,6 +152,7 @@ func (c *Config) PublicConfig() ClientConfig {
 			TensorFlow: true,
 		},
 		Flags:           strings.Join(c.Flags(), " "),
+		Mode:            "public",
 		Name:            c.Name(),
 		SiteUrl:         c.SiteUrl(),
 		SitePreview:     c.SitePreview(),
@@ -199,6 +201,7 @@ func (c *Config) GuestConfig() ClientConfig {
 			TensorFlow: true,
 		},
 		Flags:           "readonly public shared",
+		Mode:            "guest",
 		Name:            c.Name(),
 		SiteUrl:         c.SiteUrl(),
 		SitePreview:     c.SitePreview(),
@@ -241,6 +244,7 @@ func (c *Config) UserConfig() ClientConfig {
 			TensorFlow: c.DisableTensorFlow(),
 		},
 		Flags:           strings.Join(c.Flags(), " "),
+		Mode:            "user",
 		Name:            c.Name(),
 		SiteUrl:         c.SiteUrl(),
 		SitePreview:     c.SitePreview(),