albums: fix name for shares (fix #723)

Signed-off-by: Varun Patil <radialapps@gmail.com>

lib/ClustersBackend/AlbumsBackend.php

@@ -113,6 +113,13 @@ class AlbumsBackend extends Backend
             return true;
         });
 
+        // Add display names for users
+        $userManager = \OC::$server->get(\OCP\IUserManager::class);
+        array_walk($list, function (&$item) use ($userManager) {
+            $user = $userManager->get($item['user']);
+            $item['user_display'] = $user ? $user->getDisplayName() : null;
+        });
+
         // Convert $list to sequential array
         return array_values($list);
     }

lib/Db/AlbumsQuery.php

@@ -23,7 +23,16 @@ class AlbumsQuery
 
         // SELECT everything from albums
         $count = $query->func()->count($query->createFunction('DISTINCT m.fileid'), 'count');
-        $query->select('pa.*', $count)->from('photos_albums', 'pa');
+        $query->select(
+            'pa.album_id',
+            'pa.name',
+            'pa.user',
+            'pa.created',
+            'pa.created',
+            'pa.location',
+            'pa.last_added_photo',
+            $count
+        )->from('photos_albums', 'pa');
 
         if ($shared) {
             $ids = $this->getSelfCollaborators($uid);

src/components/frame/Cluster.vue

@@ -84,7 +84,7 @@ export default defineComponent({
 
     subtitle() {
       if (this.album && this.album.user !== getCurrentUser()?.uid) {
-        return `(${this.album.user})`;
+        return `(${this.album.user_display || this.album.user})`;
       }
 
       return '';

src/components/modal/AlbumPicker.vue

@@ -5,33 +5,31 @@
     <ul class="albums-container">
       <NcListItem
         v-for="album in albums"
-        :key="album.album_id"
         class="album"
-        :title="getAlbumName(album)"
+        :key="album.album_id"
+        :title="album.name"
         :aria-label="
-          t('photos', 'Add selection to album {albumName}', {
+          t('memories', 'Add selection to album {albumName}', {
-            albumName: getAlbumName(album),
+            albumName: album.name,
           })
         "
         @click="pickAlbum(album)"
       >
-        <template v-slot:icon="{}">
+        <template #icon>
           <XImg v-if="album.last_added_photo !== -1" class="album__image" :src="toCoverUrl(album.last_added_photo)" />
           <div v-else class="album__image album__image--placeholder">
             <ImageMultiple :size="32" />
           </div>
         </template>
 
-        <template v-slot:subtitle="{}">
+        <template #subtitle>
-          {{ n('photos', '%n item', '%n items', album.count) }}
+          {{ getSubtitle(album) }}
-          <!-- TODO: finish collaboration -->
-          <!--⸱ {{ n('photos', 'Share with %n user', 'Share with %n users', album.isShared) }}-->
         </template>
       </NcListItem>
     </ul>
 
     <NcButton
-      :aria-label="t('photos', 'Create a new album.')"
+      :aria-label="t('memories', 'Create a new album.')"
       class="new-album-button"
       type="tertiary"
       @click="showAlbumCreationForm = true"
@@ -39,14 +37,14 @@
       <template #icon>
         <Plus />
       </template>
-      {{ t('photos', 'Create new album') }}
+      {{ t('memories', 'Create new album') }}
     </NcButton>
   </div>
 
   <AlbumForm
     v-else
     :display-back-button="true"
-    :title="t('photos', 'New album')"
+    :title="t('memories', 'New album')"
     @back="showAlbumCreationForm = false"
     @done="albumCreatedHandler"
   />
@@ -61,12 +59,13 @@ import AlbumForm from './AlbumForm.vue';
 import Plus from 'vue-material-design-icons/Plus.vue';
 import ImageMultiple from 'vue-material-design-icons/ImageMultiple.vue';
 
+import axios from '@nextcloud/axios';
+
 import NcButton from '@nextcloud/vue/dist/Components/NcButton';
 const NcListItem = () => import('@nextcloud/vue/dist/Components/NcListItem');
 
 import { getPreviewUrl } from '../../services/utils/helpers';
 import { IAlbum, IPhoto } from '../../types';
-import axios from '@nextcloud/axios';
 import { API } from '../../services/API';
 
 export default defineComponent({
@@ -104,11 +103,18 @@ export default defineComponent({
       this.loadAlbums();
     },
 
-    getAlbumName(album: IAlbum) {
+    getSubtitle(album: IAlbum) {
-      if (album.user === getCurrentUser()?.uid) {
+      let text = this.n('memories', '%n item', '%n items', album.count);
-        return album.name;
+
+      if (album.user !== getCurrentUser()?.uid) {
+        text +=
+          ' / ' +
+          this.t('memories', 'shared by {owner}', {
+            owner: album.user_display || album.user,
+          });
       }
-      return `${album.name} (${album.user})`;
+
+      return text;
     },
 
     async loadAlbums() {

src/types.ts

@@ -132,6 +132,8 @@ export interface IAlbum extends ICluster {
   album_id: number;
   /** Owner of album */
   user: string;
+  /** Display name of album owner */
+  user_display?: string;
   /** Created timestamp */
   created: number;
   /** Location string */