Merge pull request #6753 from silentoplayz/silentoplayz-unarchive-all

feat: Unarchive All Archived Chats Button with Confirmation

src/lib/components/layout/Sidebar/ArchivedChatsModal.svelte

@@ -7,22 +7,25 @@
 
 	const dispatch = createEventDispatcher();
 
-	import Modal from '$lib/components/common/Modal.svelte';
 	import {
 		archiveChatById,
 		deleteChatById,
 		getAllArchivedChats,
 		getArchivedChatList
 	} from '$lib/apis/chats';
+
+	import Modal from '$lib/components/common/Modal.svelte';
 	import Tooltip from '$lib/components/common/Tooltip.svelte';
+	import UnarchiveAllConfirmDialog from '$lib/components/common/ConfirmDialog.svelte';
 	const i18n = getContext('i18n');
 
 	export let show = false;
 
-	let searchValue = '';
-
 	let chats = [];
 
+	let searchValue = '';
+	let showUnarchiveAllConfirmDialog = false;
+
 	const unarchiveChatHandler = async (chatId) => {
 		const res = await archiveChatById(localStorage.token, chatId).catch((error) => {
 			toast.error(error);
@@ -45,7 +48,14 @@
 		let blob = new Blob([JSON.stringify(chats)], {
 			type: 'application/json'
 		});
-		saveAs(blob, `archived-chat-export-${Date.now()}.json`);
+		saveAs(blob, `${$i18n.t('archived-chat-export')}-${Date.now()}.json`);
+	};
+
+	const unarchiveAllHandler = async () => {
+		for (const chat of chats) {
+			await archiveChatById(localStorage.token, chat.id);
+		}
+		chats = await getArchivedChatList(localStorage.token);
 	};
 
 	$: if (show) {
@@ -55,6 +65,15 @@
 	}
 </script>
 
+<UnarchiveAllConfirmDialog
+	bind:show={showUnarchiveAllConfirmDialog}
+	message={$i18n.t('Are you sure you want to unarchive all archived chats?')}
+	confirmLabel={$i18n.t('Unarchive All')}
+	on:confirm={() => {
+		unarchiveAllHandler();
+	}}
+/>
+
 <Modal size="lg" bind:show>
 	<div>
 		<div class=" flex justify-between dark:text-gray-300 px-5 pt-4 pb-1">
@@ -72,7 +91,9 @@
 					class="w-5 h-5"
 				>
 					<path
+						fill-rule="evenodd"
 						d="M6.28 5.22a.75.75 0 00-1.06 1.06L8.94 10l-3.72 3.72a.75.75 0 101.06 1.06L10 11.06l3.72 3.72a.75.75 0 101.06-1.06L11.06 10l3.72-3.72a.75.75 0 00-1.06-1.06L10 8.94 6.28 5.22z"
+						clip-rule="evenodd"
 					/>
 				</svg>
 			</button>
@@ -144,7 +165,7 @@
 
 												<td class="px-3 py-1 text-right">
 													<div class="flex justify-end w-full">
-														<Tooltip content="Unarchive Chat">
+														<Tooltip content={$i18n.t('Unarchive Chat')}>
 															<button
 																class="self-center w-fit text-sm px-2 py-2 hover:bg-black/5 dark:hover:bg-white/5 rounded-xl"
 																on:click={async () => {
@@ -168,7 +189,7 @@
 															</button>
 														</Tooltip>
 
-														<Tooltip content="Delete Chat">
+														<Tooltip content={$i18n.t('Delete Chat')}>
 															<button
 																class="self-center w-fit text-sm px-2 py-2 hover:bg-black/5 dark:hover:bg-white/5 rounded-xl"
 																on:click={async () => {
@@ -200,13 +221,24 @@
 							</div>
 						</div>
 
-						<div class="flex flex-wrap text-sm font-medium gap-1.5 mt-2 m-1">
+						<div class="flex flex-wrap text-sm font-medium gap-1.5 mt-2 m-1 justify-end w-full">
 							<button
 								class=" px-3.5 py-1.5 font-medium hover:bg-black/5 dark:hover:bg-white/5 outline outline-1 outline-gray-300 dark:outline-gray-800 rounded-3xl"
 								on:click={() => {
-									exportChatsHandler();
+									showUnarchiveAllConfirmDialog = true;
-								}}>Export All Archived Chats</button
+								}}
 							>
+								{$i18n.t('Unarchive All Archived Chats')}
+							</button>
+
+							<button
+								class="px-3.5 py-1.5 font-medium hover:bg-black/5 dark:hover:bg-white/5 outline outline-1 outline-gray-300 dark:outline-gray-800 rounded-3xl"
+								on:click={() => {
+									exportChatsHandler();
+								}}
+							>
+								{$i18n.t('Export All Archived Chats')}
+							</button>
 						</div>
 					</div>
 				{:else}