From 53952482f6ac04374f04e828b2313f5db34831c9 Mon Sep 17 00:00:00 2001 From: Sam Becker Date: Wed, 19 Mar 2025 23:11:44 -0500 Subject: [PATCH] Respect focal length configuration in grid sidebar --- app/grid/page.tsx | 2 ++ app/page.tsx | 4 +++- src/app/config.ts | 2 ++ src/photo/PhotoGridPage.tsx | 25 ++++----------------- src/photo/PhotoGridSidebar.tsx | 40 ++++++++++++++++++++++++---------- src/photo/data.ts | 19 ++++++++++------ 6 files changed, 51 insertions(+), 41 deletions(-) diff --git a/app/grid/page.tsx b/app/grid/page.tsx index 3866e733..34a8d025 100644 --- a/app/grid/page.tsx +++ b/app/grid/page.tsx @@ -30,6 +30,7 @@ export default async function GridPage() { tags, simulations, recipes, + focalLengths, ] = await Promise.all([ getPhotosCached() .catch(() => []), @@ -50,6 +51,7 @@ export default async function GridPage() { tags, simulations, recipes, + focalLengths, }} /> : diff --git a/app/page.tsx b/app/page.tsx index 6568c609..0a91f53a 100644 --- a/app/page.tsx +++ b/app/page.tsx @@ -36,6 +36,7 @@ export default async function HomePage() { tags, simulations, recipes, + focalLengths, ] = await Promise.all([ getPhotosCached() .catch(() => []), @@ -44,7 +45,7 @@ export default async function HomePage() { .catch(() => 0), ...(GRID_HOMEPAGE_ENABLED ? getPhotoSidebarData() - : [[], [], [], [], []]), + : [[], [], [], [], [], [], []]), ]); return ( @@ -59,6 +60,7 @@ export default async function HomePage() { tags, simulations, recipes, + focalLengths, }} /> : diff --git a/src/app/config.ts b/src/app/config.ts index e3bfbf5e..b20bb9f1 100644 --- a/src/app/config.ts +++ b/src/app/config.ts @@ -218,6 +218,8 @@ export const SHOW_RECIPES = CATEGORY_VISIBILITY.includes('recipes'); export const SHOW_FILM_SIMULATIONS = CATEGORY_VISIBILITY.includes('films'); +export const SHOW_FOCAL_LENGTHS = + CATEGORY_VISIBILITY.includes('focal-lengths'); export const SHOW_EXIF_DATA = process.env.NEXT_PUBLIC_HIDE_EXIF_DATA !== '1'; export const SHOW_ZOOM_CONTROLS = diff --git a/src/photo/PhotoGridPage.tsx b/src/photo/PhotoGridPage.tsx index 4a3de748..903bc94a 100644 --- a/src/photo/PhotoGridPage.tsx +++ b/src/photo/PhotoGridPage.tsx @@ -1,34 +1,21 @@ 'use client'; -import { Tags } from '@/tag'; import { Photo } from '.'; -import { Cameras } from '@/camera'; -import { FilmSimulations } from '@/simulation'; import { PATH_GRID_INFERRED } from '@/app/paths'; import PhotoGridSidebar from './PhotoGridSidebar'; import PhotoGridContainer from './PhotoGridContainer'; import { useEffect } from 'react'; import { useAppState } from '@/state/AppState'; import clsx from 'clsx/lite'; -import { Recipes } from '@/recipe'; -import { Lenses } from '@/lens'; +import { PhotoSetCategories } from '@/category'; export default function PhotoGridPage({ photos, photosCount, - cameras, - lenses, - tags, - simulations, - recipes, -}: { + ...categories +}: PhotoSetCategories & { photos: Photo[] photosCount: number - cameras: Cameras - lenses: Lenses - tags: Tags - simulations: FilmSimulations - recipes: Recipes }) { const { setSelectedPhotoIds } = useAppState(); @@ -66,11 +53,7 @@ export default function PhotoGridPage({ 'py-4', )}> diff --git a/src/photo/PhotoGridSidebar.tsx b/src/photo/PhotoGridSidebar.tsx index 10b686dc..10037772 100644 --- a/src/photo/PhotoGridSidebar.tsx +++ b/src/photo/PhotoGridSidebar.tsx @@ -1,13 +1,13 @@ 'use client'; -import { Cameras, sortCamerasWithCount } from '@/camera'; +import { sortCamerasWithCount } from '@/camera'; import PhotoCamera from '@/camera/PhotoCamera'; import HeaderList from '@/components/HeaderList'; import PhotoTag from '@/tag/PhotoTag'; import { PhotoDateRange, dateRangeForPhotos, photoQuantityText } from '.'; -import { TAG_FAVS, TAG_HIDDEN, Tags, addHiddenToTags } from '@/tag'; +import { TAG_FAVS, TAG_HIDDEN, addHiddenToTags } from '@/tag'; import PhotoFilmSimulation from '@/simulation/PhotoFilmSimulation'; -import { FilmSimulations, sortFilmSimulationsWithCount } from '@/simulation'; +import { sortFilmSimulationsWithCount } from '@/simulation'; import FavsTag from '../tag/FavsTag'; import { useAppState } from '@/state/AppState'; import { useMemo } from 'react'; @@ -18,15 +18,18 @@ import { safelyParseFormattedHtml, } from '@/utility/html'; import { clsx } from 'clsx/lite'; -import { Recipes, sortRecipesWithCount } from '@/recipe'; +import { sortRecipesWithCount } from '@/recipe'; import PhotoRecipe from '@/recipe/PhotoRecipe'; import IconCamera from '@/components/icons/IconCamera'; import IconRecipe from '@/components/icons/IconRecipe'; import IconTag from '@/components/icons/IconTag'; import IconFilmSimulation from '@/components/icons/IconFilmSimulation'; import IconLens from '@/components/icons/IconLens'; -import { Lenses, sortLensesWithCount } from '@/lens'; +import { sortLensesWithCount } from '@/lens'; import PhotoLens from '@/lens/PhotoLens'; +import IconFocalLength from '@/components/icons/IconFocalLength'; +import { PhotoSetCategories } from '@/category'; +import PhotoFocalLength from '@/focal/PhotoFocalLength'; export default function PhotoGridSidebar({ cameras, @@ -34,14 +37,10 @@ export default function PhotoGridSidebar({ tags, simulations, recipes, + focalLengths, photosCount, photosDateRange, -}: { - tags: Tags - lenses: Lenses - cameras: Cameras - simulations: FilmSimulations - recipes: Recipes +}: PhotoSetCategories & { photosCount: number photosDateRange?: PhotoDateRange }) { @@ -177,6 +176,22 @@ export default function PhotoGridSidebar({ /> : null; + const focalLengthsContent = focalLengths.length > 0 + ? } + items={focalLengths.map(({ focal, count }) => + )} + /> + : null; + const photoStatsContent = photosCount > 0 ? start ? } {CATEGORY_VISIBILITY.map(category => { switch (category) { - case 'tags': return tagsContent; case 'cameras': return camerasContent; case 'lenses': return lensesContent; + case 'tags': return tagsContent; case 'recipes': return recipesContent; case 'films': return filmsContent; + case 'focal-lengths': return focalLengthsContent; } })} {photoStatsContent} diff --git a/src/photo/data.ts b/src/photo/data.ts index caa15e20..ea6bb308 100644 --- a/src/photo/data.ts +++ b/src/photo/data.ts @@ -1,6 +1,7 @@ import { getUniqueCamerasCached, getUniqueFilmSimulationsCached, + getUniqueFocalLengthsCached, getUniqueLensesCached, getUniqueRecipesCached, getUniqueTagsCached, @@ -8,23 +9,26 @@ import { import { getUniqueCameras, getUniqueFilmSimulations, + getUniqueFocalLengths, getUniqueLenses, getUniqueRecipes, getUniqueTags, } from '@/photo/db/query'; -import { SHOW_FILM_SIMULATIONS, SHOW_LENSES, SHOW_RECIPES } from '@/app/config'; +import { + SHOW_FILM_SIMULATIONS, + SHOW_FOCAL_LENGTHS, + SHOW_LENSES, + SHOW_RECIPES, +} from '@/app/config'; import { sortTagsObject } from '@/tag'; export const getPhotoSidebarData = () => [ getUniqueCameras().catch(() => []), SHOW_LENSES ? getUniqueLenses().catch(() => []) : [], getUniqueTags().then(sortTagsObject).catch(() => []), - SHOW_FILM_SIMULATIONS - ? getUniqueFilmSimulations().catch(() => []) - : [], - SHOW_RECIPES - ? getUniqueRecipes().catch(() => []) - : [], + SHOW_FILM_SIMULATIONS ? getUniqueFilmSimulations().catch(() => []) : [], + SHOW_RECIPES ? getUniqueRecipes().catch(() => []) : [], + SHOW_FOCAL_LENGTHS ? getUniqueFocalLengths().catch(() => []) : [], ] as const; export const getPhotoSidebarDataCached = () => [ @@ -33,4 +37,5 @@ export const getPhotoSidebarDataCached = () => [ getUniqueTagsCached().then(sortTagsObject), SHOW_FILM_SIMULATIONS ? getUniqueFilmSimulationsCached() : [], SHOW_RECIPES ? getUniqueRecipesCached() : [], + SHOW_FOCAL_LENGTHS ? getUniqueFocalLengthsCached() : [], ] as const;