feat(web): improve individual share ux (#17430)

web/src/lib/components/asset-viewer/asset-viewer-nav-bar.svelte

@@ -54,6 +54,7 @@
     album?: AlbumResponseDto | null;
     person?: PersonResponseDto | null;
     stack?: StackResponseDto | null;
+    showCloseButton?: boolean;
     showDetailButton: boolean;
     showSlideshow?: boolean;
     onZoomImage: () => void;
@@ -73,6 +74,7 @@
     album = null,
     person = null,
     stack = null,
+    showCloseButton = true,
     showDetailButton,
     showSlideshow = false,
     onZoomImage,
@@ -89,6 +91,7 @@
   const sharedLink = getSharedLink();
   let isOwner = $derived($user && asset.ownerId === $user?.id);
   let showDownloadButton = $derived(sharedLink ? sharedLink.allowDownload : !asset.isOffline);
+
   // $: showEditorButton =
   //   isOwner &&
   //   asset.type === AssetTypeEnum.Image &&
@@ -104,7 +107,9 @@
   class="z-[1001] flex h-16 place-items-center justify-between bg-gradient-to-b from-black/40 px-3 transition-transform duration-200"
 >
   <div class="text-white">
-    <CloseAction {onClose} />
+    {#if showCloseButton}
+      <CloseAction {onClose} />
+    {/if}
   </div>
   <div class="flex gap-2 overflow-x-auto text-white" data-testid="asset-viewer-navbar-actions">
     {#if !asset.isTrashed && $user}

web/src/lib/components/asset-viewer/asset-viewer.svelte

@@ -61,6 +61,7 @@
     preAction?: PreAction | undefined;
     onAction?: OnAction | undefined;
     reactions?: ActivityResponseDto[];
+    showCloseButton?: boolean;
     onClose: (dto: { asset: AssetResponseDto }) => void;
     onNext: () => Promise<HasAsset>;
     onPrevious: () => Promise<HasAsset>;
@@ -79,6 +80,7 @@
     preAction = undefined,
     onAction = undefined,
     reactions = $bindable([]),
+    showCloseButton,
     onClose,
     onNext,
     onPrevious,
@@ -431,6 +433,7 @@
         {album}
         {person}
         {stack}
+        {showCloseButton}
         showDetailButton={enableDetailPanel}
         showSlideshow={true}
         onZoomImage={zoomToggle}