diff --git a/src/photo/PhotoLarge.tsx b/src/photo/PhotoLarge.tsx index 3656e3a9..048f10c6 100644 --- a/src/photo/PhotoLarge.tsx +++ b/src/photo/PhotoLarge.tsx @@ -6,6 +6,7 @@ import { doesPhotoNeedBlurCompatibility, shouldShowCameraDataForPhoto, shouldShowExifDataForPhoto, + shouldShowFilmSimulationDataForPhoto, shouldShowLensDataForPhoto, shouldShowRecipeDataForPhoto, titleForPhoto, @@ -134,9 +135,11 @@ export default function PhotoLarge({ const showCameraContent = showCamera && shouldShowCameraDataForPhoto(photo); const showLensContent = showLens && shouldShowLensDataForPhoto(photo); + const showTagsContent = tags.length > 0; const showRecipeContent = showRecipe && shouldShowRecipeDataForPhoto(photo); const showRecipeButton = shouldShowRecipeDataForPhoto(photo); - const showTagsContent = tags.length > 0; + const showSimulationContent = showSimulation && + shouldShowFilmSimulationDataForPhoto(photo); useVisible({ ref, onVisible }); @@ -153,6 +156,7 @@ export default function PhotoLarge({ showLensContent || showTagsContent || showRecipeContent || + showSimulationContent || showExifContent; const hasNonDateContent = @@ -358,9 +362,9 @@ export default function PhotoLarge({
  • {photo.isoFormatted}
  • {photo.exposureCompensationFormatted ?? '0ev'}
  • - {(showSimulation || showRecipeButton) && + {(showRecipeButton || showSimulationContent) &&
    - {showSimulation && photo.filmSimulation && + {showSimulationContent && photo.filmSimulation && @@ -276,7 +277,7 @@ export const dateRangeForPhotos = ( let descriptionWithSpaces = ''; if (explicitDateRange || photos.length > 0) { - const photosSorted = sortPhotosByDate(photos); + const photosSorted = sortPhotosByDateNonDestructively(photos); start = formatDateFromPostgresString( explicitDateRange?.start ?? photosSorted[photos.length - 1].takenAtNaive, 'short', @@ -328,6 +329,11 @@ export const shouldShowRecipeDataForPhoto = (photo: Photo) => SHOW_RECIPES && photoHasRecipeData(photo); +export const shouldShowFilmSimulationDataForPhoto = (photo: Photo) => + SHOW_EXIF_DATA && + SHOW_FILM_SIMULATIONS && + photoHasFilmSimulationData(photo); + export const shouldShowExifDataForPhoto = (photo: Photo) => SHOW_EXIF_DATA && photoHasExifData(photo); diff --git a/src/simulation/index.ts b/src/simulation/index.ts index a370083d..a1eb7876 100644 --- a/src/simulation/index.ts +++ b/src/simulation/index.ts @@ -79,3 +79,6 @@ export const generateMetaForFilmSimulation = ( ), images: absolutePathForFilmSimulationImage(simulation), }); + +export const photoHasFilmSimulationData = (photo: Photo) => + Boolean(photo.filmSimulation); diff --git a/src/utility/useScrollDirection.ts b/src/utility/useScrollDirection.ts index 46ce7fa8..98cbcab0 100644 --- a/src/utility/useScrollDirection.ts +++ b/src/utility/useScrollDirection.ts @@ -2,7 +2,7 @@ import { useEffect, useState } from 'react'; export default function useScrollDirection() { const [lastScrollY, setLastScrollY] = useState(0); - const [scrollDirection, setScrollDirection] = useState<'up' | 'down'>('up'); + const [scrollDirection, setScrollDirection] = useState<'up' | 'down'>('down'); useEffect(() => { const handleScroll = () => {