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

added lazy loading to NodeImageSwiperBlock

Browse source
This commit is contained in:
Fedor Katurov 2022-12-06 21:00:37 +06:00
parent 991f829216
commit 10bb6f01b5
17 changed files with 210 additions and 106 deletions
Download patch file Download diff file Expand all files Collapse all files

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

@ -5,7 +5,7 @@ import { observer } from 'mobx-react-lite';
import PhotoSwipeUI_Default from 'photoswipe/dist/photoswipe-ui-default.js';
import PhotoSwipeJs from 'photoswipe/dist/photoswipe.js';
import { ImagePresets } from '~/constants/urls';
import { imagePresets } from '~/constants/urls';
import { useWindowSize } from '~/hooks/dom/useWindowSize';
import { useModal } from '~/hooks/modal/useModal';
import { IFile } from '~/types';
@ -25,18 +25,18 @@ const PhotoSwipe: VFC<PhotoSwipeProps> = observer(({ index, items }) => {
const { isTablet } = useWindowSize();
useEffect(() => {
new Promise(async resolve => {
new Promise(async (resolve) => {
const images = await Promise.all(
items.map(
image =>
new Promise(resolveImage => {
(image) =>
new Promise((resolveImage) => {
const img = new Image();
img.onload = () => {
resolveImage({
src: getURL(
image,
isTablet ? ImagePresets[900] : ImagePresets[1600],
isTablet ? imagePresets[900] : imagePresets[1600],
),
h: img.naturalHeight,
w: img.naturalWidth,
@ -47,13 +47,13 @@ const PhotoSwipe: VFC<PhotoSwipeProps> = observer(({ index, items }) => {
resolveImage({});
};
img.src = getURL(image, ImagePresets[1600]);
img.src = getURL(image, imagePresets[1600]);
}),
),
);
resolve(images);
}).then(images => {
}).then((images) => {
const ps = new PhotoSwipeJs(ref.current, PhotoSwipeUI_Default, images, {
index: index || 0,
closeOnScroll: false,