release: v0.13.0 (#535)

Twenty-nine commits since v0.12.0. See CHANGELOG.md for the full list and the upgrade notes. Ten additions — the SEO package (site URL, robots.txt, sitemap.xml, JSON-LD), slideshow mode, opt-in original downloads, copy-link, previous/next album navigation, alt text from the Immich description, per-album location precision, the update notice, a Help tab, and a subpage cover grid separate from its photo grid. Two fixes: CJK album slugs, and the lightbox control bar. Photo of the Day (#476) was built on `dev` and reverted as not planned; it never appears in a release. 🤖 Generated with [Claude Code](https://claude.com/claude-code) https://claude.ai/code/session_01DmsHVRL9yQvckUB1ZpVWre --------- Signed-off-by: dependabot[bot] <support@github.com> Co-authored-by: ralksta <ralksta@users.noreply.github.com> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> Co-authored-by: Claude Opus 5 <noreply@anthropic.com>
2026-08-25 10:08:12 +02:00
parent 10ec68f493
commit a813433891
73 changed files with 4697 additions and 453 deletions
--- a/app/[...path]/AlbumDetailView.tsx
+++ b/app/[...path]/AlbumDetailView.tsx
@@ -8,6 +8,9 @@ import Image from 'next/image';
 import React from 'react';
 import { getServerDictionary } from '@/lib/i18n/server';
 import { albumMetaDetail } from '@/lib/albumMeta';
+import { AlbumNav } from '@/components/AlbumNav';
+import { StructuredData } from '@/components/StructuredData';
+import type { AlbumNavPair } from '@/lib/albumNav';

 interface AlbumDetailViewProps {
  album: ImmichAlbum;
@@ -28,6 +31,10 @@ interface AlbumDetailViewProps {
  proofing?: boolean;
  /** Offer the "send by email" button in the proofing modal. */
  allowMailto?: boolean;
+  /** Neighbouring albums in the surrounding list, for the foot navigation. */
+  nav?: AlbumNavPair;
+  /** JSON-LD for this album, or null when no site URL is configured (#472). */
+  structuredData?: Record<string, unknown> | null;
 }

 export function AlbumDetailView({
@@ -45,12 +52,15 @@ export function AlbumDetailView({
  showGear = true,
  proofing,
  allowMailto,
+  nav,
+  structuredData,
 }: AlbumDetailViewProps) {
  const metaDetail = albumMetaDetail(album, showGear);
  const t = getServerDictionary();

  return (
    <>
+      {structuredData && <StructuredData data={structuredData} />}
      {heroImageUrl && (
        <div className="album-hero">
          <Image
@@ -93,6 +103,7 @@ export function AlbumDetailView({
        proofing={proofing}
        allowMailto={allowMailto}
      />
+      {nav && <AlbumNav {...nav} />}
    </>
  );
 }
--- a/app/[...path]/PhotoGrid.tsx
+++ b/app/[...path]/PhotoGrid.tsx
@@ -15,6 +15,7 @@ import { FadeIn } from '@/components/FadeIn';
 import { ProofingProvider, useProofing } from '@/components/ProofingContext';
 import { ProofingModal } from '@/components/ProofingModal';
 import { useDictionary } from '@/components/I18nProvider';
+import { parsePhotoHash, buildPhotoHash } from '@/lib/photoHash';

 export interface PhotoItem {
  id: string;
@@ -31,6 +32,10 @@ export interface PhotoItem {
  focalLength?: string;
  /** Natural image aspect ratio (width/height) for masonry layout */
  aspectRatio?: number;
+  /** Immich asset description, used as alt text. Absent when captions are off. */
+  caption?: string;
+  /** Present only when the surrounding album offers its originals (#475). */
+  downloadUrl?: string;
 }

 interface PhotoGridProps {
@@ -54,19 +59,6 @@ interface PhotoGridProps {
  allowMailto?: boolean;
 }

-/** Parse `#photo-N` from a hash string. Returns index or null. */
-function parsePhotoHash(hash: string): number | null {
-  const match = hash.match(/^#photo-(\d+)$/);
-  if (!match) return null;
-  const idx = parseInt(match[1], 10) - 1; // 1-indexed in URL, 0-indexed internally
-  return idx >= 0 ? idx : null;
-}
-
-/** Build the hash string for a given 0-based index. */
-function buildPhotoHash(index: number): string {
-  return `#photo-${index + 1}`; // 1-indexed for user-friendliness
-}
-
 function PhotoGridInner({
  assets,
  layout = 'masonry',
@@ -186,7 +178,7 @@ function PhotoGridInner({
          >
            <Image
              src={asset.thumbUrl}
-              alt=""
+              alt={asset.caption ?? ''}
              fill
              sizes="(max-width: 600px) 50vw, (max-width: 1000px) 33vw, 25vw"
              loading={index < 6 ? 'eager' : 'lazy'}
--- a/app/[...path]/page.tsx
+++ b/app/[...path]/page.tsx
@@ -20,7 +20,9 @@ import {
  exifUrl,
  videoUrl,
  assetPlaceholder,
+  assetCaption,
  assetExifSummary,
+  downloadUrl,
  assetAspectRatio,
 } from '@/lib/urls';
 import { encodeAssetId } from '@/lib/tokens';
@@ -28,6 +30,7 @@ import {
  buildCoverGridVars,
  getConfig,
  hasExifPanelContent,
+  normalizeSlug,
  resolveProofing,
  type GridConfig,
 } from '@/lib/config';
@@ -36,6 +39,9 @@ import { isAdminAuthenticated } from '@/lib/admin/auth';
 import PasswordGate from '@/components/PasswordGate';
 import { AdminDiagnosticBanner } from '@/components/AdminDiagnosticBanner';
 import { AlbumDetailView } from './AlbumDetailView';
+import { albumNeighbours } from '@/lib/albumNav';
+import { albumStructuredData } from '@/lib/structuredData';
+import { absoluteUrl } from '@/lib/siteUrl';
 import { SubpageGridView } from './SubpageGridView';
 import { EssayView } from './EssayView';
 import { parseEssayMarkdown } from '@/lib/essay';
@@ -51,7 +57,11 @@ interface PathPageProps {
 }

 export async function generateMetadata({ params }: PathPageProps): Promise<Metadata> {
-  const { path } = await params;
+  // Next hands catch-all segments over percent-encoded, so a non-ASCII slug
+  // ("/家族相册") would never match a stored one. Decode once, here, and every
+  // comparison downstream works on the same form (#522).
+  const { path: rawPath } = await params;
+  const path = rawPath?.map(normalizeSlug);
  if (!path || path.length === 0) return {};

  const slug = path[0];
@@ -114,13 +124,23 @@ export async function generateMetadata({ params }: PathPageProps): Promise<Metad
 /**
 * `showExif` covers the hover overlay only, and that overlay carries camera,
 * lens and focal length — so it follows the `camera` group, not the panel.
+ *
+ * `showCaption` follows the `caption` group and decides whether the Immich
+ * description becomes alt text; see `assetCaption`.
 */
-function toPhotoItems(assets: ImmichAsset[], showExif: boolean): PhotoItem[] {
+function toPhotoItems(
+  assets: ImmichAsset[],
+  showExif: boolean,
+  showCaption: boolean,
+  /** The album offering downloads, or undefined when it does not. */
+  downloadAlbumId?: string,
+): PhotoItem[] {
  return assets
    .filter((a) => a.type === 'IMAGE' || a.type === 'VIDEO')
    .map((a) => {
      const ph = assetPlaceholder(a);
      const exif = showExif && a.type === 'IMAGE' ? assetExifSummary(a) : undefined;
+      const caption = assetCaption(a, showCaption);
      const isVideo = a.type === 'VIDEO';
      return {
        id: encodeAssetId(a.id),
@@ -131,11 +151,39 @@ function toPhotoItems(assets: ImmichAsset[], showExif: boolean): PhotoItem[] {
        exifUrl: exifUrl(a.id),
        ...(ph ? { blurDataURL: ph.blurDataURL, dominantColor: ph.dominantColor } : {}),
        ...(exif ?? {}),
+        ...(caption ? { caption } : {}),
+        ...(downloadAlbumId ? { downloadUrl: downloadUrl(downloadAlbumId, a.id) } : {}),
        aspectRatio: assetAspectRatio(a),
      };
    });
 }

+/**
+ * JSON-LD for an album page. Null unless a site URL is configured — structured
+ * data is a set of claims about absolute URLs, and there is nothing truthful to
+ * claim without one (#472).
+ */
+function structuredDataFor(
+  album: { albumName: string; description?: string; albumThumbnailAssetId?: string | null },
+  path: string,
+  photoCount: number,
+) {
+  const config = getConfig();
+  const cover = album.albumThumbnailAssetId
+    ? absoluteUrl(config.siteUrl, imageUrl(album.albumThumbnailAssetId, 'preview'))
+    : null;
+  return albumStructuredData({
+    siteUrl: config.siteUrl,
+    pageUrl: absoluteUrl(config.siteUrl, path),
+    albumName: album.albumName,
+    ...(album.description ? { description: album.description } : {}),
+    coverUrl: cover,
+    ...(config.legal.name?.trim() ? { creator: config.legal.name } : {}),
+    ...(config.seo.license ? { license: config.seo.license } : {}),
+    photoCount,
+  });
+}
+
 /**
 * Returns a PasswordGate element if the key (slug or ID) is protected and
 * not yet authenticated, otherwise returns null.
@@ -175,7 +223,11 @@ async function getAlbumHeroData(
 }

 export default async function PathPage({ params, searchParams }: PathPageProps) {
-  const { path } = await params;
+  // Next hands catch-all segments over percent-encoded, so a non-ASCII slug
+  // ("/家族相册") would never match a stored one. Decode once, here, and every
+  // comparison downstream works on the same form (#522).
+  const { path: rawPath } = await params;
+  const path = rawPath?.map(normalizeSlug);
  const sParams = (await searchParams) || {};
  const forceFresh = sParams.fresh === '1' || sParams.preview === 'true';

@@ -199,10 +251,10 @@ export default async function PathPage({ params, searchParams }: PathPageProps)
  const resolveLayout = (overrides?: Partial<GridConfig>) =>
    overrides?.layout ?? config.grid.layout;

-  // The album-cover grid on a subpage takes its column count from the same
-  // config as the photo grids, so "3 columns" in the admin means three columns
-  // everywhere. `gap` deliberately does not follow the global setting — see
-  // buildCoverGridVars() for why.
+  // The album-cover grid on a subpage is sized by its own `coverGrid`, which
+  // touches nothing but the cover tiles (#523). An unset column count still
+  // falls back to the global one; `gap` deliberately does not follow the global
+  // setting — see buildCoverGridVars() for why.
  const buildCoverGridStyle = (overrides?: Partial<GridConfig>): React.CSSProperties =>
    buildCoverGridVars(overrides, config.grid.columns) as React.CSSProperties;

@@ -254,7 +306,12 @@ export default async function PathPage({ params, searchParams }: PathPageProps)
    const spGrid = subpageData?.subpage.grid;
    const subpageName = subpageData?.subpage.name ?? subpageSlug;

-    const images = toPhotoItems(album.assets, config.exif.onHover && config.exif.camera);
+    const images = toPhotoItems(
+      album.assets,
+      config.exif.onHover && config.exif.camera,
+      config.exif.caption,
+      config.albumDownloads[album.id] ? album.id : undefined,
+    );

    // Password gate for protected albums
    const albumGate = await gateIfProtected(album.id, 'album', album.albumName);
@@ -262,10 +319,16 @@ export default async function PathPage({ params, searchParams }: PathPageProps)

    const heroData = await getAlbumHeroData(album.id, config);

+    // Neighbours come from the subpage list the visitor just came through, in
+    // that list's own order, so "next" agrees with the grid they saw (#483).
+    const nav = subpageData ? albumNeighbours(subpageData.albums, album.id, `/${subpageSlug}`) : {};
+
    return (
      <AlbumDetailView
        album={album}
        images={images}
+        nav={nav}
+        structuredData={structuredDataFor(album, `/${subpageSlug}/${albumSlug}`, images.length)}
        layout={resolveLayout(mergeAlbumGrid(album.id, spGrid))}
        gridStyle={buildGridStyle(mergeAlbumGrid(album.id, spGrid))}
        backLinkHref={`/${subpageSlug}`}
@@ -324,7 +387,11 @@ export default async function PathPage({ params, searchParams }: PathPageProps)
        albums.map((a) => immich.getAlbumBySlug(a.slug, slug, forceFresh)),
      );
      const allAssets = allAlbums.flatMap((a) => (a ? a.assets : []));
-      const images = toPhotoItems(allAssets, config.exif.onHover && config.exif.camera);
+      const images = toPhotoItems(
+        allAssets,
+        config.exif.onHover && config.exif.camera,
+        config.exif.caption,
+      );

      // Fallback structured essay if layout: 'essay' is set without custom markdown file
      if (!essayParsed) {
@@ -381,7 +448,12 @@ export default async function PathPage({ params, searchParams }: PathPageProps)
        notFound();
      }

-      const images = toPhotoItems(album.assets, config.exif.onHover && config.exif.camera);
+      const images = toPhotoItems(
+        album.assets,
+        config.exif.onHover && config.exif.camera,
+        config.exif.caption,
+        config.albumDownloads[album.id] ? album.id : undefined,
+      );

      // Password gate for protected albums
      const albumGate = await gateIfProtected(album.id, 'album', album.albumName);
@@ -444,7 +516,7 @@ export default async function PathPage({ params, searchParams }: PathPageProps)
        albums={albumsWithHero}
        coverPlaceholders={coverPlaceholders}
        sections={result.subpage.sections}
-        gridStyle={buildCoverGridStyle(result.subpage.grid)}
+        gridStyle={buildCoverGridStyle(result.subpage.coverGrid)}
        {...(subpageIndex >= 0 ? { index: subpageIndex + 1 } : {})}
      />
    );
@@ -464,7 +536,12 @@ export default async function PathPage({ params, searchParams }: PathPageProps)
    notFound();
  }

-  const images = toPhotoItems(album.assets, config.exif.onHover && config.exif.camera);
+  const images = toPhotoItems(
+    album.assets,
+    config.exif.onHover && config.exif.camera,
+    config.exif.caption,
+    config.albumDownloads[album.id] ? album.id : undefined,
+  );

  // Password gate for protected albums
  const albumGate = await gateIfProtected(album.id, 'album', album.albumName);
@@ -480,6 +557,8 @@ export default async function PathPage({ params, searchParams }: PathPageProps)
      gridStyle={buildGridStyle(mergeAlbumGrid(album.id))}
      backLinkHref="/"
      backLinkLabel={getServerDictionary().common.backToGallery}
+      nav={albumNeighbours(await immich.getStandaloneAlbums(forceFresh), album.id)}
+      structuredData={structuredDataFor(album, `/${slug}`, images.length)}
      watermark={config.watermark}
      showExifPanel={hasExifPanelContent(config.exif)}
      showGear={config.exif.camera}