Frontend: Improve sharing UX

frontend/src/common/config.js

@@ -52,12 +52,14 @@ export default class Config {
             this.values = {};
             this.page = {
                 title: "PhotoPrism",
+                caption: "Browse Your Life",
             };
             return;
         }
 
         this.page = {
             title: values.siteTitle,
+            caption: values.siteCaption,
         };
 
         this.values = values;

frontend/src/component/navigation.vue

@@ -3,14 +3,9 @@
     <template v-if="$vuetify.breakpoint.smAndDown || !auth">
     <v-toolbar dark :dense="$vuetify.breakpoint.smAndDown" fixed flat color="navigation darken-1" class="nav-small"
                @click.stop="showNavigation()" scroll-toolbar-off-screen>
-      <!-- v-avatar
-          tile
-          :size="40"
-          class="clickable"
-          @click.stop="showNavigation()"
-      >
-        <img src="/static/img/logo-avatar.svg" alt="Logo">
-      </v-avatar -->
+
+      <v-toolbar-side-icon class="nav-show" v-if="auth"></v-toolbar-side-icon>
+
       <v-toolbar-title class="nav-title">{{ page.title }}</v-toolbar-title>
 
       <v-spacer></v-spacer>
@@ -20,7 +15,6 @@
         <v-icon>cloud_upload</v-icon>
       </v-btn>
 
-      <v-toolbar-side-icon class="nav-show" v-if="auth"></v-toolbar-side-icon>
     </v-toolbar>
     <v-toolbar dark :dense="$vuetify.breakpoint.smAndDown" flat color="navigation darken-1">
     </v-toolbar>

frontend/src/pages/albums.vue

@@ -556,6 +556,7 @@ export default {
       this.lastId = "";
     },
     onUpdate(ev, data) {
+      console.log("EV, DATA", ev, data)
       if (!this.listen) return;
 
       if (!data || !data.entities) {

frontend/src/routes.js

@@ -88,7 +88,7 @@ export default [
         name: "photos",
         path: "/photos",
         component: Photos,
-        meta: {title: c.siteCaption, auth: true},
+        meta: {title: c.name, auth: true},
         props: {staticFilter: {photo: "true"}},
     },
     {

frontend/src/share/albums.vue

@@ -1,7 +1,11 @@
 <template>
   <div class="p-page p-page-albums" v-infinite-scroll="loadMore" :infinite-scroll-disabled="scrollDisabled"
        :infinite-scroll-distance="10" :infinite-scroll-listen-for-event="'scrollRefresh'">
-
+    <v-toolbar flat color="secondary" :dense="$vuetify.breakpoint.smAndDown">
+      <v-toolbar-title>
+        {{ site.caption }}
+      </v-toolbar-title>
+    </v-toolbar>
     <v-container fluid class="pa-4" v-if="loading">
       <v-progress-linear color="secondary-dark" :indeterminate="true"></v-progress-linear>
     </v-container>
@@ -135,6 +139,7 @@ export default {
     }
 
     return {
+      site: this.$config.page,
       categories: categories,
       subscriptions: [],
       listen: false,

frontend/src/share/navigation.vue

@@ -1,6 +1,7 @@
 <template>
   <div id="p-navigation">
-    <v-toolbar dark fixed flat color="navigation darken-1" class="nav-small" :dense="$vuetify.breakpoint.smAndDown">
+    <v-toolbar dark fixed flat color="navigation darken-1" class="nav-small"
+               :dense="$vuetify.breakpoint.smAndDown" scroll-toolbar-off-screen>
       <v-toolbar-title>
         <button @click.stop.prevent="goHome">
           {{ page.title }}
@@ -11,14 +12,14 @@
           tile
           :size="28"
           class="clickable"
-          @click.stop.prevent="openDocs"
+          @click.stop.prevent="openSite"
       >
         <img src="/static/img/logo-white.svg" alt="Logo">
       </v-avatar>
     </v-toolbar>
-    <v-toolbar dark flat color="navigation darken-1">
+    <v-toolbar dark flat :dense="$vuetify.breakpoint.smAndDown" color="navigation darken-1">
     </v-toolbar>
-    <div id="photoprism-info"><a href="https://photoprism.org/" target="_blank">Shared with PhotoPrism®</a></div>
+    <div id="photoprism-info"><a href="https://photoprism.app/" target="_blank">Shared with PhotoPrism</a></div>
   </div>
 </template>
 
@@ -63,8 +64,8 @@ export default {
     feature(name) {
       return this.$config.values.settings.features[name];
     },
-    openDocs() {
-      window.open("https://docs.photoprism.org/", "_blank");
+    openSite() {
+      window.open("https://photoprism.app/", "_blank");
     },
     showNavigation() {
       this.drawer = true;

internal/api/link.go

@@ -52,7 +52,11 @@ func UpdateLink(c *gin.Context) {
 		return
 	}
 
-	event.Success("updated share link")
+	UpdateClientConfig()
+
+	event.SuccessMsg(i18n.MsgAlbumSaved)
+
+	PublishAlbumEvent(EntityUpdated, link.ShareUID, c)
 
 	c.JSON(http.StatusOK, link)
 }
@@ -73,7 +77,11 @@ func DeleteLink(c *gin.Context) {
 		return
 	}
 
-	event.Success("deleted share link")
+	UpdateClientConfig()
+
+	event.SuccessMsg(i18n.MsgAlbumSaved)
+
+	PublishAlbumEvent(EntityUpdated, link.ShareUID, c)
 
 	c.JSON(http.StatusOK, link)
 }
@@ -112,7 +120,11 @@ func CreateLink(c *gin.Context) {
 		return
 	}
 
-	event.Success("added share link")
+	UpdateClientConfig()
+
+	event.SuccessMsg(i18n.MsgAlbumSaved)
+
+	PublishAlbumEvent(EntityUpdated, link.ShareUID, c)
 
 	c.JSON(http.StatusOK, link)
 }