Merge pull request #1439 from internxt/feat/pb-3237-improve-upload-sp…

…eeds [PB-3237]: feat/improve-upload-speeds
internxt · Feb 17, 2025 · 18e0df1 · 18e0df1
2 parents 0946249 + df0877b
commit 18e0df1
Show file tree

Hide file tree

Showing 13 changed files with 1,147 additions and 201 deletions.
diff --git a/src/app/drive/components/DriveExplorer/DriveExplorer.tsx b/src/app/drive/components/DriveExplorer/DriveExplorer.tsx
@@ -16,10 +16,10 @@ import DriveExplorerList from './DriveExplorerList/DriveExplorerList';
 
 import { UserSettings } from '@internxt/sdk/dist/shared/types/userSettings';
 import { useHotkeys } from 'react-hotkeys-hook';
-import moveItemsToTrash from 'use_cases/trash/move-items-to-trash';
+import moveItemsToTrash from '../../../../use_cases/trash/move-items-to-trash';
 
 import { Role } from '@internxt/sdk/dist/drive/share/types';
-import workspacesSelectors from 'app/store/slices/workspaces/workspaces.selectors';
+import workspacesSelectors from '../../../store/slices/workspaces/workspaces.selectors';
 import { t } from 'i18next';
 import BannerWrapper from '../../../banners/BannerWrapper';
 import deviceService from '../../../core/services/device.service';
@@ -68,9 +68,11 @@ import WarningMessageWrapper from '../WarningMessage/WarningMessageWrapper';
 import './DriveExplorer.scss';
 import { DriveTopBarItems } from './DriveTopBarItems';
 import DriveTopBarActions from './components/DriveTopBarActions';
-import { getAncestorsAndSetNamePath } from 'app/store/slices/storage/storage.thunks/goToFolderThunk';
+import { getAncestorsAndSetNamePath } from '../../../store/slices/storage/storage.thunks/goToFolderThunk';
 import { IRoot } from '../../../store/slices/storage/types';
-import { useTrashPagination } from 'app/drive/hooks/trash/useTrashPagination';
+import { useTrashPagination } from '../../../drive/hooks/trash/useTrashPagination';
+import { WorkspaceData } from '@internxt/sdk/dist/workspaces';
+import { uploadFoldersWithManager } from '../../../network/UploadFolderManager';
 
 export const UPLOAD_ITEMS_LIMIT = 3000;
 
@@ -99,6 +101,7 @@ interface DriveExplorerProps {
   namePath: FolderPath[];
   dispatch: AppDispatch;
   workspace: Workspace;
+  selectedWorkspace: WorkspaceData | null;
   planLimit: number;
   planUsage: number;
   isOver: boolean;
@@ -143,11 +146,11 @@ const DriveExplorer = (props: DriveExplorerProps): JSX.Element => {
     user,
     getTrashPaginated,
     roles,
+    selectedWorkspace,
   } = props;
   const [isOpen, setIsOpen] = useState(false);
   const dispatch = useAppDispatch();
   const { translate } = useTranslationContext();
-  const selectedWorkspace = useAppSelector(workspacesSelectors.getSelectedWorkspace);
   const menuItemsRef = useRef<HTMLDivElement | null>(null);
   const menuContextItemsRef = useRef<HTMLDivElement | null>(null);
 
@@ -904,9 +907,13 @@ const uploadItems = async (props: DriveExplorerProps, rootList: IRoot[], files:
             onSuccess: onDragAndDropEnd,
           },
         }));
