From 63b97819777c2dfda3002c1226c39f831bbf14b3 Mon Sep 17 00:00:00 2001
From: Fedor Katurov <gotham48@gmail.com>
Date: Mon, 9 Nov 2020 17:58:37 +0700
Subject: [PATCH] fixed unsupported files uploading

---
 src/components/comment/CommentForm/index.tsx        | 11 +++--------
 src/components/comment/CommentFormButtons/index.tsx | 12 ++++++++----
 2 files changed, 11 insertions(+), 12 deletions(-)

diff --git a/src/components/comment/CommentForm/index.tsx b/src/components/comment/CommentForm/index.tsx
index 1463f757..a7ff6c2f 100644
--- a/src/components/comment/CommentForm/index.tsx
+++ b/src/components/comment/CommentForm/index.tsx
@@ -4,7 +4,7 @@ import styles from './styles.module.scss';
 import { Filler } from '~/components/containers/Filler';
 import { Button } from '~/components/input/Button';
 import assocPath from 'ramda/es/assocPath';
-import { IComment, IFile, IFileWithUUID, InputHandler } from '~/redux/types';
+import { IComment, IFileWithUUID, InputHandler } from '~/redux/types';
 import { connect } from 'react-redux';
 import * as NODE_ACTIONS from '~/redux/node/actions';
 import { selectNode } from '~/redux/node/selectors';
@@ -16,15 +16,10 @@ import * as UPLOAD_ACTIONS from '~/redux/uploads/actions';
 import { selectUploads } from '~/redux/uploads/selectors';
 import { IState } from '~/redux/store';
 import { getFileType } from '~/utils/uploader';
-import { ButtonGroup } from '~/components/input/ButtonGroup';
-import { SortableImageGrid } from '~/components/editors/SortableImageGrid';
-import { moveArrItem } from '~/utils/fn';
-import { SortEnd } from 'react-sortable-hoc';
-import { SortableAudioGrid } from '~/components/editors/SortableAudioGrid';
 import { getRandomPhrase } from '~/constants/phrases';
 import { ERROR_LITERAL } from '~/constants/errors';
 import { CommentFormAttaches } from '~/components/comment/CommentFormAttaches';
-import { CommentFormButtons } from '~/components/comment/CommentFormButtons';
+import { CommentFormAttachButtons } from '~/components/comment/CommentFormButtons';
 
 const mapStateToProps = (state: IState) => ({
   node: selectNode(state),
@@ -205,7 +200,7 @@ const CommentFormUnconnected: FC<IProps> = memo(
         />
 
         <Group horizontal className={styles.buttons}>
-          <CommentFormButtons onUpload={onUpload} />
+          <CommentFormAttachButtons onUpload={onUpload} />
 
           <Filler />
 
diff --git a/src/components/comment/CommentFormButtons/index.tsx b/src/components/comment/CommentFormButtons/index.tsx
index 44761ac7..230712dc 100644
--- a/src/components/comment/CommentFormButtons/index.tsx
+++ b/src/components/comment/CommentFormButtons/index.tsx
@@ -1,18 +1,22 @@
 import React, { FC, useCallback } from 'react';
 import { ButtonGroup } from '~/components/input/ButtonGroup';
 import { Button } from '~/components/input/Button';
+import { FILE_MIMES, UPLOAD_TYPES } from '~/redux/uploads/constants';
 
 interface IProps {
   onUpload: (files: File[]) => void;
 }
 
-const CommentFormButtons: FC<IProps> = ({ onUpload }) => {
+const ALLOWED_TYPES = [...FILE_MIMES[UPLOAD_TYPES.IMAGE], ...FILE_MIMES[UPLOAD_TYPES.AUDIO]];
+
+const CommentFormAttachButtons: FC<IProps> = ({ onUpload }) => {
   const onInputChange = useCallback(
     event => {
       event.preventDefault();
 
-      const files: File[] = Array.from(event.target?.files);
-
+      const files = Array.from(event.target?.files as File[]).filter((file: File) =>
+        ALLOWED_TYPES.includes(file.type)
+      );
       if (!files || !files.length) return;
 
       onUpload(files);
@@ -33,4 +37,4 @@ const CommentFormButtons: FC<IProps> = ({ onUpload }) => {
   );
 };
 
-export { CommentFormButtons };
+export { CommentFormAttachButtons };