albums: allow leaving shares

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

CHANGELOG.md

@@ -6,6 +6,7 @@ All notable changes to this project will be documented in this file.
 
 - **Feature**: Support showing full file path in sidebar ([#173](https://github.com/pulsejet/memories/issues/173))
 - **Feature**: View file in folder on clicking name in sidebar
+- **Feature**: User can leave albums that are shared with them
 - **Fix**: Support for transcoding MKV files.
 
 ## [v5.4.1] - 2023-08-20

src/components/modal/AlbumDeleteModal.vue

@@ -1,11 +1,15 @@
 <template>
   <Modal @close="close" v-if="show">
     <template #title>
-      {{ t('memories', 'Remove Album') }}
+      {{ owned ? t('memories', 'Remove Album') : t('memories', 'Leave Album') }}
     </template>
 
     <span>
-      {{ t('memories', 'Are you sure you want to permanently remove album "{name}"?', { name }) }}
+      {{
+        owned
+          ? t('memories', 'Are you sure you want to permanently remove album "{name}"?', { name })
+          : t('memories', 'Are you sure you want to leave the shared album "{name}"?', { name })
+      }}
     </span>
 
     <template #buttons>
@@ -22,8 +26,10 @@ import { defineComponent } from 'vue';
 import NcButton from '@nextcloud/vue/dist/Components/NcButton';
 const NcTextField = () => import('@nextcloud/vue/dist/Components/NcTextField');
 import { showError } from '@nextcloud/dialogs';
-import { getCurrentUser } from '@nextcloud/auth';
 import Modal from './Modal.vue';
+
+import * as utils from '../../services/utils';
+import * as dav from '../../services/dav';
 import client from '../../services/dav/client';
 
 export default defineComponent({
@@ -50,6 +56,12 @@ export default defineComponent({
     this.refreshParams();
   },
 
+  computed: {
+    owned() {
+      return this.user === utils.uid();
+    },
+  },
+
   methods: {
     close() {
       this.show = false;
@@ -57,26 +69,17 @@ export default defineComponent({
     },
 
     open() {
-      const user = this.$route.params.user || '';
-      if (this.$route.params.user !== getCurrentUser()?.uid) {
-        showError(
-          this.t('memories', 'Only user "{user}" can delete this album', {
-            user,
-          })
-        );
-        return;
-      }
       this.show = true;
     },
 
     refreshParams() {
-      this.user = <string>this.$route.params.user || '';
-      this.name = <string>this.$route.params.name || '';
+      this.user = this.$route.params.user ?? String();
+      this.name = this.$route.params.name ?? String();
     },
 
     async save() {
       try {
-        await client.deleteFile(`/photos/${this.user}/albums/${this.name}`);
+        await client.deleteFile(dav.getAlbumPath(this.user, this.name));
         this.$router.push({ name: 'albums' });
         this.close();
       } catch (error) {

src/components/top-matter/AlbumTopMatter.vue

@@ -76,12 +76,12 @@
           <template #icon> <EditIcon :size="20" /> </template>
         </NcActionButton>
         <NcActionButton
-          :aria-label="t('memories', 'Delete album')"
+          :aria-label="t('memories', 'Remove album')"
           @click="$refs.deleteModal.open()"
           close-after-click
-          v-if="canEditAlbum"
+          v-if="!isAlbumList"
         >
-          {{ t('memories', 'Delete album') }}
+          {{ t('memories', 'Remove album') }}
           <template #icon> <DeleteIcon :size="20" /> </template>
         </NcActionButton>
       </NcActions>
@@ -114,7 +114,7 @@ import { downloadWithHandle } from '../../services/dav/download';
 import BackIcon from 'vue-material-design-icons/ArrowLeft.vue';
 import DownloadIcon from 'vue-material-design-icons/Download.vue';
 import EditIcon from 'vue-material-design-icons/Pencil.vue';
-import DeleteIcon from 'vue-material-design-icons/Close.vue';
+import DeleteIcon from 'vue-material-design-icons/TrashCanOutline.vue';
 import PlusIcon from 'vue-material-design-icons/Plus.vue';
 import ShareIcon from 'vue-material-design-icons/ShareVariant.vue';
 import SortIcon from 'vue-material-design-icons/SortVariant.vue';

src/services/utils/helpers.ts

@@ -2,8 +2,16 @@ import { IImageInfo, IPhoto } from '../../types';
 import { API } from '../API';
 import { constants } from './const';
 import { FilePickerType, getFilePickerBuilder } from '@nextcloud/dialogs';
+import { getCurrentUser } from '@nextcloud/auth';
 import * as nativex from '../../native';
 
+/**
+ * Get the current user UID
+ */
+export function uid() {
+  return String(getCurrentUser()?.uid || String()) || null;
+}
+
 /**
  * Check if width <= 768px
  */