refactor(server, web): create shared link (#2879)

* refactor: shared links

* chore: open api

* fix: tsc error

web/src/routes/(user)/share/[key]/+page.server.ts

@@ -7,7 +7,7 @@ export const load = (async ({ params, locals: { api } }) => {
 	const { key } = params;
 
 	try {
-		const { data: sharedLink } = await api.shareApi.getMySharedLink({ key });
+		const { data: sharedLink } = await api.sharedLinkApi.getMySharedLink({ key });
 
 		const assetCount = sharedLink.assets.length;
 		const assetId = sharedLink.album?.albumThumbnailAssetId || sharedLink.assets[0]?.id;

web/src/routes/(user)/sharing/sharedlinks/+page.svelte

@@ -1,7 +1,6 @@
 <script lang="ts">
 	import ControlAppBar from '$lib/components/shared-components/control-app-bar.svelte';
 	import ArrowLeft from 'svelte-material-icons/ArrowLeft.svelte';
-
 	import { api, SharedLinkResponseDto } from '@api';
 	import { goto } from '$app/navigation';
 	import SharedLinkCard from '$lib/components/sharedlinks-page/shared-link-card.svelte';
@@ -11,53 +10,45 @@
 	} from '$lib/components/shared-components/notification/notification';
 	import { onMount } from 'svelte';
 	import CreateSharedLinkModal from '$lib/components/shared-components/create-share-link-modal/create-shared-link-modal.svelte';
+	import ConfirmDialogue from '$lib/components/shared-components/confirm-dialogue.svelte';
+	import { handleError } from '$lib/utils/handle-error';
+	import { AppRoute } from '$lib/constants';
 
 	let sharedLinks: SharedLinkResponseDto[] = [];
-	let showEditForm = false;
-	let editSharedLink: SharedLinkResponseDto;
+	let editSharedLink: SharedLinkResponseDto | null = null;
 
-	onMount(async () => {
-		sharedLinks = await getSharedLinks();
-	});
+	let deleteLinkId: string | null = null;
 
-	const getSharedLinks = async () => {
-		const { data: sharedLinks } = await api.shareApi.getAllSharedLinks();
-
-		return sharedLinks;
+	const refresh = async () => {
+		const { data } = await api.sharedLinkApi.getAllSharedLinks();
+		sharedLinks = data;
 	};
 
-	const handleDeleteLink = async (linkId: string) => {
-		if (window.confirm('Do you want to delete the shared link? ')) {
-			try {
-				await api.shareApi.removeSharedLink({ id: linkId });
-				notificationController.show({
-					message: 'Shared link deleted',
-					type: NotificationType.Info
-				});
+	onMount(async () => {
+		await refresh();
+	});
 
-				sharedLinks = await getSharedLinks();
-			} catch (e) {
-				console.error(e);
-				notificationController.show({
-					message: 'Failed to delete shared link',
-					type: NotificationType.Error
-				});
-			}
+	const handleDeleteLink = async () => {
+		if (!deleteLinkId) {
+			return;
+		}
+
+		try {
+			await api.sharedLinkApi.removeSharedLink({ id: deleteLinkId });
+			notificationController.show({ message: 'Deleted shared link', type: NotificationType.Info });
+			deleteLinkId = null;
+			refresh();
+		} catch (error) {
+			handleError(error, 'Unable to delete shared link');
 		}
 	};
 
-	const handleEditLink = async (id: string) => {
-		const { data } = await api.shareApi.getSharedLinkById({ id });
-		editSharedLink = data;
-		showEditForm = true;
-	};
-
 	const handleEditDone = async () => {
-		sharedLinks = await getSharedLinks();
-		showEditForm = false;
+		refresh();
+		editSharedLink = null;
 	};
 
-	const handleCopy = async (key: string) => {
+	const handleCopyLink = async (key: string) => {
 		const link = `${window.location.origin}/share/${key}`;
 		await navigator.clipboard.writeText(link);
 		notificationController.show({
@@ -67,7 +58,7 @@
 	};
 </script>
 
-<ControlAppBar backIcon={ArrowLeft} on:close-button-click={() => goto('/sharing')}>
+<ControlAppBar backIcon={ArrowLeft} on:close-button-click={() => goto(AppRoute.SHARING)}>
 	<svelte:fragment slot="leading">Shared links</svelte:fragment>
 </ControlAppBar>
 
@@ -86,16 +77,16 @@
 			{#each sharedLinks as link (link.id)}
 				<SharedLinkCard
 					{link}
-					on:delete={() => handleDeleteLink(link.id)}
-					on:edit={() => handleEditLink(link.id)}
-					on:copy={() => handleCopy(link.key)}
+					on:delete={() => (deleteLinkId = link.id)}
+					on:edit={() => (editSharedLink = link)}
+					on:copy={() => handleCopyLink(link.key)}
 				/>
 			{/each}
 		</div>
 	{/if}
 </section>
 
-{#if showEditForm}
+{#if editSharedLink}
 	<CreateSharedLinkModal
 		editingLink={editSharedLink}
 		shareType={editSharedLink.type}
@@ -103,3 +94,13 @@
 		on:close={handleEditDone}
 	/>
 {/if}
+
+{#if deleteLinkId}
+	<ConfirmDialogue
+		title="Delete Shared Link"
+		prompt="Are you want to delete this shared link?"
+		confirmText="Delete"
+		on:confirm={() => handleDeleteLink()}
+		on:cancel={() => (deleteLinkId = null)}
+	/>
+{/if}