removed upload redux store

src/components/editors/AudioEditor/index.tsx

@@ -1,5 +1,5 @@
 import React, { FC, useCallback, useMemo } from 'react';
-import { UPLOAD_TYPES } from '~/redux/uploads/constants';
+import { UploadType } from '~/constants/uploads';
 import { ImageGrid } from '../ImageGrid';
 import { AudioGrid } from '../AudioGrid';
 import styles from './styles.module.scss';
@@ -7,25 +7,28 @@ import { NodeEditorProps } from '~/types/node';
 import { useNodeImages } from '~/hooks/node/useNodeImages';
 import { useNodeAudios } from '~/hooks/node/useNodeAudios';
 import { useNodeFormContext } from '~/hooks/node/useNodeFormFormik';
-import { useFileUploaderContext } from '~/hooks/data/useFileUploader';
 import { UploadDropzone } from '~/components/upload/UploadDropzone';
+import { useUploaderContext } from '~/utils/context/UploaderContextProvider';
+import { values } from 'ramda';
 
 type IProps = NodeEditorProps;
 
 const AudioEditor: FC<IProps> = () => {
-  const { values } = useNodeFormContext();
-  const { pending, setFiles, uploadFiles } = useFileUploaderContext()!;
+  const formik = useNodeFormContext();
+  const { pending, setFiles, uploadFiles } = useUploaderContext()!;
 
-  const images = useNodeImages(values);
-  const audios = useNodeAudios(values);
+  const images = useNodeImages(formik.values);
+  const audios = useNodeAudios(formik.values);
 
-  const pendingImages = useMemo(() => pending.filter(item => item.type === UPLOAD_TYPES.IMAGE), [
-    pending,
-  ]);
+  const pendingImages = useMemo(
+    () => values(pending).filter(item => item.type === UploadType.Image),
+    [pending]
+  );
 
-  const pendingAudios = useMemo(() => pending.filter(item => item.type === UPLOAD_TYPES.AUDIO), [
-    pending,
-  ]);
+  const pendingAudios = useMemo(
+    () => values(pending).filter(item => item.type === UploadType.Audio),
+    [pending]
+  );
 
   const setImages = useCallback(values => setFiles([...values, ...audios]), [setFiles, audios]);
 

src/components/editors/AudioGrid/index.tsx

@@ -1,16 +1,16 @@
 import React, { FC, useCallback } from 'react';
 import { SortEnd } from 'react-sortable-hoc';
 import { IFile } from '~/redux/types';
-import { IUploadStatus } from '~/redux/uploads/reducer';
 import { moveArrItem } from '~/utils/fn';
 import { SortableAudioGrid } from '~/components/editors/SortableAudioGrid';
 
 import styles from './styles.module.scss';
+import { UploadStatus } from '~/store/uploader/UploaderStore';
 
 interface IProps {
   files: IFile[];
   setFiles: (val: IFile[]) => void;
-  locked: IUploadStatus[];
+  locked: UploadStatus[];
 }
 
 const AudioGrid: FC<IProps> = ({ files, setFiles, locked }) => {

src/components/editors/EditorAudioUploadButton/index.tsx

@@ -1,6 +1,6 @@
 import React, { FC } from 'react';
 import { EditorUploadButton } from '~/components/editors/EditorUploadButton';
-import { UPLOAD_TYPES } from '~/redux/uploads/constants';
+import { UploadType } from '~/constants/uploads';
 import { IEditorComponentProps } from '~/types/node';
 
 type IProps = IEditorComponentProps & {};
@@ -9,7 +9,7 @@ const EditorAudioUploadButton: FC<IProps> = () => (
   <EditorUploadButton
     accept="audio/*"
     icon="audio"
-    type={UPLOAD_TYPES.AUDIO}
+    type={UploadType.Audio}
     label="Добавить аудио"
   />
 );

src/components/editors/EditorImageUploadButton/index.tsx

@@ -1,6 +1,6 @@
 import React, { FC } from 'react';
 import { EditorUploadButton } from '~/components/editors/EditorUploadButton';
-import { UPLOAD_TYPES } from '~/redux/uploads/constants';
+import { UploadType } from '~/constants/uploads';
 import { IEditorComponentProps } from '~/types/node';
 
 type IProps = IEditorComponentProps & {};
@@ -9,7 +9,7 @@ const EditorImageUploadButton: FC<IProps> = () => (
   <EditorUploadButton
     accept="image/*"
     icon="image"
-    type={UPLOAD_TYPES.IMAGE}
+    type={UploadType.Image}
     label="Добавить фоточек"
   />
 );

src/components/editors/EditorUploadButton/index.tsx

@@ -1,27 +1,27 @@
 import React, { ChangeEvent, FC, useCallback } from 'react';
 import styles from './styles.module.scss';
 import { Icon } from '~/components/input/Icon';
-import { UPLOAD_TYPES } from '~/redux/uploads/constants';
+import { UploadType } from '~/constants/uploads';
 import { IEditorComponentProps } from '~/types/node';
-import { useFileUploaderContext } from '~/hooks/data/useFileUploader';
 import { getFileType } from '~/utils/uploader';
 import { useNodeFormContext } from '~/hooks/node/useNodeFormFormik';
 import { Button } from '~/components/input/Button';
+import { useUploaderContext } from '~/utils/context/UploaderContextProvider';
 
 type IProps = IEditorComponentProps & {
   accept?: string;
   icon?: string;
-  type?: typeof UPLOAD_TYPES[keyof typeof UPLOAD_TYPES];
+  type?: UploadType;
   label?: string;
 };
 
 const EditorUploadButton: FC<IProps> = ({
   accept = 'image/*',
   icon = 'plus',
-  type = UPLOAD_TYPES.IMAGE,
+  type = UploadType.Image,
   label,
 }) => {
-  const { uploadFiles } = useFileUploaderContext()!;
+  const { uploadFiles } = useUploaderContext()!;
   const { values } = useNodeFormContext();
 
   const onInputChange = useCallback(

src/components/editors/EditorUploadCoverButton/index.tsx

@@ -1,23 +1,26 @@
 import React, { ChangeEvent, FC, useCallback, useEffect } from 'react';
 import styles from './styles.module.scss';
-import { UPLOAD_SUBJECTS, UPLOAD_TARGETS, UPLOAD_TYPES } from '~/redux/uploads/constants';
-import { path } from 'ramda';
+import { UploadSubject, UploadTarget, UploadType } from '~/constants/uploads';
 import { getURL } from '~/utils/dom';
 import { Icon } from '~/components/input/Icon';
 import { PRESETS } from '~/constants/urls';
 import { IEditorComponentProps } from '~/types/node';
-import { useFileUploader } from '~/hooks/data/useFileUploader';
 import { useNodeFormContext } from '~/hooks/node/useNodeFormFormik';
 import { getFileType } from '~/utils/uploader';
+import { useUploader } from '~/hooks/data/useUploader';
 
 type IProps = IEditorComponentProps & {};
 
 const EditorUploadCoverButton: FC<IProps> = ({}) => {
   const { values, setFieldValue } = useNodeFormContext();
-  const { uploadFiles, files } = useFileUploader(UPLOAD_SUBJECTS.EDITOR, UPLOAD_TARGETS.NODES, []);
+  const { uploadFiles, files, pendingImages } = useUploader(
+    UploadSubject.Editor,
+    UploadTarget.Nodes,
+    []
+  );
 
   const background = values.cover ? getURL(values.cover, PRESETS['300']) : null;
-  const preview = status && path(['preview'], status);
+  const preview = pendingImages?.[0]?.thumbnail || '';
 
   const onDropCover = useCallback(() => {
     setFieldValue('cover', null);
@@ -26,7 +29,7 @@ const EditorUploadCoverButton: FC<IProps> = ({}) => {
   const onInputChange = useCallback(
     (event: ChangeEvent<HTMLInputElement>) => {
       const files = Array.from(event.target.files || [])
-        .filter(file => getFileType(file) === UPLOAD_TYPES.IMAGE)
+        .filter(file => getFileType(file) === UploadType.Image)
         .slice(0, 1);
 
       uploadFiles(files);

src/components/editors/ImageEditor/index.tsx

@@ -2,18 +2,19 @@ import React, { FC } from 'react';
 import { ImageGrid } from '~/components/editors/ImageGrid';
 import styles from './styles.module.scss';
 import { NodeEditorProps } from '~/types/node';
-import { useFileUploaderContext } from '~/hooks/data/useFileUploader';
 import { UploadDropzone } from '~/components/upload/UploadDropzone';
+import { useUploaderContext } from '~/utils/context/UploaderContextProvider';
+import { values } from 'ramda';
 
 type IProps = NodeEditorProps;
 
 const ImageEditor: FC<IProps> = () => {
-  const { pending, files, setFiles, uploadFiles } = useFileUploaderContext()!;
+  const { pending, files, setFiles, uploadFiles } = useUploaderContext()!;
 
   return (
     <UploadDropzone onUpload={uploadFiles} helperClassName={styles.dropzone}>
       <div className={styles.wrap}>
-        <ImageGrid files={files} setFiles={setFiles} locked={pending} />
+        <ImageGrid files={files} setFiles={setFiles} locked={values(pending)} />
       </div>
     </UploadDropzone>
   );

src/components/editors/ImageGrid/index.tsx

@@ -2,14 +2,14 @@ import React, { FC, useCallback } from 'react';
 import { SortEnd } from 'react-sortable-hoc';
 import styles from './styles.module.scss';
 import { IFile } from '~/redux/types';
-import { IUploadStatus } from '~/redux/uploads/reducer';
 import { moveArrItem } from '~/utils/fn';
 import { SortableImageGrid } from '~/components/editors/SortableImageGrid';
+import { UploadStatus } from '~/store/uploader/UploaderStore';
 
 interface IProps {
   files: IFile[];
   setFiles: (val: IFile[]) => void;
-  locked: IUploadStatus[];
+  locked: UploadStatus[];
 }
 
 const ImageGrid: FC<IProps> = ({ files, setFiles, locked }) => {

src/components/editors/SortableAudioGrid/index.tsx

@@ -4,8 +4,8 @@ import { AudioUpload } from '~/components/upload/AudioUpload';
 import styles from './styles.module.scss';
 import { SortableAudioGridItem } from '~/components/editors/SortableAudioGridItem';
 import { IFile } from '~/redux/types';
-import { IUploadStatus } from '~/redux/uploads/reducer';
 import { AudioPlayer } from '~/components/media/AudioPlayer';
+import { UploadStatus } from '~/store/uploader/UploaderStore';
 
 const SortableAudioGrid = SortableContainer(
   ({
@@ -15,7 +15,7 @@ const SortableAudioGrid = SortableContainer(
     onTitleChange,
   }: {
     items: IFile[];
-    locked: IUploadStatus[];
+    locked: UploadStatus[];
     onDelete: (file_id: IFile['id']) => void;
     onTitleChange: (file_id: IFile['id'], title: string) => void;
   }) => {
@@ -35,7 +35,7 @@ const SortableAudioGrid = SortableContainer(
           ))}
 
         {locked.map((item, index) => (
-          <SortableAudioGridItem key={item.temp_id} index={index} collection={1} disabled>
+          <SortableAudioGridItem key={item.id} index={index} collection={1} disabled>
             <AudioUpload title={item.name} progress={item.progress} is_uploading />
           </SortableAudioGridItem>
         ))}

src/components/editors/SortableImageGrid/index.tsx

@@ -4,10 +4,10 @@ import { ImageUpload } from '~/components/upload/ImageUpload';
 import styles from './styles.module.scss';
 import { SortableImageGridItem } from '~/components/editors/SortableImageGridItem';
 import { IFile } from '~/redux/types';
-import { IUploadStatus } from '~/redux/uploads/reducer';
 import { getURL } from '~/utils/dom';
 import { PRESETS } from '~/constants/urls';
 import classNames from 'classnames';
+import { UploadStatus } from '~/store/uploader/UploaderStore';
 
 const SortableImageGrid = SortableContainer(
   ({
@@ -17,7 +17,7 @@ const SortableImageGrid = SortableContainer(
     className,
   }: {
     items: IFile[];
-    locked: IUploadStatus[];
+    locked: UploadStatus[];
     onDelete: (file_id: IFile['id']) => void;
     size?: number;
     className?: string;
@@ -35,8 +35,8 @@ const SortableImageGrid = SortableContainer(
           ))}
 
         {locked.map((item, index) => (
-          <SortableImageGridItem key={item.temp_id} index={index} collection={1} disabled>
-            <ImageUpload thumb={item.preview} progress={item.progress} is_uploading />
+          <SortableImageGridItem key={item.id} index={index} collection={1} disabled>
+            <ImageUpload thumb={item.thumbnail} progress={item.progress} is_uploading />
           </SortableImageGridItem>
         ))}
       </div>