Integrate Upload fixes

src/__tests__/__snapshots__/storybook.test.ts.snap

@@ -54,7 +54,7 @@ Array [
         onKeyDown={[Function]}
       >
         <div
-          className="list-group-item list-group-item-dark"
+          className="bg-body border list-group-item"
           data-rb-event-key={null}
           disabled={false}
           onClick={[Function]}
@@ -63,7 +63,7 @@ Array [
 
         </div>
         <div
-          className="list-group-item list-group-item-dark"
+          className="bg-body border list-group-item"
           data-rb-event-key={null}
           disabled={false}
           onClick={[Function]}
@@ -72,16 +72,6 @@ Array [
 
         </div>
       </div>
-      <button
-        className="btn btn-primary"
-        disabled={false}
-        onClick={[Function]}
-        type="button"
-      >
-        Show all (
-        3
-        ) 
-      </button>
     </div>
     <div>
       Files that would be overwritten:
@@ -90,7 +80,7 @@ Array [
         onKeyDown={[Function]}
       >
         <div
-          className="list-group-item list-group-item-dark"
+          className="bg-body border list-group-item"
           data-rb-event-key={null}
           disabled={false}
           onClick={[Function]}
@@ -99,7 +89,7 @@ Array [
 
         </div>
         <div
-          className="list-group-item list-group-item-dark"
+          className="bg-body border list-group-item"
           data-rb-event-key={null}
           disabled={false}
           onClick={[Function]}
@@ -141,7 +131,7 @@ Array [
       </button>
       <div>
         <button
-          className="btn btn-secondary"
+          className="mx-2 btn btn-secondary"
           disabled={false}
           onClick={[Function]}
           type="button"
@@ -303,35 +293,6 @@ exports[`Storyshots Filesystem default 1`] = `
     </div>
     <div />
   </div>
-  <div
-    className="text-center border py-4 mx-3"
-    onBlur={[Function]}
-    onClick={[Function]}
-    onDragEnter={[Function]}
-    onDragLeave={[Function]}
-    onDragOver={[Function]}
-    onDrop={[Function]}
-    onFocus={[Function]}
-    onKeyDown={[Function]}
-    tabIndex={0}
-  >
-    <input
-      autoComplete="off"
-      multiple={true}
-      onChange={[Function]}
-      onClick={[Function]}
-      style={
-        Object {
-          "display": "none",
-        }
-      }
-      tabIndex={-1}
-      type="file"
-    />
-    <p>
-      Drag 'n' drop files or folders here, or click to select files
-    </p>
-  </div>
 </div>
 `;
 

src/background/api/filesystem.ts

@@ -15,14 +15,14 @@ const fhHostname = constants.url.FH_URL;
 
 export const getFolderContents = (path: string) => {
     console.log("[Get folder content", path)
-    return new Promise<FsEntity[]>((resolve, reject) => {
+    return new Promise<AxiosResponse<FsEntity[]>>((resolve, reject) => {
         let config = {
             headers: {
                 "X-FF-PATH": path
             }
         };
         Axios.get<FsEntity[]>(hostname + filesystemPath + "contents", config)
-            .then((response: AxiosResponse<FsEntity[]>) => resolve(response.data))
+            .then((response: AxiosResponse<FsEntity[]>) => resolve(response))
             .catch((error) => reject(error));
     })
 }
@@ -32,7 +32,6 @@ export const uploadPreflight = (
     files: File[] | EditableFileWithPreflightInfo[],
     parentFolderID: string
 ): Promise<PreflightEntity[]> => {
-    parentFolderID = "0" //TODO
     const postData = files.map((f: File | EditableFileWithPreflightInfo) => ({
         // @ts-ignore
         name: f.newName ?? f.name,
@@ -54,7 +53,6 @@ export const uploadPreflight = (
 };
 
 export const uploadFiles = (files: File[] | EditableFileWithPreflightInfo[], parentFolderID: string) => {
-    parentFolderID = "0"; //TODO
     console.log("[API filesystem] uploading files to folderID", parentFolderID , files);
     const apiCall = (file: File | EditableFileWithPreflightInfo) => {
         return new Promise((resolve, reject) => {
@@ -94,27 +92,7 @@ export const uploadFiles = (files: File[] | EditableFileWithPreflightInfo[], par
     };
     handleMultipleApiActions(files, apiCall, ApiActionType.UPLOAD);
 };
-/*
-export const downloadFiles = (files : FsEntity[]) => {
-  Axios.get(fhHostname + "/download", {
-    responseType: "blob", // Important
-    headers: {
-      "Content-Type": "multipart/form-data",
-      "X-FF-IDS": files.map((e:FsEntity) => e.fileSystemId).toString()
-    },
-    onDownloadProgress(progress) {
-      //console.log("download progress:", progress);
-    }
-  }).then((response) => {
-    // fileDownload(response.data, "bild.png");
-    const url = window.URL.createObjectURL(new Blob([response.data]));
-    const link = document.createElement("a");
-    link.href = url;
-    link.setAttribute("download", "file.pdf");
-    document.body.appendChild(link);
-    link.click();
-  });
-};*/
+
 
 export const deleteFsEntities = (files: FsEntity[]) => {
     const apiCall = (fsEntity: FsEntity) => {

src/background/constants.ts

@@ -16,7 +16,8 @@ const dev: constantsdef = {
    // API_URL: "http://localhost:8080",
     //API_URL: "http://localhost/api",
     //FH_URL: "http://localhost:5000/data"
-    FH_URL: "http://localhost/data"
+    //FH_URL: "http://localhost/data"
+    FH_URL: "https://demo.filefighter.de/data"
 
   }
 };

src/background/methods/filesystem.ts

@@ -4,12 +4,12 @@ export const getPathWithoutName = (
   pathWithName: string,
   name: string
 ): string => {
-  return pathWithName.substr(0, pathWithName.lastIndexOf(name));
+  return pathWithName.substr(0, pathWithName.lastIndexOf(name.toLowerCase()));
 };
 
 
 export const removeTrailingBackslash = (path : string): string => {
-  if (path.lastIndexOf("/") === path.length){
+  if (path.lastIndexOf("/") +1 === path.length){
     return path.substr(0,path.length -1)
   }
   return path

src/background/redux/reducers/filesystem.ts

@@ -16,7 +16,7 @@ import {FsEntity} from "../../api/filesystemTypes";
 const initialState: FilesystemState = {
     selectedFsEntities: [],
     folderContents: [],
-    currentFsItemId: "",
+    currentFsItemId: "-1",
     currentPath: ""
 };
 

src/components/pages/filesytem/FileList.tsx

@@ -10,6 +10,7 @@ import {SystemState} from "../../../background/redux/actions/sytemState";
 import {addToSelected, clearSelected, removeFromSelected, replaceSelected, setContents, setCurrentFsItemId, setCurrentPath} from "../../../background/redux/actions/filesystem";
 import {connect, ConnectedProps} from "react-redux";
 import {FFLoading} from "../../basicElements/Loading";
+import {AxiosResponse} from "axios";
 
 const mapState = (state: SystemState) => ({
     filesystem: {
@@ -61,17 +62,17 @@ function FileList(props: Props): ReactElement {
     useEffect(() => {
         function updateStates(): void {
             getFolderContents(path)
-                .then((response: FsEntity[]) => {
-                    console.log("got folder content");
+                .then((response: AxiosResponse<FsEntity[]>) => {
+                    console.log("got folder content",response);
 
                     setContents([
-                        ...response.filter(
+                        ...response.data.filter(
                             (fsEntity: FsEntity) => fsEntity.type === "FOLDER"
                         ),
-                        ...response.filter((fsEntity: FsEntity) => fsEntity.type !== "FOLDER")
+                        ...response.data.filter((fsEntity: FsEntity) => fsEntity.type !== "FOLDER")
                     ]);
                     setError("");
-                    setCurrentFsItemId(path); // TODO change this to the id of the current folder
+                    setCurrentFsItemId(response.headers["x-ff-current"]);
                 })
                 .catch((err) => {
                     setError(err.response?.data?.message);
@@ -139,7 +140,7 @@ function FileList(props: Props): ReactElement {
         setFilesAndFolders(sortIncreasing ? toSort.reverse() : toSort);
     }
 
-    console.log("[FileList path]" + path);
+    console.log("[FileList path]" + path, filesAndFolders);
     return (
         <Container fluid>
             <FilesBreadcrumb path={path} setPath={setPath}/>

src/components/pages/filesytem/upload/UploadDecisionsModalContent.stories.tsx

@@ -53,10 +53,18 @@ storiesOf("Filesystem", module).add("UploadDecisionsModal", () => {
         {
             name: "blubfdhjsgfhj---fsd/",
             path: "fasel/blubfdhjsgfhj---fsd/",
-            permissionIsSufficient: false,
-            nameAlreadyInUse: true,
+            permissionIsSufficient: true,
+            nameAlreadyInUse: false,
             nameIsValid: false,
             isFile: false
+        },
+        {
+            name: "notAllowed",
+            path: "fasel/notAllowed",
+            permissionIsSufficient: false,
+            nameAlreadyInUse: false,
+            nameIsValid: true,
+            isFile: false
         }
     ];
 

src/components/pages/filesytem/upload/UploadDecisionsModalContent.tsx

@@ -55,14 +55,21 @@ export const UploadDecisionsModalContent = ({
           setPreflightResultDispatch({ type: PREFLIGHT_ADD_ENTITIES, payload: combined });
         } else {
           uploadFiles(combined.filter(
-            (f: EditablePreflightEntityOrFile) => !f.isFile) as EditableFileWithPreflightInfo[], fsItemIdToUpload);
+            (f: EditablePreflightEntityOrFile) => f.isFile) as EditableFileWithPreflightInfo[], fsItemIdToUpload);
           handleClose();
           setPreflightResultDispatch({ type: PREFLIGHT_ADD_ENTITIES, payload: [] });
         }
         setLoading(false);
       });
   };
 
+  const handleOverWriteAll = () => {
+      uploadFiles(preflightResult.filter(
+          (f: EditablePreflightEntityOrFile) => f.isFile) as EditableFileWithPreflightInfo[], fsItemIdToUpload);
+      handleClose();
+      setPreflightResultDispatch({ type: PREFLIGHT_ADD_ENTITIES, payload: [] });
+  }
+
   const foldersToMerge = preflightResult.filter(
     (f: EditablePreflightEntityOrFile) => !f.isFile && f.nameAlreadyInUse
   );
@@ -80,7 +87,7 @@ export const UploadDecisionsModalContent = ({
     return (
       <ListGroup variant="flush">
         {files.map((f: EditablePreflightEntityOrFile) => (
-          <ListGroup.Item  key={f.path} variant="dark">{f.path} </ListGroup.Item>
+          <ListGroup.Item  key={f.path} className="bg-body border">{f.path} </ListGroup.Item>
         ))}
       </ListGroup>
     );
@@ -158,12 +165,12 @@ export const UploadDecisionsModalContent = ({
               Cancel
             </Button>
             <div>
-              <Button variant="secondary" onClick={nextPage}>
+              <Button variant="secondary"   className="mx-2" onClick={nextPage}>
                 Decide for each one
               </Button>
               <Button
                 variant="primary"
-                onClick={handleClose}
+                onClick={handleOverWriteAll}
                 disabled={
                   !!insufficientPermission.length ||
                   !!entitiesWithInvalidName.length

src/components/pages/filesytem/upload/UploadZone.tsx

@@ -40,6 +40,12 @@ export const UploadZone = (): ReactElement => {
 
   const onDrop = useCallback(
     (acceptedFiles: EditableFileWithPreflightInfo[]) => {
+
+
+      if (!acceptedFiles.length){
+        return // TODO: dispatch a action to show that a empty folder could not be uploaded
+      }
+
       //check if preflight is needed
       let preflightNeeded = acceptedFiles.some(
         (file: EditablePreflightEntityOrFile) => {
@@ -51,7 +57,7 @@ export const UploadZone = (): ReactElement => {
           );
         }
       );
-      console.log(acceptedFiles, preflightNeeded);
+      console.log("[Upload Zone, add files]",acceptedFiles, preflightNeeded);
 
       if (preflightNeeded) {
         setFsItemIdToUpload(currentFsItemId);
@@ -93,6 +99,9 @@ export const UploadZone = (): ReactElement => {
   // @ts-ignore
   const { getRootProps, getInputProps, isDragActive } = useDropzone({ onDrop });
 
+  if (currentFsItemId === "-1" ){
+    return <></>
+  }
   return (
     <>
       <div {...getRootProps()} className={"text-center border py-4 mx-3"}>

webapp_provider/nginx.conf

@@ -24,6 +24,7 @@ http {
       proxy_set_header   X-Forwarded-Host $server_name;
 
     location /api  {
+      client_max_body_size 1G;
     # use dockers dns resolver
     # with this nginx can start even when the other containers are not running
       resolver 127.0.0.11 valid=30s;