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

moved out image grid components

Browse source
This commit is contained in:
Fedor Katurov 2019-10-16 15:40:39 +07:00
parent a957281d01
commit 5872e7a457
6 changed files with 69 additions and 64 deletions
Download patch file Download diff file Expand all files Collapse all files

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

@ -1,15 +1,12 @@
import React, { FC, useCallback } from 'react';
import { SortableContainer, SortableElement, SortEvent, SortEnd } from 'react-sortable-hoc';
import { SortEnd } from 'react-sortable-hoc';
import * as styles from './styles.scss';
import { ImageUpload } from '~/components/upload/ImageUpload';
import { IFile, INode } from '~/redux/types';
import { IUploadStatus } from '~/redux/uploads/reducer';
import { getURL } from '~/utils/dom';
import assocPath from 'ramda/es/assocPath';
import { moveArrItem } from '~/utils/fn';
import omit from 'ramda/es/omit';
import remove from 'ramda/es/remove';
import reject from 'ramda/es/reject';
import { SortableImageGrid } from '~/components/editors/SortableImageGrid';
interface IProps {
data: INode;
@ -17,38 +14,6 @@ interface IProps {
locked: IUploadStatus[];
}
const SortableImageGridItem = SortableElement(({ children }) => (
<div className={styles.item}>{children}</div>
));
const SortableImageGrid = SortableContainer(
({
items,
locked,
onDrop,
}: {
items: IFile[];
locked: IUploadStatus[];
onDrop: (file_id: IFile['id']) => void;
}) => (
<div className={styles.grid}>
{items
.filter(file => file && file.id)
.map((file, index) => (
<SortableImageGridItem key={file.id} index={index} collection={0}>
<ImageUpload id={file.id} thumb={getURL(file)} onDrop={onDrop} />
</SortableImageGridItem>
))}
{locked.map((item, index) => (
<SortableImageGridItem key={item.temp_id} index={index} collection={1} disabled>
<ImageUpload thumb={item.preview} progress={item.progress} is_uploading />
</SortableImageGridItem>
))}
</div>
)
);
const ImageGrid: FC<IProps> = ({ data, setData, locked }) => {
const onMove = useCallback(
({ oldIndex, newIndex }: SortEnd) => {