muerwre/vault-frontend
1
0
Fork 0
mirror of https://github.com/muerwre/vault-frontend.git synced 2025-04-25 04:46:40 +07:00
Code Packages Activity Actions

fixed mobile appearance of dialogs

Browse source
This commit is contained in:
Fedor Katurov 2022-07-14 13:26:53 +07:00
parent 4483d7a0f5
commit 042f238590
8 changed files with 25 additions and 19 deletions
Download patch file Download diff file Expand all files Collapse all files

9
src/containers/dialogs/PhotoSwipe/index.tsx
View file

@ -6,6 +6,7 @@ import PhotoSwipeUI_Default from 'photoswipe/dist/photoswipe-ui-default.js';
import PhotoSwipeJs from 'photoswipe/dist/photoswipe.js';
import { ImagePresets } from '~/constants/urls';
import { useWindowSize } from '~/hooks/dom/useWindowSize';
import { useModal } from '~/hooks/modal/useModal';
import { IFile } from '~/types';
import { DialogComponentProps } from '~/types/modal';
@ -21,6 +22,7 @@ export interface PhotoSwipeProps extends DialogComponentProps {
const PhotoSwipe: VFC<PhotoSwipeProps> = observer(({ index, items }) => {
let ref = useRef<HTMLDivElement>(null);
const { hideModal } = useModal();
const { isMobile } = useWindowSize();
useEffect(() => {
new Promise(async resolve => {
@ -32,10 +34,7 @@ const PhotoSwipe: VFC<PhotoSwipeProps> = observer(({ index, items }) => {
img.onload = () => {
resolveImage({
src: getURL(
image,
window.innerWidth < 768 ? ImagePresets[900] : ImagePresets[1600]
),
src: getURL(image, isMobile ? ImagePresets[900] : ImagePresets[1600]),
h: img.naturalHeight,
w: img.naturalWidth,
});
@ -62,7 +61,7 @@ const PhotoSwipe: VFC<PhotoSwipeProps> = observer(({ index, items }) => {
ps.listen('destroy', hideModal);
ps.listen('close', hideModal);
});
}, [hideModal, items, index]);
}, [hideModal, items, index, isMobile]);
return (
<div className="pswp" tabIndex={-1} role="dialog" aria-hidden="true" ref={ref}>