From e0c74d59bd65c393fbc4f55b4d150d004817af32 Mon Sep 17 00:00:00 2001
From: Greemty <52284320+Greemty@users.noreply.github.com>
Date: Tue, 11 Jul 2023 20:21:53 +0200
Subject: [PATCH] :lipstick: Only folders in the tree view (#115) (#135)

* :lipstick: Only folders in the tree view (#115)
---
 .../body/drive/modals/selector/index.tsx      | 59 ++++++++++---------
 1 file changed, 32 insertions(+), 27 deletions(-)

diff --git a/tdrive/frontend/src/app/views/client/body/drive/modals/selector/index.tsx b/tdrive/frontend/src/app/views/client/body/drive/modals/selector/index.tsx
index a785ae43..e29459c8 100644
--- a/tdrive/frontend/src/app/views/client/body/drive/modals/selector/index.tsx
+++ b/tdrive/frontend/src/app/views/client/body/drive/modals/selector/index.tsx
@@ -34,12 +34,12 @@ export const SelectorModal = () => {
 
   return (
     <Modal open={state.open} onClose={() => setState({ ...state, open: false })}>
-      <SelectorModalContent key={state.parent_id} />
+      <SelectorModalContent key={state.parent_id} showfiles={false}/>
     </Modal>
   );
 };
 
-const SelectorModalContent = () => {
+const SelectorModalContent = (key:any,showfiles:boolean) => {
   const [state, setState] = useRecoilState(SelectorModalAtom);
   const [selected, setSelected] = useState<DriveItem[]>([]);
   const [loading, setLoading] = useState(false);
@@ -91,36 +91,41 @@ const SelectorModalContent = () => {
             </div>
           </div>
         ))}
+        
+        {key.showfiles && ( 
+        <>
         {files.map(file => (
           <div
-            key={file.id}
-            className={
-              'flex flex-row items-center border-t -mt-px px-4 py-2 cursor-pointer ' +
-              'hover:bg-zinc-500 hover:bg-opacity-10 '
-            }
-            onClick={() => {
-              if (state.mode === 'select-files') {
-                if (!selected.some(i => i.id === file.id)) {
-                  setSelected([...selected, file]);
-                } else {
-                  setSelected(selected.filter(i => i.id !== file.id));
-                }
-              } else if (state.mode === 'select-file') {
-                setSelected([file]);
+          key={file.id}
+          className={
+            'flex flex-row items-center border-t -mt-px px-4 py-2 cursor-pointer ' +
+            'hover:bg-zinc-500 hover:bg-opacity-10 '
+          }
+          onClick={() => {
+            if (state.mode === 'select-files') {
+              if (!selected.some(i => i.id === file.id)) {
+                setSelected([...selected, file]);
+              } else {
+                setSelected(selected.filter(i => i.id !== file.id));
               }
-            }}
+            } else if (state.mode === 'select-file') {
+              setSelected([file]);
+            }
+          }}
           >
-            <div className="grow flex flex-row items-center">
-              <DocumentIcon className="h-5 w-5 shrink-0 text-gray-400 mr-2" />
-              {file.name}
-            </div>
-            {(state.mode === 'select-file' || state.mode === 'select-files') && (
-              <div className="shrink-0" onClick={e => e.stopPropagation()}>
-                <Checkbox value={selected.some(i => i.id === file.id)} />
-              </div>
-            )}
+          <div className="grow flex flex-row items-center">
+            <DocumentIcon className="h-5 w-5 shrink-0 text-gray-400 mr-2" />
+            {file.name}
           </div>
-        ))}
+          {(state.mode === 'select-file' || state.mode === 'select-files') && (
+            <div className="shrink-0" onClick={e => e.stopPropagation()}>
+              <Checkbox value={selected.some(i => i.id === file.id)} />
+            </div>
+          )}
+          </div>
+          ))}
+        </>
+        )}
       </div>
 
       <Button