Merge pull request #1068 from PintoGideon/bug-fixes

Bug fixes

src/components/AddNode/add-node.css

@@ -142,8 +142,6 @@
   flex-direction: row-reverse;
 }
 
-
-
 .autogenerated__text {
   font-family:"monospace";
 }

src/components/LibraryCopy/LibraryCopy.css → src/components/LibraryCopy/LibraryCopy.module.css

@@ -1,24 +1,24 @@
 /* Custom Modal Styling */
-.custom-modal {
+.customModal {
   border-radius: 2px;
   box-shadow: 0 0 20px rgba(0, 0, 0, 0.2);
   padding: 20px;
 
 }
 
 /* Style for the Upload Buttons section */
-.upload-buttons {
+.uploadButtons {
   display: flex;
   gap: 10px;
   margin-bottom: 20px;
 }
 
-.upload-buttons button {
+.uploadButtons button {
   font-size: 16px;
 }
 
 /* Style for the Local Files Section */
-.local-files-section {
+.localFilesSection {
   height: 200px;
   margin-top: 1rem;
   overflow: auto;
@@ -28,34 +28,34 @@
 }
 
 /* Style for the Directory Name Section */
-.directory-form {
+.directoryForm {
   margin-top: 1rem;
 }
 
-.directory-form label {
+.directoryForm label {
   font-weight: bold;
 }
 
-.directory-form input {
+.directoryForm input {
   width: 100%;
   padding: 10px;
   border: 1px solid #ddd;
   border-radius: 5px;
 }
 
 /* Style for the Upload Button Section */
-.upload-button-section {
+.uploadButtonSection {
   margin-top: 1.5rem;
   text-align: center;
 }
 
-.upload-button-section button {
+.uploadButtonSection button {
   font-size: 1.15rem;
   padding: 12px 20px;
 }
 
 /* Style for the Code Display Section */
-.code-display-section {
+.codeDisplaySection {
   margin-top: 1rem;
   height: 200px;
   overflow: auto;
@@ -64,30 +64,6 @@
   border-radius: 5px;
 }
 
-/* Style for the Progress Bar Section */
-.progress-bar-section {
-  margin-top: 1rem;
-}
-
-/* Style for the Countdown Alert Section */
-.countdown-alert-section {
-  margin-top: 1rem;
-  font-size: 16px;
-  color: #4caf50;
-}
 
-/* Button Styling */
-button {
-  cursor: pointer;
-  background-color: #3498db;
-  color: #fff;
-  border-radius: 5px;
-  padding: 10px 20px;
-  transition: background-color 0.3s;
-}
-
-button:hover {
-  background-color: #2980b9;
-}
 
 

src/components/LibraryCopy/index.tsx

@@ -45,7 +45,7 @@ import {
 import { useDispatch } from "react-redux";
 import { setSidebarActive } from "../../store/ui/actions";
 import { fetchResource } from "../../api/common";
-import "./LibraryCopy.css";
+import styles from "./LibraryCopy.module.css";
 
 export const fetchFilesUnderThisPath = async (path?: string) => {
   if (!path) return;
@@ -78,10 +78,9 @@ export const fetchFoldersUnderThisPath = async (path?: string) => {
     path,
   });
 
-  const parsedUpload =
-    uploads.data && uploads.data[0].subfolders
-      ? JSON.parse(uploads.data[0].subfolders)
-      : [];
+  const parsedUpload = uploads?.data[0].subfolders
+    ? JSON.parse(uploads.data[0].subfolders)
+    : [];
 
   return parsedUpload;
 };
@@ -442,14 +441,14 @@ const UploadComponent: React.FC<UploadComponentProps> = ({
   useEffect(() => {
     const d = getTimestamp();
     setDirectoryName(`${d}`);
-  }, [uploadFileModal]);
+  }, []);
 
   // Handle server upload
   const handleUpload = async () => {
     const client = ChrisAPIClient.getClient();
     await client.setUrls();
     const onUploadProgress = (file: any, progressEvent: AxiosProgressEvent) => {
-      if (progressEvent && progressEvent.total) {
+      if (progressEvent?.total) {
         const percentCompleted = `${Math.round(
           (progressEvent.loaded * 100) / progressEvent.total,
         )}%`;
@@ -514,10 +513,10 @@ const UploadComponent: React.FC<UploadComponentProps> = ({
       onClose={() => handleReset()}
       isOpen={uploadFileModal}
       aria-labelledby="file-upload"
-      className="custom-modal" // Add a custom class for styling
+      className={styles.customModal} // Add a custom class for styling
     >
       {/* Upload Buttons Section */}
-      <div className="upload-buttons">
+      <div className={styles.uploadButtons}>
         <input
           ref={folderInput}
           style={{ display: "none" }}
@@ -534,22 +533,16 @@ const UploadComponent: React.FC<UploadComponentProps> = ({
           onChange={handleFileChange}
           multiple
         />
-        <Button
-          onClick={() => folderInput.current && folderInput.current.click()}
-          variant="primary"
-        >
+        <Button onClick={() => folderInput.current?.click()} variant="primary">
           Upload Folder
         </Button>
-        <Button
-          onClick={() => fileInput.current && fileInput.current.click()}
-          variant="primary"
-        >
+        <Button onClick={() => fileInput.current?.click()} variant="primary">
           Upload Files
         </Button>
       </div>
 
       {/* Local Files Section */}
-      <div className="local-files-section">
+      <div className={styles.localFilesSection}>
         {progress > 0 ? (
           <Progress
             aria-labelledby="file-upload"
@@ -591,7 +584,7 @@ const UploadComponent: React.FC<UploadComponentProps> = ({
       {/* Directory Name Section */}
       <Form
         onSubmit={(event) => event.preventDefault()}
-        className="directory-form"
+        className={styles.directoryForm}
       >
         <FormGroup fieldId="directory name" isRequired label="Directory Name">
           <TextInput
@@ -606,7 +599,7 @@ const UploadComponent: React.FC<UploadComponentProps> = ({
       </Form>
 
       {/* Upload Button Section */}
-      <div className="upload-button-section">
+      <div className={styles.uploadButtonSection}>
         <Button
           isDisabled={
             localFiles.length === 0 ||
@@ -623,7 +616,7 @@ const UploadComponent: React.FC<UploadComponentProps> = ({
       </div>
 
       {/* Code Display Section */}
-      <div className="code-display-section">
+      <div className={styles.codeDisplaySection}>
         <CodeBlock style={{ height: "200px", overflow: "scroll" }}>
           <CodeBlockCode>
             {Object.keys(currentFile).length === 0 ? (

src/components/VisualDatasets/index.tsx

@@ -20,7 +20,6 @@ import {
 } from "@patternfly/react-core";
 import { BrainIcon, DesktopIcon } from "@patternfly/react-icons";
 import { Typography } from "antd";
-
 import WrapperConnect from "../Wrapper";
 import { InfoIcon } from "../Common";
 import ChrisAPIClient from "../../api/chrisapiclient";