Add zoom control prop to <PhotoLarge /> for potential future use

This commit is contained in:
Sam Becker 2025-01-26 14:36:16 -06:00
parent 8d972157a3
commit a9e0db8392
2 changed files with 7 additions and 5 deletions

View File

@ -110,7 +110,6 @@ export default function PhotoDetailPage({
shouldShareTag={tag !== undefined} shouldShareTag={tag !== undefined}
shouldShareCamera={camera !== undefined} shouldShareCamera={camera !== undefined}
shouldShareSimulation={simulation !== undefined} shouldShareSimulation={simulation !== undefined}
shouldScrollOnShare={false}
includeFavoriteInAdminMenu={includeFavoriteInAdminMenu} includeFavoriteInAdminMenu={includeFavoriteInAdminMenu}
/>, />,
]} ]}

View File

@ -52,6 +52,7 @@ export default function PhotoLarge({
showTitleAsH1, showTitleAsH1,
showCamera = true, showCamera = true,
showSimulation = true, showSimulation = true,
showZoomControls: showZoomControlsProp = true,
shouldShare = true, shouldShare = true,
shouldShareTag, shouldShareTag,
shouldShareCamera, shouldShareCamera,
@ -71,12 +72,12 @@ export default function PhotoLarge({
showTitleAsH1?: boolean showTitleAsH1?: boolean
showCamera?: boolean showCamera?: boolean
showSimulation?: boolean showSimulation?: boolean
showZoomControls?: boolean
shouldShare?: boolean shouldShare?: boolean
shouldShareTag?: boolean shouldShareTag?: boolean
shouldShareCamera?: boolean shouldShareCamera?: boolean
shouldShareSimulation?: boolean shouldShareSimulation?: boolean
shouldShareFocalLength?: boolean shouldShareFocalLength?: boolean
shouldScrollOnShare?: boolean
includeFavoriteInAdminMenu?: boolean includeFavoriteInAdminMenu?: boolean
onVisible?: () => void onVisible?: () => void
}) { }) {
@ -89,6 +90,8 @@ export default function PhotoLarge({
isUserSignedIn, isUserSignedIn,
} = useAppState(); } = useAppState();
const showZoomControls = showZoomControlsProp && areZoomControlsEnabled;
const tags = sortTags(photo.tags, primaryTag); const tags = sortTags(photo.tags, primaryTag);
const camera = cameraFromPhoto(photo); const camera = cameraFromPhoto(photo);
@ -101,7 +104,7 @@ export default function PhotoLarge({
const { open } = useImageZoomControls( const { open } = useImageZoomControls(
refZoomControlsContainer, refZoomControlsContainer,
areZoomControlsEnabled, showZoomControls,
); );
const hasTitle = const hasTitle =
@ -158,7 +161,7 @@ export default function PhotoLarge({
)}> )}>
<div <div
ref={refZoomControlsContainer} ref={refZoomControlsContainer}
className={clsx(areZoomControlsEnabled && 'cursor-zoom-in')} className={clsx(showZoomControls && 'cursor-zoom-in')}
> >
<ImageLarge <ImageLarge
className={clsx(arePhotosMatted && 'h-full')} className={clsx(arePhotosMatted && 'h-full')}
@ -299,7 +302,7 @@ export default function PhotoLarge({
focal={shouldShareFocalLength ? photo.focalLength : undefined} focal={shouldShareFocalLength ? photo.focalLength : undefined}
prefetch={prefetchRelatedLinks} prefetch={prefetchRelatedLinks}
/>} />}
{areZoomControlsEnabled && {showZoomControls &&
<LoaderButton <LoaderButton
title="Open Image Viewer" title="Open Image Viewer"
icon={<LuZoomIn size={17} />} icon={<LuZoomIn size={17} />}