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

refactored code

Browse source
This commit is contained in:
Fedor Katurov 2019-10-16 15:47:52 +07:00
parent 5872e7a457
commit 265b075ddc
2 changed files with 14 additions and 14 deletions
Download patch file Download diff file Expand all files Collapse all files

8
src/components/editors/ImageEditor/index.tsx
View file

@ -1,6 +1,6 @@
import React, { FC, useMemo } from 'react'; import React, { FC, useMemo, useCallback } from 'react';
import { connect } from 'react-redux'; import { connect } from 'react-redux';
import { INode } from '~/redux/types'; import { INode, IFile } from '~/redux/types';
import * as UPLOAD_ACTIONS from '~/redux/uploads/actions'; import * as UPLOAD_ACTIONS from '~/redux/uploads/actions';
import { selectUploads } from '~/redux/uploads/selectors'; import { selectUploads } from '~/redux/uploads/selectors';
import { ImageGrid } from '~/components/editors/ImageGrid'; import { ImageGrid } from '~/components/editors/ImageGrid';
@ -24,7 +24,9 @@ const ImageEditorUnconnected: FC<IProps> = ({ data, setData, temp, statuses }) =
statuses, statuses,
]); ]);
return <ImageGrid data={data} setData={setData} locked={pending_files} />; const setFiles = useCallback((files: IFile[]) => setData({ ...data, files }), [data, setData]);
return <ImageGrid files={data.files} setFiles={setFiles} locked={pending_files} />;
}; };
const ImageEditor = connect( const ImageEditor = connect(

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

@ -9,26 +9,24 @@ import reject from 'ramda/es/reject';
import { SortableImageGrid } from '~/components/editors/SortableImageGrid'; import { SortableImageGrid } from '~/components/editors/SortableImageGrid';
interface IProps { interface IProps {
data: INode; files: IFile[];
setData: (val: INode) => void; setFiles: (val: IFile[]) => void;
locked: IUploadStatus[]; locked: IUploadStatus[];
} }
const ImageGrid: FC<IProps> = ({ data, setData, locked }) => { const ImageGrid: FC<IProps> = ({ files, setFiles, locked }) => {
const onMove = useCallback( const onMove = useCallback(
({ oldIndex, newIndex }: SortEnd) => { ({ oldIndex, newIndex }: SortEnd) => {
setData(assocPath(['files'], moveArrItem(oldIndex, newIndex, data.files), data)); setFiles(moveArrItem(oldIndex, newIndex, files) as IFile[]);
}, },
[data, setData] [setFiles, files]
); );
const onDrop = useCallback( const onDrop = useCallback(
(file_id: IFile['id']) => { (remove_id: IFile['id']) => {
setData( setFiles(files.filter(file => file.id === remove_id));
assocPath(['files'], reject(el => !el || !el.id || el.id === file_id, data.files), data)
);
}, },
[setData, data] [setFiles, files]
); );
return ( return (
@ -36,7 +34,7 @@ const ImageGrid: FC<IProps> = ({ data, setData, locked }) => {
onDrop={onDrop} onDrop={onDrop}
onSortEnd={onMove} onSortEnd={onMove}
axis="xy" axis="xy"
items={data.files} items={files}
locked={locked} locked={locked}
pressDelay={window.innerWidth < 768 ? 200 : 0} pressDelay={window.innerWidth < 768 ? 200 : 0}
helperClass={styles.helper} helperClass={styles.helper}