From fbd98ec0f9fa76f46250c66296f9e511efc53f6c Mon Sep 17 00:00:00 2001
From: martin <74269598+martabal@users.noreply.github.com>
Date: Thu, 29 Jun 2023 04:14:16 +0200
Subject: [PATCH] feat(web): persist info panel (#3013)

Signed-off-by: martabal <74269598+martabal@users.noreply.github.com>
---
 .../lib/components/asset-viewer/asset-viewer.svelte  | 12 ++++++------
 web/src/lib/stores/preferences.store.ts              |  2 ++
 2 files changed, 8 insertions(+), 6 deletions(-)

diff --git a/web/src/lib/components/asset-viewer/asset-viewer.svelte b/web/src/lib/components/asset-viewer/asset-viewer.svelte
index 27ddd2f2a0..6192518ba7 100644
--- a/web/src/lib/components/asset-viewer/asset-viewer.svelte
+++ b/web/src/lib/components/asset-viewer/asset-viewer.svelte
@@ -24,6 +24,7 @@
 	import VideoViewer from './video-viewer.svelte';
 
 	import { assetStore } from '$lib/stores/assets.store';
+	import { isShowDetail } from '$lib/stores/preferences.store';
 	import { addAssetsToAlbum, getFilenameExtension } from '$lib/utils/asset-utils';
 	import { browser } from '$app/environment';
 
@@ -35,7 +36,6 @@
 	const dispatch = createEventDispatcher();
 	let halfLeftHover = false;
 	let halfRightHover = false;
-	let isShowDetail = false;
 	let appearsInAlbums: AlbumResponseDto[] = [];
 	let isShowAlbumPicker = false;
 	let addToSharedAlbum = true;
@@ -81,7 +81,7 @@
 				deleteAsset();
 				return;
 			case 'i':
-				isShowDetail = !isShowDetail;
+				$isShowDetail = !$isShowDetail;
 				return;
 			case 'ArrowLeft':
 				navigateAssetBackward();
@@ -93,7 +93,7 @@
 	};
 
 	const handleCloseViewer = () => {
-		isShowDetail = false;
+		$isShowDetail = false;
 		closeViewer();
 	};
 
@@ -112,7 +112,7 @@
 	};
 
 	const showDetailInfoHandler = () => {
-		isShowDetail = !isShowDetail;
+		$isShowDetail = !$isShowDetail;
 	};
 
 	const handleDownload = () => {
@@ -401,7 +401,7 @@
 		</div>
 	{/if}
 
-	{#if isShowDetail}
+	{#if $isShowDetail}
 		<div
 			transition:fly={{ duration: 150 }}
 			id="detail-panel"
@@ -411,7 +411,7 @@
 			<DetailPanel
 				{asset}
 				albums={appearsInAlbums}
-				on:close={() => (isShowDetail = false)}
+				on:close={() => ($isShowDetail = false)}
 				on:close-viewer={handleCloseViewer}
 				on:description-focus-in={disableKeyDownEvent}
 				on:description-focus-out={enableKeyDownEvent}
diff --git a/web/src/lib/stores/preferences.store.ts b/web/src/lib/stores/preferences.store.ts
index 62dce34cb3..7969838ce0 100644
--- a/web/src/lib/stores/preferences.store.ts
+++ b/web/src/lib/stores/preferences.store.ts
@@ -38,6 +38,8 @@ export const mapSettings = persisted<MapSettings>('map-settings', {
 
 export const videoViewerVolume = persisted<number>('video-viewer-volume', 1, {});
 
+export const isShowDetail = persisted<boolean>('info-opened', false, {});
+
 export interface AlbumViewSettings {
 	sortBy: string;
 }