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

added dnd-kit for images

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

View file

@ -3,7 +3,7 @@ import React, { FC, useCallback } from 'react';
import { SortEnd } from 'react-sortable-hoc';
import { SortableAudioGrid } from '~/components/editors/SortableAudioGrid';
import { SortableImageGrid } from '~/components/editors/SortableImageGrid';
import { OnSortEnd, SortableImageGrid } from '~/components/editors/SortableImageGrid';
import { COMMENT_FILE_TYPES } from '~/constants/uploads';
import { useFileDropZone } from '~/hooks';
import { IFile } from '~/types';
@ -29,8 +29,8 @@ const CommentFormAttaches: FC = () => {
const hasAudioAttaches = filesAudios.length > 0 || pendingAudios.length > 0;
const hasAttaches = hasImageAttaches || hasAudioAttaches;
const onImageMove = useCallback(
({ oldIndex, newIndex }: SortEnd) => {
const onImageMove = useCallback<OnSortEnd>(
({ oldIndex, newIndex }) => {
setFiles([
...filesAudios,
...(moveArrItem(
@ -83,12 +83,8 @@ const CommentFormAttaches: FC = () => {
<SortableImageGrid
onDelete={onFileDelete}
onSortEnd={onImageMove}
axis="xy"
items={filesImages}
locked={pendingImages}
pressDelay={50}
helperClass={styles.helper}
size={120}
/>
)}