diff --git a/src/app/(static)/t/[tag]/page.tsx b/src/app/(static)/t/[tag]/page.tsx index 064ab47f..466986f3 100644 --- a/src/app/(static)/t/[tag]/page.tsx +++ b/src/app/(static)/t/[tag]/page.tsx @@ -1,12 +1,9 @@ import SiteGrid from '@/components/SiteGrid'; +import { dateRangeForPhotos } from '@/photo'; import PhotoGrid from '@/photo/PhotoGrid'; import { getPhotos } from '@/services/postgres'; import { absolutePathForTag, absolutePathForTagImage } from '@/site/paths'; -import { - descriptionForTaggedPhotos, - ogTitleForTag, - pageTitleForTag, -} from '@/tag'; +import { descriptionForTaggedPhotos, titleForTag } from '@/tag'; import PhotoTag from '@/tag/PhotoTag'; import { cc } from '@/utility/css'; import { Metadata } from 'next'; @@ -21,15 +18,14 @@ export async function generateMetadata({ const photos = await getPhotos(undefined, undefined, undefined, tag); const url = absolutePathForTag(tag); - const titlePage = pageTitleForTag(tag); - const titleOg = ogTitleForTag(tag); - const description = descriptionForTaggedPhotos(photos); + const title = titleForTag(tag, photos); + const description = descriptionForTaggedPhotos(photos, true); const images = absolutePathForTagImage(tag); return { - title: titlePage, + title, openGraph: { - title: titleOg, + title, description, images, url, @@ -46,8 +42,7 @@ export async function generateMetadata({ export default async function TagPage({ params: { tag } }: TagProps) { const photos = await getPhotos(undefined, undefined, undefined, tag); - const dateStart = photos[0].takenAtNaiveFormattedShort; - const dateEnd = photos[photos.length - 1].takenAtNaiveFormattedShort; + const { start, end } = dateRangeForPhotos(photos); return ( - {dateStart === dateEnd - ? dateStart - : <>{dateStart}
– {dateEnd}} + {start === end + ? start + : <>{start}
– {end}} diff --git a/src/photo/index.ts b/src/photo/index.ts index 9dca4709..8ec39e49 100644 --- a/src/photo/index.ts +++ b/src/photo/index.ts @@ -63,8 +63,8 @@ export interface Photo extends PhotoDb { isoFormatted?: string exposureTimeFormatted?: string exposureCompensationFormatted?: string - takenAtNaiveFormatted?: string - takenAtNaiveFormattedShort?: string + takenAtNaiveFormatted: string + takenAtNaiveFormattedShort: string } export const parsePhotoFromDb = (photoDbRaw: PhotoDb): Photo => { @@ -178,3 +178,12 @@ export const translatePhotoId = (shortId: string) => { export const titleForPhoto = (photo: Photo) => photo.title || 'Untitled'; + +export const dateRangeForPhotos = (photos: Photo[]) => { + const start = photos[0].takenAtNaiveFormattedShort; + const end = photos[photos.length - 1].takenAtNaiveFormattedShort; + const description = start === end + ? start + : `${start}–${end}`; + return { start, end, description }; +}; diff --git a/src/tag/index.ts b/src/tag/index.ts index dcc622f0..5295f93d 100644 --- a/src/tag/index.ts +++ b/src/tag/index.ts @@ -1,11 +1,13 @@ -import { Photo } from '@/photo'; +import { Photo, dateRangeForPhotos } from '@/photo'; import { capitalizeWords } from '@/utility/string'; -export const pageTitleForTag = (tag: string) => - `${capitalizeWords(tag.replaceAll('-', ' '))} Photos`; +export const titleForTag = (tag: string, photos:Photo[]) => + `${capitalizeWords(tag.replaceAll('-', ' '))} (${photos.length})`; -export const ogTitleForTag = (tag: string) => - `🏷️ ${capitalizeWords(tag.replaceAll('-', ' '))}`; - -export const descriptionForTaggedPhotos = (photos:Photo[]) => - `${photos.length} tagged ${photos.length === 1 ? 'photo' : 'photos'}`; +export const descriptionForTaggedPhotos = ( + photos:Photo[], + dateBased?: boolean, +) => + dateBased + ? dateRangeForPhotos(photos).description.toUpperCase() + : `${photos.length} tagged ${photos.length === 1 ? 'photo' : 'photos'}`;