a shared link is a URL, not a key

Create, edit and revoke shared links from the album header, the selection
bar and the Sharing panel. Password, expiry, and the three flags that
decide what the person opening it can do.

The panel showed a bare key because this plugin never learned the
instance's public address. It does not need to store one: Immich has
`externalDomain` in its own admin settings, `/server/config` already
returns it, and it is the same field Immich's own copy-link button reads,
so the two cannot disagree. Empty is a real state and the UI says so
rather than inventing a host.

Payload shapes came from the live instance's spec.json, not from memory.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>

web/AlbumsSection.tsx

@@ -1,6 +1,6 @@
-import { useMemo } from 'react';
+import { useMemo, useState } from 'react';
 import { Link, useSearchParams } from 'react-router';
-import { ArrowLeft, ImageOff, MoreVertical, Plus } from 'lucide-react';
+import { ArrowLeft, ImageOff, MoreVertical, Plus, Share2 } from 'lucide-react';
 import { Button } from '@/components/ui/button';
 import {
   DropdownMenu,
@@ -12,6 +12,7 @@ import { useClient } from 'hooks/useClient';
 import { AssetViewer } from './AssetViewer';
 import { PhotoGrid } from './PhotoGrid';
 import { SelectionBar } from './SelectionBar';
+import { ShareLinkDialog } from './ShareLinkDialog';
 import { ALBUM_PARAM, formatDateRange, thumbUrl, toGridAsset } from './shared';
 import { useAlbum, useAlbums } from './usePhotosData';
 import { useAssetActions } from './useAssetActions';
@@ -123,6 +124,7 @@ const AlbumDetailView = ({ albumId }: { albumId: string }) => {
 
   const assets = useMemo(() => (album?.assets ?? []).map(toGridAsset), [album]);
   const selection = useSelection(assets.map((asset) => asset.id));
+  const [sharing, setSharing] = useState(false);
 
   const back = (() => {
     const next = new URLSearchParams(params);
@@ -150,6 +152,11 @@ const AlbumDetailView = ({ albumId }: { albumId: string }) => {
               {album?.assetCount ?? 0} items{range ? ` · ${range}` : ''}
             </p>
           </div>
+          <div className="flex-1" />
+          <Button variant="ghost" size="sm" onClick={() => setSharing(true)} disabled={!album}>
+            <Share2 className="mr-1.5 h-4 w-4" />
+            Share
+          </Button>
         </header>
       )}
 
@@ -167,6 +174,12 @@ const AlbumDetailView = ({ albumId }: { albumId: string }) => {
       </div>
 
       <AssetViewer ids={assets.map((asset) => asset.id)} token={token} />
+
+      <ShareLinkDialog
+        open={sharing}
+        onOpenChange={setSharing}
+        target={album ? { kind: 'album', albumId: album.id, albumName: album.albumName } : null}
+      />
     </div>
   );
 };