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

added dnd-kit for images

Browse source
This commit is contained in:
Fedor Katurov 2022-06-20 21:50:09 +07:00
parent a811951a63
commit dc1d66cec6
10 changed files with 227 additions and 77 deletions
Download patch file Download diff file Expand all files Collapse all files

18
src/components/editors/ImageGrid/index.tsx
View file

@ -2,7 +2,7 @@ import React, { FC, useCallback } from 'react';
import { SortEnd } from 'react-sortable-hoc';
import { SortableImageGrid } from '~/components/editors/SortableImageGrid';
import { OnSortEnd, SortableImageGrid } from '~/components/editors/SortableImageGrid';
import { useWindowSize } from '~/hooks/dom/useWindowSize';
import { UploadStatus } from '~/store/uploader/UploaderStore';
import { IFile } from '~/types';
@ -19,8 +19,8 @@ interface IProps {
const ImageGrid: FC<IProps> = ({ files, setFiles, locked }) => {
const { innerWidth } = useWindowSize();
const onMove = useCallback(
({ oldIndex, newIndex }: SortEnd) => {
const onMove = useCallback<OnSortEnd>(
({ oldIndex, newIndex }) => {
setFiles(
moveArrItem(
oldIndex,
@ -39,17 +39,7 @@ const ImageGrid: FC<IProps> = ({ files, setFiles, locked }) => {
[setFiles, files]
);
return (
<SortableImageGrid
onDelete={onDrop}
onSortEnd={onMove}
axis="xy"
items={files}
locked={locked}
pressDelay={innerWidth < 768 ? 200 : 0}
helperClass={styles.helper}
/>
);
return <SortableImageGrid onDelete={onDrop} onSortEnd={onMove} items={files} locked={locked} />;
};
export { ImageGrid };