albums: more refactor for metadata

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

src/components/Metadata.vue

@@ -2,7 +2,7 @@
   <div class="outer" v-if="fileid">
     <div v-if="albums.length" class="albums">
       <div class="section-title">{{ t('memories', 'Albums') }}</div>
-      <AlbumsList :albums="albums" />
+      <AlbumsList :albums="albums" @click="openAlbum" />
     </div>
 
     <div class="section-title">{{ t('memories', 'Metadata') }}</div>
@@ -74,6 +74,7 @@ import TagIcon from 'vue-material-design-icons/Tag.vue';
 
 import * as utils from '../services/Utils';
 import { API } from '../services/API';
+import router from '../router';
 
 import type { IAlbum, IImageInfo, IPhoto } from '../types';
 
@@ -373,6 +374,16 @@ export default defineComponent({
       return (this.albums = list);
     },
 
+    openAlbum(album: IAlbum) {
+      router.push({
+        name: 'albums',
+        params: {
+          name: album.name,
+          user: album.user,
+        },
+      });
+    },
+
     handleFileUpdated({ fileid }: { fileid: number }) {
       if (fileid && this.fileid === fileid) {
         this.update(this.fileid);

src/components/Timeline.vue

@@ -275,7 +275,7 @@ export default defineComponent({
         }
 
         globalThis.mViewer.open(photo, this.list);
-      } else if (from?.hash?.startsWith('#v') && !to.hash?.startsWith('#v') && viewerIsOpen) {
+      } else if (!to.hash?.startsWith('#v') && viewerIsOpen) {
         // Close viewer
         globalThis.mViewer.close();
       }

src/components/modal/AlbumPicker.vue

@@ -1,6 +1,6 @@
 <template>
   <div v-if="!showAlbumCreationForm" class="album-picker">
-    <XLoadingIcon v-if="loadingAlbums" class="loading-icon" />
+    <XLoadingIcon v-if="loadingAlbums" class="loading-icon centered" />
 
     <ul class="albums-container">
       <AlbumsList ref="albumsList" :albums="albums" @click="toggleAlbumSelection">
@@ -126,6 +126,8 @@ export default defineComponent({
 
     async loadAlbums() {
       try {
+        this.loadingAlbums = true;
+
         // this only makes sense when we try to add single photo to albums
         const fileid = this.photos.length === 1 ? this.photos[0].fileid : -1;