-        dispatch(storageThunks.uploadMultipleFolderThunkNoCheck(folderDataToUpload)).then(() => {
-          dispatch(fetchSortedFolderContentThunk(currentFolderId));
+
+        await uploadFoldersWithManager({
+          payload: folderDataToUpload,
+          selectedWorkspace: props.selectedWorkspace,
+          dispatch,
         });
+        dispatch(fetchSortedFolderContentThunk(currentFolderId));
       }
     }
   } else {
@@ -952,6 +959,7 @@ const dropTargetCollect: DropTargetCollector<
 
 export default connect((state: RootState) => {
   const currentFolderId: string = storageSelectors.currentFolderId(state);
+  const selectedWorkspace = workspacesSelectors.getSelectedWorkspace(state);
   const hasMoreFolders = state.storage.hasMoreDriveFolders[currentFolderId] ?? true;
   const hasMoreFiles = state.storage.hasMoreDriveFiles[currentFolderId] ?? true;
 
@@ -968,6 +976,7 @@ export default connect((state: RootState) => {
     viewMode: state.storage.viewMode,
     namePath: state.storage.namePath,
     workspace: state.session.workspace,
+    selectedWorkspace: selectedWorkspace,
     planLimit: planSelectors.planLimitToShow(state),
     planUsage: planSelectors.planUsageToShow(state),
     folderOnTrashLength: state.storage.folderOnTrashLength,

diff --git a/src/app/drive/components/DriveExplorer/DriveExplorerItem/hooks/useDriveItemDragAndDrop.tsx b/src/app/drive/components/DriveExplorer/DriveExplorerItem/hooks/useDriveItemDragAndDrop.tsx
@@ -11,6 +11,8 @@ import {
   handleRepeatedUploadingFolders,
 } from '../../../../../store/slices/storage/storage.thunks/renameItemsThunk';
 import { DriveItemData } from '../../../../types';
+import { uploadFoldersWithManager } from '../../../../../network/UploadFolderManager';
+import workspacesSelectors from '../../../../../store/slices/workspaces/workspaces.selectors';
 
 interface DragSourceCollectorProps {
   isDraggingThisItem: boolean;
@@ -49,6 +51,7 @@ export const useDriveItemDrop = (item: DriveItemData): DriveItemDrop => {
   const isSomeItemSelected = useAppSelector(storageSelectors.isSomeItemSelected);
   const { selectedItems } = useAppSelector((state) => state.storage);
   const namePath = useAppSelector((state) => state.storage.namePath);
+  const selectedWorkspace = useAppSelector(workspacesSelectors.getSelectedWorkspace);
   const [{ isDraggingOverThisItem, canDrop }, connectDropTarget] = useDrop<
     DriveItemData | DriveItemData[],
     unknown,
@@ -111,11 +114,15 @@ export const useDriveItemDrop = (item: DriveItemData): DriveItemDrop => {
             }
             if (rootList.length) {
               // Directory tree
-              for (const root of rootList) {
-                const currentFolderId = item.uuid;
-
-                await dispatch(storageThunks.uploadFolderThunk({ root, currentFolderId }));
-              }
+              const folderDataToUpload = rootList.map((root) => ({
+                root,
+                currentFolderId: item.uuid,
+              }));
+              await uploadFoldersWithManager({
+                payload: folderDataToUpload,
+                selectedWorkspace,
+                dispatch,
+              });
             }
           });
         }

diff --git a/src/app/drive/components/NameCollisionDialog/NameCollisionContainer.tsx b/src/app/drive/components/NameCollisionDialog/NameCollisionContainer.tsx
@@ -11,6 +11,8 @@ import { fetchSortedFolderContentThunk } from '../../../store/slices/storage/sto
 import { uiActions } from '../../../store/slices/ui';
 import { DriveItemData } from '../../types';
 import { IRoot } from '../../../store/slices/storage/types';
+import workspacesSelectors from '../../../store/slices/workspaces/workspaces.selectors';
+import { uploadFoldersWithManager } from '../../../network/UploadFolderManager';
 
 type NameCollisionContainerProps = {
   currentFolderId: string;
@@ -36,6 +38,7 @@ const NameCollisionContainer: FC<NameCollisionContainerProps> = ({
   const [driveRepeatedFolder, setDriveRepeatedFolder] = useState<DriveItemData[]>([]);
 
   const isOpen = useAppSelector((state: RootState) => state.ui.isNameCollisionDialogOpen);
+  const selectedWorkspace = useAppSelector(workspacesSelectors.getSelectedWorkspace);
   const isMoveDialog = useMemo(() => !!moveDestinationFolderId, [moveDestinationFolderId]);
   const folderId = useMemo(
     () => moveDestinationFolderId ?? currentFolderId,
@@ -131,14 +134,16 @@ const NameCollisionContainer: FC<NameCollisionContainerProps> = ({
 
     itemsToUpload.forEach((itemToUpload) => {
       if ((itemToUpload as IRoot).fullPathEdited) {
-        dispatch(
-          storageThunks.uploadMultipleFolderThunkNoCheck([
+        uploadFoldersWithManager({
+          payload: [
             {
               root: { ...(itemToUpload as IRoot) },
               currentFolderId: folderId,
             },
-          ]),
-        ).then(() => {
+          ],
+          selectedWorkspace,
+          dispatch,
+        }).then(() => {
           dispatch(fetchSortedFolderContentThunk(folderId));
         });
       } else {
@@ -160,12 +165,16 @@ const NameCollisionContainer: FC<NameCollisionContainerProps> = ({
   const keepAndUploadItem = async (itemsToUpload: (IRoot | File)[]) => {
     itemsToUpload.forEach((itemToUpload) => {
       if ((itemToUpload as IRoot).fullPathEdited) {
-        dispatch(
-          storageThunks.uploadFolderThunk({
-            root: { ...(itemToUpload as IRoot) },
-            currentFolderId: folderId,
-          }),
-        ).then(() => {
+        uploadFoldersWithManager({
+          payload: [
+            {
+              root: { ...(itemToUpload as IRoot) },
+              currentFolderId: folderId,
+            },
+          ],
+          selectedWorkspace,
+          dispatch,
+        }).then(() => {
           dispatch(fetchSortedFolderContentThunk(folderId));
         });
       } else {