From 0b2e981f85b673a42ceffe00b5fc2638d3d56713 Mon Sep 17 00:00:00 2001
From: Maksim Sukharev <antreesy.web@gmail.com>
Date: Fri, 20 Sep 2024 13:13:37 +0200
Subject: [PATCH 1/3] feat: add handling of archived conversations

Signed-off-by: Maksim Sukharev <antreesy.web@gmail.com>
---
 src/__mocks__/capabilities.ts                 |  2 ++
 .../ConversationSettingsDialog.vue            | 27 +++++++++++++++--
 .../ConversationsList/Conversation.vue        | 30 ++++++++++++++++++-
 src/services/conversationsService.js          | 20 +++++++++++++
 src/store/conversationsStore.js               | 20 ++++++++++++-
 5 files changed, 95 insertions(+), 4 deletions(-)

diff --git a/src/__mocks__/capabilities.ts b/src/__mocks__/capabilities.ts
index 4a57bd1482a..fd20965f8c3 100644
--- a/src/__mocks__/capabilities.ts
+++ b/src/__mocks__/capabilities.ts
@@ -84,6 +84,7 @@ export const mockedCapabilities: Capabilities = {
 			'chat-reference-id',
 			'mention-permissions',
 			'edit-messages-note-to-self',
+			'archived-conversations',
 		],
 		'features-local': [
 			'favorites',
@@ -95,6 +96,7 @@ export const mockedCapabilities: Capabilities = {
 			'avatar',
 			'remind-me-later',
 			'note-to-self',
+			'archived-conversations',
 		],
 		config: {
 			attachments: {
diff --git a/src/components/ConversationSettings/ConversationSettingsDialog.vue b/src/components/ConversationSettings/ConversationSettingsDialog.vue
index 07e1498d75a..ec0f6a2fb8e 100644
--- a/src/components/ConversationSettings/ConversationSettingsDialog.vue
+++ b/src/components/ConversationSettings/ConversationSettingsDialog.vue
@@ -84,6 +84,16 @@
 				id="dangerzone"
 				:name="t('spreed', 'Danger zone')">
 				<LockingSettings v-if="canFullModerate && !isNoteToSelf" :token="token" />
+				<template v-if="supportsArchive">
+					<h4 class="app-settings-section__subtitle">
+						{{ t('spreed', 'Archive conversation') }}
+					</h4>
+					<NcCheckboxRadioSwitch type="switch"
+						:checked="isArchived"
+						@update:checked="toggleArchiveConversation">
+						{{ t('spreed', 'Archive conversation') }}
+					</NcCheckboxRadioSwitch>
+				</template>
 				<DangerZone :conversation="conversation"
 					:can-leave-conversation="canLeaveConversation"
 					:can-delete-conversation="canDeleteConversation" />
@@ -122,6 +132,8 @@ import { CALL, CONFIG, PARTICIPANT, CONVERSATION } from '../../constants.js'
 import { getTalkConfig, hasTalkFeature } from '../../services/CapabilitiesManager.ts'
 import { useSettingsStore } from '../../stores/settings.js'
 
+const supportsArchive = hasTalkFeature('local', 'archived-conversations')
+
 export default {
 	name: 'ConversationSettingsDialog',
 
@@ -149,7 +161,10 @@ export default {
 
 	setup() {
 		const settingsStore = useSettingsStore()
-		return { settingsStore }
+		return {
+			supportsArchive,
+			settingsStore,
+		}
 	},
 
 	data() {
@@ -201,6 +216,10 @@ export default {
 			return this.$store.getters.conversation(this.token) || this.$store.getters.dummyConversation
 		},
 
+		isArchived() {
+			return this.conversation.isArchived
+		},
+
 		participantType() {
 			return this.conversation.participantType
 		},
@@ -273,7 +292,11 @@ export default {
 
 		setShowMediaSettings(newValue) {
 			this.settingsStore.setShowMediaSettings(this.token, newValue)
-		}
+		},
+
+		async toggleArchiveConversation() {
+			await this.$store.dispatch('toggleArchive', this.conversation)
+		},
 	},
 }
 </script>
diff --git a/src/components/LeftSidebar/ConversationsList/Conversation.vue b/src/components/LeftSidebar/ConversationsList/Conversation.vue
index b87ab7fac08..cf6648684bb 100644
--- a/src/components/LeftSidebar/ConversationsList/Conversation.vue
+++ b/src/components/LeftSidebar/ConversationsList/Conversation.vue
@@ -57,6 +57,17 @@
 				{{ t('spreed', 'Conversation settings') }}
 			</NcActionButton>
 
+			<NcActionButton v-if="supportsArchive"
+				key="toggle-archive"
+				close-after-click
+				@click="toggleArchiveConversation">
+				<template #icon>
+					<IconArchive v-if="!item.isArchived" :size="16" />
+					<IconArchiveOff v-else :size="16" />
+				</template>
+				{{ labelArchive }}
+			</NcActionButton>
+
 			<NcActionButton v-if="item.canLeaveConversation"
 				key="leave-conversation"
 				close-after-click
@@ -118,6 +129,8 @@
 import { toRefs } from 'vue'
 import { isNavigationFailure, NavigationFailureType } from 'vue-router'
 
+import IconArchive from 'vue-material-design-icons/Archive.vue'
+import IconArchiveOff from 'vue-material-design-icons/ArchiveOff.vue'
 import IconArrowRight from 'vue-material-design-icons/ArrowRight.vue'
 import IconCog from 'vue-material-design-icons/Cog.vue'
 import IconContentCopy from 'vue-material-design-icons/ContentCopy.vue'
@@ -140,8 +153,11 @@ import ConversationIcon from './../../ConversationIcon.vue'
 
 import { useConversationInfo } from '../../../composables/useConversationInfo.js'
 import { PARTICIPANT } from '../../../constants.js'
+import { hasTalkFeature } from '../../../services/CapabilitiesManager.ts'
 import { copyConversationLinkToClipboard } from '../../../utils/handleUrl.ts'
 
+const supportsArchive = hasTalkFeature('local', 'archived-conversations')
+
 export default {
 	name: 'Conversation',
 
@@ -151,6 +167,8 @@ export default {
 		NcActionButton,
 		NcDialog,
 		NcListItem,
+		IconArchive,
+		IconArchiveOff,
 		IconArrowRight,
 		IconCog,
 		IconContentCopy,
@@ -159,7 +177,6 @@ export default {
 		IconEyeOff,
 		IconEye,
 		IconStar,
-
 	},
 
 	props: {
@@ -196,6 +213,7 @@ export default {
 		const { counterType, conversationInformation } = useConversationInfo({ item, isSearchResult })
 
 		return {
+			supportsArchive,
 			counterType,
 			conversationInformation,
 		}
@@ -220,6 +238,12 @@ export default {
 			return this.item.isFavorite ? t('spreed', 'Remove from favorites') : t('spreed', 'Add to favorites')
 		},
 
+		labelArchive() {
+			return this.item.isArchived
+				? t('spreed', 'Unarchive conversation')
+				: t('spreed', 'Archive conversation')
+		},
+
 		dialogMessage() {
 			return t('spreed', 'Do you really want to delete "{displayName}"?', this.item, undefined, {
 				escape: false,
@@ -298,6 +322,10 @@ export default {
 			this.$store.dispatch('toggleFavorite', this.item)
 		},
 
+		async toggleArchiveConversation() {
+			this.$store.dispatch('toggleArchive', this.item)
+		},
+
 		/**
 		 * Set the notification level for the conversation
 		 *
diff --git a/src/services/conversationsService.js b/src/services/conversationsService.js
index 6ec0fb5c004..deab17e3927 100644
--- a/src/services/conversationsService.js
+++ b/src/services/conversationsService.js
@@ -219,6 +219,24 @@ const removeFromFavorites = async function(token) {
 	return axios.delete(generateOcsUrl('apps/spreed/api/v4/room/{token}/favorite', { token }))
 }
 
+/**
+ * Add a conversation to the archive
+ *
+ * @param {string} token The token of the conversation to be archived
+ */
+const archiveConversation = async function(token) {
+	return axios.post(generateOcsUrl('apps/spreed/api/v4/room/{token}/archive', { token }))
+}
+
+/**
+ * Restore a conversation from the archive
+ *
+ * @param {string} token The token of the conversation to be removed from archive
+ */
+const unarchiveConversation = async function(token) {
+	return axios.delete(generateOcsUrl('apps/spreed/api/v4/room/{token}/archive', { token }))
+}
+
 /**
  * Set notification level
  *
@@ -380,6 +398,8 @@ export {
 	deleteConversation,
 	addToFavorites,
 	removeFromFavorites,
+	archiveConversation,
+	unarchiveConversation,
 	setNotificationLevel,
 	setNotificationCalls,
 	makeConversationPublic,
diff --git a/src/store/conversationsStore.js b/src/store/conversationsStore.js
index bc2a61e9ca4..42fdf9eefd7 100644
--- a/src/store/conversationsStore.js
+++ b/src/store/conversationsStore.js
@@ -33,6 +33,8 @@ import {
 	createOneToOneConversation,
 	addToFavorites,
 	removeFromFavorites,
+	archiveConversation,
+	unarchiveConversation,
 	fetchConversations,
 	fetchConversation,
 	setConversationName,
@@ -67,6 +69,7 @@ const DUMMY_CONVERSATION = {
 	token: '',
 	displayName: '',
 	isFavorite: false,
+	isArchived: false,
 	hasPassword: false,
 	breakoutRoomMode: CONVERSATION.BREAKOUT_ROOM_MODE.NOT_CONFIGURED,
 	breakoutRoomStatus: CONVERSATION.BREAKOUT_ROOM_STATUS.STOPPED,
@@ -525,6 +528,21 @@ const actions = {
 		}
 	},
 
+	async toggleArchive(context, { token, isArchived }) {
+		if (!context.getters.conversations[token]) {
+			return
+		}
+
+		try {
+			const response = isArchived
+				? await unarchiveConversation(token)
+				: await archiveConversation(token)
+			context.commit('addConversation', response.data.ocs.data)
+		} catch (error) {
+			console.error('Error while changing the conversation archived status: ', error)
+		}
+	},
+
 	async toggleLobby({ commit, getters }, { token, enableLobby }) {
 		if (!getters.conversations[token]) {
 			return
@@ -904,7 +922,7 @@ const actions = {
 	async setNotificationLevel({ commit }, { token, notificationLevel }) {
 		try {
 			await setNotificationLevel(token, notificationLevel)
-			commit('setNotificationLevel', { token, notificationLevel })
+			commit('setNotificationLevel', { token, notificationLevel: +notificationLevel })
 		} catch (error) {
 			console.error('Error while setting the notification level: ', error)
 		}

From 23da937109090e2ba6253a97cb60a69b50fa3b0b Mon Sep 17 00:00:00 2001
From: Maksim Sukharev <antreesy.web@gmail.com>
Date: Tue, 24 Sep 2024 13:08:53 +0200
Subject: [PATCH 2/3] feat: handle leave conversation via dialog

Signed-off-by: Maksim Sukharev <antreesy.web@gmail.com>
---
 .../ConversationSettings/DangerZone.vue       |  75 ++++++-
 .../ConversationsList/Conversation.spec.js    | 200 +++++++++---------
 .../ConversationsList/Conversation.vue        |  61 ++++--
 3 files changed, 215 insertions(+), 121 deletions(-)

diff --git a/src/components/ConversationSettings/DangerZone.vue b/src/components/ConversationSettings/DangerZone.vue
index e86d40163ec..c366c1df976 100644
--- a/src/components/ConversationSettings/DangerZone.vue
+++ b/src/components/ConversationSettings/DangerZone.vue
@@ -11,18 +11,40 @@
 				<h4 class="app-settings-section__subtitle">
 					{{ t('spreed', 'Leave conversation') }}
 				</h4>
-				<p class="danger-zone__hint">
+				<p class="app-settings-section__hint">
 					{{ t('spreed', 'Once a conversation is left, to rejoin a closed conversation, an invite is needed. An open conversation can be rejoined at any time.') }}
 				</p>
-				<NcButton type="warning" @click="leaveConversation">
+				<NcButton type="warning" @click="toggleShowLeaveConversationDialog">
 					{{ t('spreed', 'Leave conversation') }}
 				</NcButton>
+				<NcDialog class="danger-zone__dialog"
+					:open.sync="isLeaveConversationDialogOpen"
+					:name="t('spreed','Leave conversation')"
+					container=".danger-zone">
+					<template #default>
+						<p>{{ leaveConversationDialogMessage }}</p>
+						<p v-if="supportsArchive && !conversation.isArchived">
+							{{ t('spreed', 'You can archive this conversation instead.') }}
+						</p>
+					</template>
+					<template #actions>
+						<NcButton type="tertiary" @click="toggleShowLeaveConversationDialog">
+							{{ t('spreed', 'No') }}
+						</NcButton>
+						<NcButton v-if="supportsArchive && !conversation.isArchived" type="secondary" @click="toggleArchiveConversation">
+							{{ t('spreed', 'Archive conversation') }}
+						</NcButton>
+						<NcButton type="warning" @click="leaveConversation">
+							{{ t('spreed', 'Yes') }}
+						</NcButton>
+					</template>
+				</NcDialog>
 			</div>
 			<div v-if="canDeleteConversation" class="app-settings-subsection">
 				<h4 class="app-settings-section__subtitle">
 					{{ t('spreed', 'Delete conversation') }}
 				</h4>
-				<p class="danger-zone__hint">
+				<p class="app-settings-section__hint">
 					{{ t('spreed', 'Permanently delete this conversation.') }}
 				</p>
 				<NcButton type="error"
@@ -48,7 +70,7 @@
 				<h4 class="app-settings-section__subtitle">
 					{{ t('spreed', 'Delete chat messages') }}
 				</h4>
-				<p class="danger-zone__hint">
+				<p class="app-settings-section__hint">
 					{{ t('spreed', 'Permanently delete all the messages in this conversation.') }}
 				</p>
 				<NcButton type="error"
@@ -76,6 +98,8 @@
 </template>
 
 <script>
+import { ref } from 'vue'
+
 import { showError } from '@nextcloud/dialogs'
 import { emit } from '@nextcloud/event-bus'
 import { t } from '@nextcloud/l10n'
@@ -84,6 +108,10 @@ import NcButton from '@nextcloud/vue/dist/Components/NcButton.js'
 import NcDialog from '@nextcloud/vue/dist/Components/NcDialog.js'
 import NcNoteCard from '@nextcloud/vue/dist/Components/NcNoteCard.js'
 
+import { hasTalkFeature } from '../../services/CapabilitiesManager.ts'
+
+const supportsArchive = hasTalkFeature('local', 'archived-conversations')
+
 export default {
 	name: 'DangerZone',
 	components: {
@@ -109,10 +137,16 @@ export default {
 		},
 	},
 
-	data() {
+	setup() {
+		const isLeaveConversationDialogOpen = ref(false)
+		const isDeleteConversationDialogOpen = ref(false)
+		const isDeleteChatDialogOpen = ref(false)
+
 		return {
-			isDeleteConversationDialogOpen: false,
-			isDeleteChatDialogOpen: false,
+			supportsArchive,
+			isLeaveConversationDialogOpen,
+			isDeleteConversationDialogOpen,
+			isDeleteChatDialogOpen,
 		}
 	},
 
@@ -125,6 +159,13 @@ export default {
 			return this.conversation.token
 		},
 
+		leaveConversationDialogMessage() {
+			return t('spreed', 'Do you really want to leave "{displayName}"?', this.conversation, undefined, {
+				escape: false,
+				sanitize: false,
+			})
+		},
+
 		deleteConversationDialogMessage() {
 			return t('spreed', 'Do you really want to delete "{displayName}"?', this.conversation, undefined, {
 				escape: false,
@@ -146,10 +187,23 @@ export default {
 		hideConversationSettings() {
 			emit('hide-conversation-settings')
 		},
+
+		/**
+		 * Deletes the current user from the conversation.
+		 */
+		async toggleArchiveConversation() {
+			this.isLeaveConversationDialogOpen = false
+
+			await this.$store.dispatch('toggleArchive', this.conversation)
+			this.hideConversationSettings()
+		},
+
 		/**
 		 * Deletes the current user from the conversation.
 		 */
 		async leaveConversation() {
+			this.isLeaveConversationDialogOpen = false
+
 			try {
 				await this.$store.dispatch('removeCurrentUserFromConversation', { token: this.token })
 				this.hideConversationSettings()
@@ -198,6 +252,10 @@ export default {
 			}
 		},
 
+		toggleShowLeaveConversationDialog() {
+			this.isLeaveConversationDialogOpen = !this.isLeaveConversationDialogOpen
+		},
+
 		toggleShowDeleteConversationDialog() {
 			this.isDeleteConversationDialogOpen = !this.isDeleteConversationDialogOpen
 		},
@@ -215,9 +273,6 @@ h4 {
 }
 
 .danger-zone {
-	&__hint {
-		color: var(--color-text-maxcontrast);
-	}
 	&__dialog {
 		:deep(.modal-container) {
 			padding-block: 4px 8px;
diff --git a/src/components/LeftSidebar/ConversationsList/Conversation.spec.js b/src/components/LeftSidebar/ConversationsList/Conversation.spec.js
index 293ccff4d5c..4ba6b58c529 100644
--- a/src/components/LeftSidebar/ConversationsList/Conversation.spec.js
+++ b/src/components/LeftSidebar/ConversationsList/Conversation.spec.js
@@ -12,7 +12,6 @@ import { showSuccess, showError } from '@nextcloud/dialogs'
 
 import NcActionButton from '@nextcloud/vue/dist/Components/NcActionButton.js'
 import NcButton from '@nextcloud/vue/dist/Components/NcButton.js'
-import NcDialog from '@nextcloud/vue/dist/Components/NcDialog.js'
 import NcListItem from '@nextcloud/vue/dist/Components/NcListItem.js'
 
 import Conversation from './Conversation.vue'
@@ -21,6 +20,7 @@ import router from '../../../__mocks__/router.js'
 import { CONVERSATION, PARTICIPANT, ATTENDEE } from '../../../constants.js'
 import { leaveConversation } from '../../../services/participantsService.js'
 import storeConfig from '../../../store/storeConfig.js'
+import { findNcButton } from '../../../test-helpers.js'
 import { getMessageIcon } from '../../../utils/getMessageIcon.ts'
 
 jest.mock('@nextcloud/dialogs', () => ({
@@ -66,6 +66,7 @@ describe('Conversation.vue', () => {
 			type: CONVERSATION.TYPE.GROUP,
 			displayName: 'conversation one',
 			isFavorite: false,
+			isArchived: false,
 			lastMessage: {
 				actorId: 'user-id-alice',
 				actorDisplayName: 'Alice Wonderland',
@@ -357,17 +358,63 @@ describe('Conversation.vue', () => {
 			return findNcActionButton(el, actionName)
 		}
 
+		/**
+		 * @param {string} actionName The name of the action to shallow
+		 * @param {number} buttonsAmount The amount of buttons to be shown in dialog
+		 */
+		async function shallowMountAndOpenDialog(actionName, buttonsAmount) {
+			const wrapper = shallowMount(Conversation, {
+				localVue,
+				store,
+				mocks: {
+					$router,
+				},
+				stubs: {
+					NcActionButton,
+					NcButton,
+				},
+				propsData: {
+					isSearchResult: false,
+					item,
+				},
+			})
+			const el = wrapper.findComponent({ name: 'NcListItem' })
+
+			const action = findNcActionButton(el, actionName)
+			expect(action.exists()).toBeTruthy()
+
+			// Act 1 : click on the button from the menu
+			await action.find('button').trigger('click')
+
+			// Assert 1
+			const dialog = wrapper.findComponent({ name: 'NcDialog' })
+			expect(dialog.exists).toBeTruthy()
+			const buttons = dialog.findAllComponents({ name: 'NcButton' })
+			expect(buttons.exists()).toBeTruthy()
+			expect(buttons).toHaveLength(buttonsAmount)
+
+			return dialog
+		}
+
 		describe('leaving conversation', () => {
-			test('leaves conversation', async () => {
-				const actionHandler = jest.fn()
-				testStoreConfig.modules.participantsStore.actions.removeCurrentUserFromConversation = actionHandler
+			let actionHandler
+
+			beforeEach(() => {
 				leaveConversation.mockResolvedValue()
-				const action = shallowMountAndGetAction('Leave conversation')
-				expect(action.exists()).toBe(true)
+				actionHandler = jest.fn().mockResolvedValueOnce()
+				testStoreConfig.modules.participantsStore.actions.removeCurrentUserFromConversation = actionHandler
+				testStoreConfig.modules.conversationsStore.actions.toggleArchive = actionHandler
+				store = new Vuex.Store(testStoreConfig)
+			})
 
-				await action.find('button').trigger('click')
-				await flushPromises()
+			test('leaves conversation when confirmed', async () => {
+				// Arrange
+				const dialog = await shallowMountAndOpenDialog('Leave conversation', 3)
+
+				// Act: click on the 'confirm' button
+				await findNcButton(dialog, 'Yes').find('button').trigger('click')
 
+				// Assert
 				expect(actionHandler).toHaveBeenCalledWith(expect.anything(), { token: TOKEN })
 			})
 
@@ -379,68 +426,66 @@ describe('Conversation.vue', () => {
 			})
 
 			test('errors with notification when a new moderator is required before leaving', async () => {
-				const actionHandler = jest.fn().mockRejectedValueOnce({
-					response: {
-						status: 400,
-					},
-				})
+				// Arrange
+				actionHandler = jest.fn().mockRejectedValueOnce({ response: { status: 400 } })
 				testStoreConfig.modules.participantsStore.actions.removeCurrentUserFromConversation = actionHandler
+				store = new Vuex.Store(testStoreConfig)
 
-				const action = shallowMountAndGetAction('Leave conversation')
-				expect(action.exists()).toBe(true)
+				const dialog = await shallowMountAndOpenDialog('Leave conversation', 3)
 
-				action.find('button').trigger('click')
+				// Act: click on the 'confirm' button
+				await findNcButton(dialog, 'Yes').find('button').trigger('click')
 				await flushPromises()
 
+				// Assert
 				expect(actionHandler).toHaveBeenCalledWith(expect.anything(), { token: TOKEN })
 				expect(showError).toHaveBeenCalledWith(expect.stringContaining('promote'))
 			})
+
+			test('does not leave conversation when not confirmed', async () => {
+				// Arrange
+				const dialog = await shallowMountAndOpenDialog('Leave conversation', 3)
+
+				// Act: click on the 'decline' button
+				await findNcButton(dialog, 'No').find('button').trigger('click')
+
+				// Assert
+				expect(actionHandler).not.toHaveBeenCalled()
+			})
+
+			test('archives conversation when selected', async () => {
+				// Arrange
+				const dialog = await shallowMountAndOpenDialog('Leave conversation', 3)
+
+				// Act: click on the 'archive' button
+				await findNcButton(dialog, 'Archive conversation').find('button').trigger('click')
+
+				// Assert
+				expect(actionHandler).toHaveBeenCalledWith(expect.anything(), item)
+			})
 		})
 
 		describe('deleting conversation', () => {
-			test('deletes conversation when confirmed', async () => {
-				// Arrange
-				const actionHandler = jest.fn().mockResolvedValueOnce()
-				const updateTokenAction = jest.fn()
+			let actionHandler
+			let updateTokenAction
+
+			beforeEach(() => {
+				actionHandler = jest.fn().mockResolvedValueOnce()
+				updateTokenAction = jest.fn()
 				testStoreConfig.modules.conversationsStore.actions.deleteConversationFromServer = actionHandler
 				testStoreConfig.modules.tokenStore.getters.getToken = jest.fn().mockReturnValue(() => 'another-token')
 				testStoreConfig.modules.tokenStore.actions.updateToken = updateTokenAction
+				store = new Vuex.Store(testStoreConfig)
+			})
+
+			test('deletes conversation when confirmed', async () => {
+				// Arrange
+				const dialog = await shallowMountAndOpenDialog('Delete conversation', 2)
 
-				const wrapper = shallowMount(Conversation, {
-					localVue,
-					store: new Vuex.Store(testStoreConfig),
-					mocks: {
-						$router,
-					},
-					stubs: {
-						NcActionButton,
-						NcDialog,
-						NcButton,
-					},
-					propsData: {
-						isSearchResult: false,
-						item,
-					},
-				})
-				const el = wrapper.findComponent({ name: 'NcListItem' })
-
-				const action = findNcActionButton(el, 'Delete conversation')
-				expect(action.exists()).toBe(true)
-
-				// Act 1 : click on the button from the menu
-				await action.find('button').trigger('click')
-
-				// Assert 1
-				const dialog = wrapper.findComponent({ name: 'NcDialog' })
-				expect(dialog.exists).toBeTruthy()
-				const buttons = dialog.findAllComponents({ name: 'NcButton' })
-				expect(buttons.exists()).toBeTruthy()
-				expect(buttons).toHaveLength(2)
-
-				// Act 2 : click on the confirm button
-				await buttons.at(1).find('button').trigger('click')
-
-				// Assert 2
+				// Act: click on the 'confirm' button
+				await findNcButton(dialog, 'Yes').find('button').trigger('click')
+
+				// Assert
 				expect(actionHandler).toHaveBeenCalledWith(expect.anything(), { token: TOKEN })
 				expect($router.push).not.toHaveBeenCalled()
 				expect(updateTokenAction).not.toHaveBeenCalled()
@@ -448,47 +493,12 @@ describe('Conversation.vue', () => {
 
 			test('does not delete conversation when not confirmed', async () => {
 				// Arrange
-				const actionHandler = jest.fn().mockResolvedValueOnce()
-				const updateTokenAction = jest.fn()
-				testStoreConfig.modules.conversationsStore.actions.deleteConversationFromServer = actionHandler
-				testStoreConfig.modules.tokenStore.getters.getToken = jest.fn().mockReturnValue(() => 'another-token')
-				testStoreConfig.modules.tokenStore.actions.updateToken = updateTokenAction
+				const dialog = await shallowMountAndOpenDialog('Delete conversation', 2)
+
+				// Act: click on the 'decline' button
+				await findNcButton(dialog, 'No').find('button').trigger('click')
 
-				const wrapper = shallowMount(Conversation, {
-					localVue,
-					store: new Vuex.Store(testStoreConfig),
-					mocks: {
-						$router,
-					},
-					stubs: {
-						NcActionButton,
-						NcDialog,
-						NcButton,
-					},
-					propsData: {
-						isSearchResult: false,
-						item,
-					},
-				})
-				const el = wrapper.findComponent({ name: 'NcListItem' })
-
-				const action = findNcActionButton(el, 'Delete conversation')
-				expect(action.exists()).toBe(true)
-
-				// Act 1 : click on the button from the menu
-				await action.find('button').trigger('click')
-
-				// Assert 1
-				const dialog = wrapper.findComponent({ name: 'NcDialog' })
-				expect(dialog.exists).toBeTruthy()
-				const buttons = dialog.findAllComponents({ name: 'NcButton' })
-				expect(buttons.exists()).toBeTruthy()
-				expect(buttons).toHaveLength(2)
-
-				// Act 2 : click on the confirm button
-				await buttons.at(0).find('button').trigger('click')
-
-				// Assert 2
+				// Assert
 				expect(actionHandler).not.toHaveBeenCalled()
 				expect($router.push).not.toHaveBeenCalled()
 				expect(updateTokenAction).not.toHaveBeenCalled()
diff --git a/src/components/LeftSidebar/ConversationsList/Conversation.vue b/src/components/LeftSidebar/ConversationsList/Conversation.vue
index cf6648684bb..17579eedf2a 100644
--- a/src/components/LeftSidebar/ConversationsList/Conversation.vue
+++ b/src/components/LeftSidebar/ConversationsList/Conversation.vue
@@ -71,7 +71,7 @@
 			<NcActionButton v-if="item.canLeaveConversation"
 				key="leave-conversation"
 				close-after-click
-				@click="leaveConversation">
+				@click="isLeaveDialogOpen = true">
 				<template #icon>
 					<IconExitToApp :size="16" />
 				</template>
@@ -82,7 +82,7 @@
 				key="delete-conversation"
 				close-after-click
 				class="critical"
-				@click="isDialogOpen = true">
+				@click="isDeleteDialogOpen = true">
 				<template #icon>
 					<IconDelete :size="16" />
 				</template>
@@ -106,13 +106,35 @@
 			</NcActionButton>
 		</template>
 
-		<!-- confirmation required to delete conversation -->
-		<template v-if="isDialogOpen" #extra>
-			<NcDialog :open.sync="isDialogOpen"
+		<!-- confirmation required to leave / delete conversation -->
+		<template v-if="isLeaveDialogOpen || isDeleteDialogOpen" #extra>
+			<NcDialog v-if="isLeaveDialogOpen"
+				:open.sync="isLeaveDialogOpen"
+				:name="t('spreed', 'Leave conversation')">
+				<template #default>
+					<p>{{ dialogLeaveMessage }}</p>
+					<p v-if="supportsArchive && !item.isArchived">
+						{{ t('spreed', 'You can archive this conversation instead.') }}
+					</p>
+				</template>
+				<template #actions>
+					<NcButton type="tertiary" @click="isLeaveDialogOpen = false">
+						{{ t('spreed', 'No') }}
+					</NcButton>
+					<NcButton v-if="supportsArchive && !item.isArchived" type="secondary" @click="toggleArchiveConversation">
+						{{ t('spreed', 'Archive conversation') }}
+					</NcButton>
+					<NcButton type="warning" @click="leaveConversation">
+						{{ t('spreed', 'Yes') }}
+					</NcButton>
+				</template>
+			</NcDialog>
+			<NcDialog v-if="isDeleteDialogOpen"
+				:open.sync="isDeleteDialogOpen"
 				:name="t('spreed','Delete conversation')"
-				:message="dialogMessage">
+				:message="dialogDeleteMessage">
 				<template #actions>
-					<NcButton type="tertiary" @click="isDialogOpen = false">
+					<NcButton type="tertiary" @click="isDeleteDialogOpen = false">
 						{{ t('spreed', 'No') }}
 					</NcButton>
 					<NcButton type="error" @click="deleteConversation">
@@ -126,7 +148,7 @@
 
 <script>
 
-import { toRefs } from 'vue'
+import { toRefs, ref } from 'vue'
 import { isNavigationFailure, NavigationFailureType } from 'vue-router'
 
 import IconArchive from 'vue-material-design-icons/Archive.vue'
@@ -209,22 +231,20 @@ export default {
 	emits: ['click'],
 
 	setup(props) {
+		const isLeaveDialogOpen = ref(false)
+		const isDeleteDialogOpen = ref(false)
 		const { item, isSearchResult } = toRefs(props)
 		const { counterType, conversationInformation } = useConversationInfo({ item, isSearchResult })
 
 		return {
 			supportsArchive,
+			isLeaveDialogOpen,
+			isDeleteDialogOpen,
 			counterType,
 			conversationInformation,
 		}
 	},
 
-	data() {
-		return {
-			isDialogOpen: false,
-		}
-	},
-
 	computed: {
 		canFavorite() {
 			return this.item.participantType !== PARTICIPANT.TYPE.USER_SELF_JOINED
@@ -244,7 +264,14 @@ export default {
 				: t('spreed', 'Archive conversation')
 		},
 
-		dialogMessage() {
+		dialogLeaveMessage() {
+			return t('spreed', 'Do you really want to leave "{displayName}"?', this.item, undefined, {
+				escape: false,
+				sanitize: false,
+			})
+		},
+
+		dialogDeleteMessage() {
 			return t('spreed', 'Do you really want to delete "{displayName}"?', this.item, undefined, {
 				escape: false,
 				sanitize: false,
@@ -285,7 +312,7 @@ export default {
 		 */
 		async deleteConversation() {
 			try {
-				this.isDialogOpen = false
+				this.isDeleteDialogOpen = false
 				if (this.isActive) {
 					await this.$store.dispatch('leaveConversation', { token: this.item.token })
 					await this.$router.push({ name: 'root' })
@@ -303,6 +330,7 @@ export default {
 		 */
 		async leaveConversation() {
 			try {
+				this.isLeaveDialogOpen = false
 				if (this.isActive) {
 					await this.$store.dispatch('leaveConversation', { token: this.item.token })
 					await this.$router.push({ name: 'root' })
@@ -323,6 +351,7 @@ export default {
 		},
 
 		async toggleArchiveConversation() {
+			this.isLeaveDialogOpen = false
 			this.$store.dispatch('toggleArchive', this.item)
 		},
 

From 19286fdc815519c53c387a8332c192cd469dcc60 Mon Sep 17 00:00:00 2001
From: Maksim Sukharev <antreesy.web@gmail.com>
Date: Tue, 24 Sep 2024 14:09:27 +0200
Subject: [PATCH 3/3] feat: add filtering of archived conversations

- show ongoing calls in archived conversations, if 'notify about calls' is truthy

Signed-off-by: Maksim Sukharev <antreesy.web@gmail.com>
---
 src/components/LeftSidebar/LeftSidebar.vue | 71 ++++++++++++++++------
 src/store/conversationsStore.js            | 10 +++
 src/utils/conversation.js                  | 52 ++++++++++++++--
 3 files changed, 112 insertions(+), 21 deletions(-)

diff --git a/src/components/LeftSidebar/LeftSidebar.vue b/src/components/LeftSidebar/LeftSidebar.vue
index 1c5ad9840ef..9af25d5ab71 100644
--- a/src/components/LeftSidebar/LeftSidebar.vue
+++ b/src/components/LeftSidebar/LeftSidebar.vue
@@ -136,6 +136,7 @@
 					<template #icon>
 						<AtIcon v-if="isFiltered === 'mentions'" :size="64" />
 						<MessageBadge v-else-if="isFiltered === 'unread'" :size="64" />
+						<IconArchive v-else-if="showArchived" :size="64" />
 						<MessageOutline v-else :size="64" />
 					</template>
 					<template #action>
@@ -277,6 +278,27 @@
 
 		<template #footer>
 			<div class="left-sidebar__settings-button-container">
+				<template v-if="supportsArchive">
+					<NcButton v-if="showArchived"
+						type="tertiary"
+						wide
+						@click="showArchived = false">
+						<template #icon>
+							<IconArrowLeft :size="20" />
+						</template>
+						{{ t('spreed', 'Back to conversations') }}
+					</NcButton>
+					<NcButton v-else-if="archivedConversationsList.length"
+						type="tertiary"
+						wide
+						@click="showArchived = true">
+						<template #icon>
+							<IconArchive :size="20" />
+						</template>
+						{{ t('spreed', 'Archived conversations') }}
+					</NcButton>
+				</template>
+
 				<NcButton type="tertiary" wide @click="showSettings">
 					<template #icon>
 						<Cog :size="20" />
@@ -293,6 +315,8 @@ import debounce from 'debounce'
 import { ref } from 'vue'
 
 import AccountMultiplePlus from 'vue-material-design-icons/AccountMultiplePlus.vue'
+import IconArchive from 'vue-material-design-icons/Archive.vue'
+import IconArrowLeft from 'vue-material-design-icons/ArrowLeft.vue'
 import AtIcon from 'vue-material-design-icons/At.vue'
 import ChatPlus from 'vue-material-design-icons/ChatPlus.vue'
 import Cog from 'vue-material-design-icons/Cog.vue'
@@ -348,7 +372,7 @@ import { talkBroadcastChannel } from '../../services/talkBroadcastChannel.js'
 import { useFederationStore } from '../../stores/federation.ts'
 import { useTalkHashStore } from '../../stores/talkHash.js'
 import CancelableRequest from '../../utils/cancelableRequest.js'
-import { hasUnreadMentions, filterFunction } from '../../utils/conversation.js'
+import { hasUnreadMentions, hasCall, filterFunction } from '../../utils/conversation.js'
 import { requestTabLeadership } from '../../utils/requestTabLeadership.js'
 
 const isFederationEnabled = getTalkConfig('local', 'federation', 'enabled')
@@ -357,6 +381,7 @@ const canModerateSipDialOut = hasTalkFeature('local', 'sip-support-dialout')
 	&& getTalkConfig('local', 'call', 'sip-dialout-enabled')
 	&& getTalkConfig('local', 'call', 'can-enable-sip')
 const canNoteToSelf = hasTalkFeature('local', 'note-to-self')
+const supportsArchive = hasTalkFeature('local', 'archived-conversations')
 
 export default {
 	name: 'LeftSidebar',
@@ -388,6 +413,8 @@ export default {
 		MessageOutline,
 		FilterIcon,
 		FilterRemoveIcon,
+		IconArchive,
+		IconArrowLeft,
 		Phone,
 		Plus,
 		ChatPlus,
@@ -402,6 +429,8 @@ export default {
 		const searchBox = ref(null)
 		const scroller = ref(null)
 
+		const showArchived = ref(false)
+
 		const federationStore = useFederationStore()
 		const talkHashStore = useTalkHashStore()
 		const { initializeNavigation, resetNavigation } = useArrowNavigation(leftSidebar, searchBox)
@@ -419,6 +448,8 @@ export default {
 			isMobile,
 			canModerateSipDialOut,
 			canNoteToSelf,
+			supportsArchive,
+			showArchived,
 		}
 	},
 
@@ -491,6 +522,9 @@ export default {
 		},
 
 		emptyContentDescription() {
+			if (this.showArchived) {
+				return t('spreed', 'You have no archived conversations.')
+			}
 			switch (this.isFiltered) {
 			case 'mentions':
 				return t('spreed', 'You have no unread mentions.')
@@ -501,27 +535,27 @@ export default {
 			}
 		},
 
+		archivedConversationsList() {
+			return this.$store.getters.archivedConversationsList
+		},
+
 		filteredConversationsList() {
 			if (this.isFocused) {
 				return this.conversationsList
 			}
-			// applying filters
-			if (this.isFiltered) {
-				let validConversationsCount = 0
-				const filteredConversations = this.conversationsList.filter((conversation) => {
-					const conversationIsValid = filterFunction(this.isFiltered, conversation)
-					if (conversationIsValid) {
-						validConversationsCount++
-					}
-					return conversationIsValid
-						|| conversation.hasCall
-						|| conversation.token === this.token
-				})
-				// return empty if it only includes the current conversation without any flags
-				return validConversationsCount === 0 && !this.isNavigating ? [] : filteredConversations
-			}
 
-			return this.conversationsList
+			let validConversationsCount = 0
+			const filteredConversations = this.conversationsList.filter((conversation) => {
+				const conversationIsValid = filterFunction(this.isFiltered, this.showArchived, conversation)
+				if (conversationIsValid) {
+					validConversationsCount++
+				}
+				return conversationIsValid
+					|| hasCall(conversation)
+					|| conversation.token === this.token
+			})
+			// return empty if it only includes the current conversation without any flags
+			return validConversationsCount === 0 && !this.isNavigating ? [] : filteredConversations
 		},
 
 		isSearching() {
@@ -1076,6 +1110,9 @@ export default {
 }
 
 .left-sidebar__settings-button-container {
+	display: flex;
+	flex-direction: column;
+	gap: var(--default-grid-baseline);
 	padding: calc(2 * var(--default-grid-baseline));
 }
 
diff --git a/src/store/conversationsStore.js b/src/store/conversationsStore.js
index 42fdf9eefd7..6f5a403bd55 100644
--- a/src/store/conversationsStore.js
+++ b/src/store/conversationsStore.js
@@ -128,6 +128,16 @@ const getters = {
 				return conversation2.lastActivity - conversation1.lastActivity
 			})
 	},
+	/**
+	 * List of all archived conversations sorted
+	 *
+	 * @param {object} state state
+	 * @param {object} getters getters
+	 * @return {object[]} sorted conversations list
+	 */
+	archivedConversationsList: (state, getters) => {
+		return getters.conversationsList.filter(conversation => conversation.isArchived)
+	},
 	/**
 	 * Get a conversation providing its token
 	 *
diff --git a/src/utils/conversation.js b/src/utils/conversation.js
index fb125be52cc..41ec90ef873 100644
--- a/src/utils/conversation.js
+++ b/src/utils/conversation.js
@@ -2,7 +2,10 @@
  * SPDX-FileCopyrightText: 2023 Nextcloud GmbH and Nextcloud contributors
  * SPDX-License-Identifier: AGPL-3.0-or-later
  */
-import { CONVERSATION } from '../constants.js'
+import { CONVERSATION, PARTICIPANT } from '../constants.js'
+import { hasTalkFeature } from '../services/CapabilitiesManager.ts'
+
+const supportsArchive = hasTalkFeature('local', 'archived-conversations')
 
 /**
  * check if the conversation has unread messages
@@ -27,16 +30,57 @@ export function hasUnreadMentions(conversation) {
 			&& (conversation.type === CONVERSATION.TYPE.ONE_TO_ONE || conversation.type === CONVERSATION.TYPE.ONE_TO_ONE_FORMER))
 }
 
+/**
+ * check if the conversation has ongoing call
+ *
+ * @param {object} conversation conversation object
+ * @return {boolean}
+ */
+export function hasCall(conversation) {
+	return conversation.hasCall && (!isArchived(conversation) || conversation.notificationCalls === PARTICIPANT.NOTIFY_CALLS.ON)
+}
+
+/**
+ * check if the conversation is archived
+ *
+ * @param {object} conversation conversation object
+ * @return {boolean}
+ */
+export function isArchived(conversation) {
+	return conversation.isArchived
+}
+
+/**
+ * check if the conversation passes default validation:
+ * - non-archived
+ * - archived, but have an unread message with notification triggered
+ *
+ * @param {object} conversation conversation object
+ * @return {boolean}
+ */
+export function isDefault(conversation) {
+	return !isArchived(conversation)
+		|| (conversation.notificationLevel === PARTICIPANT.NOTIFY.ALWAYS && hasUnreadMessages(conversation))
+		|| (conversation.notificationLevel === PARTICIPANT.NOTIFY.MENTION && hasUnreadMentions(conversation))
+}
+
 /**
  * apply the active filter
  *
  * @param {string} filter the filter option
+ * @param {string} archived the archived filter option
  * @param {object} conversation conversation object
  */
-export function filterFunction(filter, conversation) {
+export function filterFunction(filter, archived, conversation) {
+	const shouldIncludeArchived = supportsArchive
+		? (archived ? isArchived(conversation) : isDefault(conversation))
+		: true
+
 	if (filter === 'unread') {
-		return hasUnreadMessages(conversation)
+		return shouldIncludeArchived && hasUnreadMessages(conversation)
 	} else if (filter === 'mentions') {
-		return hasUnreadMentions(conversation)
+		return shouldIncludeArchived && hasUnreadMentions(conversation)
+	} else {
+		return shouldIncludeArchived
 	}
 }