Handle unshare in frontend

Signed-off-by: Julius Härtl <jus@bitgrid.net>

src/components/card/AttachmentList.vue

@@ -37,7 +37,7 @@
 			@change="handleUploadFile">
 		<ul class="attachment-list">
 			<li v-for="attachment in uploadQueue" :key="attachment.name" class="attachment">
-				<a class="fileicon" :style="mimetypeForAttachment('none')" />
+				<a class="fileicon" :style="mimetypeForAttachment()" />
 				<div class="details">
 					<a>
 						<div class="filename">
@@ -72,7 +72,7 @@
 					<ActionLink v-if="attachment.extendedData.fileid" icon="icon-folder" :href="internalLink(attachment)">
 						{{ t('deck', 'Show in files') }}
 					</ActionLink>
-					<ActionButton v-if="attachment.extendedData.fileid" icon="icon-delete">
+					<ActionButton v-if="attachment.extendedData.fileid" icon="icon-delete" @click="unshareAttachment(attachment)">
 						{{ t('deck', 'Unshare file') }}
 					</ActionButton>
 
@@ -143,10 +143,13 @@ export default {
 	},
 	computed: {
 		attachments() {
-			return [...this.$store.getters.attachmentsByCard(this.cardId)].sort((a, b) => b.id - a.id)
+			return [...this.$store.getters.attachmentsByCard(this.cardId)].filter(attachment => attachment.deletedAt >= 0).sort((a, b) => b.id - a.id)
 		},
 		mimetypeForAttachment() {
 			return (attachment) => {
+				if (!attachment) {
+					return {}
+				}
 				const url = attachment.extendedData.hasPreview ? this.attachmentPreview(attachment) : OC.MimeType.getIconUrl(attachment.extendedData.mimetype)
 				const styles = {
 					'background-image': `url("${url}")`,
@@ -217,6 +220,9 @@ export default {
 					})
 				})
 		},
+		unshareAttachment(attachment) {
+			this.$store.dispatch('unshareAttachment', attachment)
+		},
 		clickAddNewAttachmment() {
 			this.$refs.localAttachments.click()
 		},

src/mixins/attachmentUpload.js

@@ -78,7 +78,7 @@ export default {
 			bodyFormData.append('file', this.file)
 			this.$store.dispatch('updateAttachment', {
 				cardId: this.cardId,
-				attachmentId: this.overwriteAttachment.id,
+				attachment: this.overwriteAttachment,
 				formData: bodyFormData,
 			})
 

src/services/AttachmentApi.js

@@ -47,10 +47,10 @@ export class AttachmentApi {
 		return response.data
 	}
 
-	async updateAttachment({ cardId, attachmentId, formData }) {
+	async updateAttachment({ cardId, attachment, formData }) {
 		const response = await axios({
 		   method: 'POST',
-		   url: this.url(`/cards/${cardId}/attachment/${attachmentId}`),
+		   url: this.url(`/cards/${cardId}/attachment/${attachment.type}:${attachment.id}`),
 		   data: formData,
 	   })
 	   return response.data
@@ -59,14 +59,14 @@ export class AttachmentApi {
 	async deleteAttachment(attachment) {
 		await axios({
 			method: 'DELETE',
-			url: this.url(`/cards/${attachment.cardId}/attachment/${attachment.id}`),
+			url: this.url(`/cards/${attachment.cardId}/attachment/${attachment.type}:${attachment.id}`),
 		})
 	}
 
 	async restoreAttachment(attachment) {
 		const response = await axios({
 			method: 'GET',
-			url: this.url(`/cards/${attachment.cardId}/attachment/${attachment.id}/restore`),
+			url: this.url(`/cards/${attachment.cardId}/attachment/${attachment.type}:${attachment.id}/restore`),
 		})
 		return response.data
 	}
@@ -74,7 +74,7 @@ export class AttachmentApi {
 	async displayAttachment(attachment) {
 		const response = await axios({
 			method: 'GET',
-			url: this.url(`/cards/${attachment.cardId}/attachment/${attachment.id}`),
+			url: this.url(`/cards/${attachment.cardId}/attachment/${attachment.type}:${attachment.id}`),
 		})
 		return response.data
 	}

src/store/attachment.js

@@ -52,21 +52,28 @@ export default {
 		},
 
 		updateAttachment(state, { cardId, attachment }) {
-			const existingIndex = state.attachments[attachment.cardId].findIndex(a => a.id === attachment.id)
+			const existingIndex = state.attachments[attachment.cardId].findIndex(a => a.id === attachment.id && a.type === attachment.type)
 			if (existingIndex !== -1) {
 				Vue.set(state.attachments[cardId], existingIndex, attachment)
 			}
 		},
 
 		deleteAttachment(state, deletedAttachment) {
-			const existingIndex = state.attachments[deletedAttachment.cardId].findIndex(a => a.id === deletedAttachment.id)
+			const existingIndex = state.attachments[deletedAttachment.cardId].findIndex(a => a.id === deletedAttachment.id && a.type === deletedAttachment.type)
+			if (existingIndex !== -1) {
+				state.attachments[deletedAttachment.cardId][existingIndex].deletedAt = Date.now() / 1000 | 0
+			}
+		},
+
+		unshareAttachment(state, deletedAttachment) {
+			const existingIndex = state.attachments[deletedAttachment.cardId].findIndex(a => a.id === deletedAttachment.id && a.type === deletedAttachment.type)
 			if (existingIndex !== -1) {
 				state.attachments[deletedAttachment.cardId][existingIndex].deletedAt = -1
 			}
 		},
 
 		restoreAttachment(state, restoredAttachment) {
-			const existingIndex = state.attachments[restoredAttachment.cardId].findIndex(a => a.id === restoredAttachment.id)
+			const existingIndex = state.attachments[restoredAttachment.cardId].findIndex(a => a.id === restoredAttachment.id && a.type === restoredAttachment.type)
 			if (existingIndex !== -1) {
 				state.attachments[restoredAttachment.cardId][existingIndex].deletedAt = 0
 			}
@@ -85,9 +92,9 @@ export default {
 			commit('cardIncreaseAttachmentCount', cardId)
 		},
 
-		async updateAttachment({ commit }, { cardId, attachmentId, formData }) {
+		async updateAttachment({ commit }, { cardId, attachment, formData }) {
-			const attachment = await apiClient.updateAttachment({ cardId, attachmentId, formData })
+			const result = await apiClient.updateAttachment({ cardId, attachment, formData })
-			commit('updateAttachment', { cardId, attachment })
+			commit('updateAttachment', { cardId, attachment: result })
 		},
 
 		async deleteAttachment({ commit }, attachment) {
@@ -96,6 +103,12 @@ export default {
 			commit('cardDecreaseAttachmentCount', attachment.cardId)
 		},
 
+		async unshareAttachment({ commit }, attachment) {
+			await apiClient.deleteAttachment(attachment)
+			commit('unshareAttachment', attachment)
+			commit('cardDecreaseAttachmentCount', attachment.cardId)
+		},
+
 		async restoreAttachment({ commit }, attachment) {
 			const restoredAttachment = await apiClient.restoreAttachment(attachment)
 			commit('restoreAttachment', restoredAttachment)