refactored and moved CollectionSelector to Gallery

src/pages/gallery/components/DragAndDropUpload.tsx

@@ -33,11 +33,9 @@ const DropDiv = styled.div`
 
 const FileUpload = ({
   children,
-  noClick,
-  modalView,
-  closeModal,
-  showModal,
-  collections,
+  noClick = null,
+  closeModal = null,
+  showModal = null,
 }) => {
   return (
     <>
@@ -67,12 +65,6 @@ const FileUpload = ({
               >
                 <input {...getInputProps()} />
                 {children}
-                <CollectionSelector
-                  modalView={modalView}
-                  closeModal={closeModal}
-                  showModal={showModal}
-                  collections={collections}
-                />
               </DropDiv>
             </>
           );

src/pages/gallery/components/UploadButton.tsx

@@ -2,18 +2,12 @@ import CollectionSelector from 'pages/gallery/components/CollectionSelector';
 import React, { useRef } from 'react';
 import { Button } from 'react-bootstrap';
 
-const UploadButton = ({ modalView, closeModal, showModal, collections }) => {
+const UploadButton = ({ showModal }) => {
   return (
     <>
       <Button variant='primary' onClick={showModal}>
         Upload New Photos
       </Button>
-      <CollectionSelector
-        modalView={modalView}
-        closeModal={closeModal}
-        showModal={showModal}
-        collections={collections}
-      />
     </>
   );
 };

src/pages/gallery/index.tsx

@@ -22,6 +22,7 @@ import Collections from './components/Collections';
 import SadFace from 'components/SadFace';
 import FileUpload from './components/DragAndDropUpload';
 import UploadButton from 'pages/gallery/components/UploadButton';
+import CollectionSelector from './components/CollectionSelector';
 
 enum ITEM_TYPE {
   TIME = 'TIME',
@@ -293,19 +294,13 @@ export default function Gallery() {
         selected={router.query.collection?.toString()}
         selectCollection={selectCollection}
       />
-      <UploadButton
-        modalView={modalView}
-        closeModal={closeModal}
-        showModal={showModal}
-        collections={collections}
-      />
-      <FileUpload
-        noClick
-        modalView={modalView}
-        closeModal={closeModal}
-        showModal={showModal}
-        collections={collections}
-      >
+      <UploadButton showModal={showModal} />
+      <FileUpload noClick closeModal={closeModal} showModal={showModal}>
+        <CollectionSelector
+          modalView={modalView}
+          closeModal={closeModal}
+          collections={collections}
+        />
         {filteredData.length ? (
           <Container>
             <AutoSizer>