Fix sanitize file path while drag and drop (#3492)

Author: prakashsvmx

web-app/src/screens/Console/Buckets/ListBuckets/Objects/ListObjects/ListObjects.tsx

@@ -122,6 +122,7 @@ import TooltipWrapper from "../../../../Common/TooltipWrapper/TooltipWrapper";
 import ListObjectsTable from "./ListObjectsTable";
 import FilterObjectsSB from "../../../../ObjectBrowser/FilterObjectsSB";
 import AddAccessRule from "../../../BucketDetails/AddAccessRule";
+import { sanitizeFilePath } from "./utils";
 
 const DeleteMultipleObjects = withSuspense(
   React.lazy(() => import("./DeleteMultipleObjects")),
@@ -506,7 +507,7 @@ const ListObjects = () => {
 
             const blobFile = new Blob([file], { type: file.type });
 
-            const filePath = get(file, "path", "");
+            const filePath = sanitizeFilePath(get(file, "path", ""));
             const fileWebkitRelativePath = get(file, "webkitRelativePath", "");
 
             let relativeFolderPath = folderPath;

web-app/src/screens/Console/Buckets/ListBuckets/Objects/ListObjects/utils.tsx

@@ -134,3 +134,8 @@ export const displayFileIconName = (
 
   return <IconWithLabel icon={icon} strings={splitItem} />;
 };
+
+export const sanitizeFilePath = (filePath: string) => {
+  // Replace `./` at the start of the path or preceded by `/` - happens when drag drop upload of files (not folders !) in chrome
+  return filePath.replace(/(^|\/)\.\//g, "/");
+};