Add zoom control prop to <PhotoLarge /> for potential future use
This commit is contained in:
parent
8d972157a3
commit
a9e0db8392
@ -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}
|
||||||
/>,
|
/>,
|
||||||
]}
|
]}
|
||||||
|
|||||||
@ -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} />}
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user