Merge pull request #1163 from mozzy11/develop

fix order of labunit roles on user page
I-TECH-UW · Jul 5, 2024 · 75611b0 · 75611b0
2 parents 401eb71 + c4e9536
commit 75611b0
Show file tree

Hide file tree

Showing 3 changed files with 32 additions and 6 deletions.
diff --git a/frontend/src/components/admin/Admin.js b/frontend/src/components/admin/Admin.js
@@ -52,7 +52,6 @@ import OrganizationAddModify from "./OrganizationManagement/OrganizationAddModif
 import UserManagement from "./userManagement/UserManagement";
 import UserAddModify from "./userManagement/UserAddModify";
 
-
 function Admin() {
   const intl = useIntl();
   const [isSmallScreen, setIsSmallScreen] = useState(false);

diff --git a/frontend/src/components/admin/OrganizationManagement/OrganizationAddModify.js b/frontend/src/components/admin/OrganizationManagement/OrganizationAddModify.js
@@ -348,7 +348,7 @@ function OrganizationAddModify() {
     });
     setTimeout(() => {
       window.location.assign("/MasterListsPage#organizationManagement");
-    }, 2000);
+    }, 200);
     setNotificationVisible(true);
   };
 

diff --git a/frontend/src/components/admin/userManagement/UserAddModify.js b/frontend/src/components/admin/userManagement/UserAddModify.js
@@ -68,6 +68,9 @@ function UserAddModify() {
   const [selectedTestSectionLabUnits, setSelectedTestSectionLabUnits] =
     useState({});
 
+  // this keeps the order of the test section lab roles 
+  const [selectedTestSectionList, setSelectedTestSectionList] = useState([]);
+
   const ID = (() => {
     const hash = window.location.hash;
     if (hash.includes("?")) {
@@ -102,6 +105,11 @@ function UserAddModify() {
       setIsLoading(true);
     } else {
       setUserData(res);
+      var KeyList = [];
+      Object.keys(res.selectedTestSectionLabUnits).map((key) =>
+        KeyList.push(key),
+      );
+      setSelectedTestSectionList(KeyList);
     }
   };
 
@@ -249,6 +257,7 @@ function UserAddModify() {
           setSelectedTestSectionLabUnits(userData.selectedTestSectionLabUnits);
         } else {
           setSelectedTestSectionLabUnits({});
+          setSelectedTestSectionList([]);
         }
       }
     }
@@ -290,7 +299,7 @@ function UserAddModify() {
       setNotificationVisible(true);
       setTimeout(() => {
         window.location.reload();
-      }, 2000);
+      }, 200);
     } else {
       addNotification({
         kind: NotificationKinds.error,
@@ -300,7 +309,7 @@ function UserAddModify() {
       setNotificationVisible(true);
       setTimeout(() => {
         window.location.reload();
-      }, 2000);
+      }, 200);
     }
   }
 
@@ -456,6 +465,7 @@ function UserAddModify() {
 
   function handleCopyUserPermissionsChangeClick() {
     setSelectedTestSectionLabUnits([]);
+    setSelectedTestSectionList([]);
     userSavePostCall();
   }
 
@@ -493,6 +503,12 @@ function UserAddModify() {
 
   function handleTestSectionsSelectChange(e, key) {
     const selectedValue = e.target.value;
+    const index = selectedTestSectionList.indexOf(key);
+    if (index != -1) {
+      const testSectionList = [...selectedTestSectionList];
+      testSectionList[index] = selectedValue;
+      setSelectedTestSectionList(testSectionList);
+    }
 
     if (Object.keys(selectedTestSectionLabUnits).includes(selectedValue)) {
       alert(`Section ${selectedValue} is already selected.`);
@@ -557,13 +573,22 @@ function UserAddModify() {
         ...prev,
         [nextSectionToAdd.id]: [],
       }));
+      const testSectionList = [...selectedTestSectionList];
+      testSectionList.push(nextSectionToAdd.id);
+      setSelectedTestSectionList(testSectionList);
     }
   };
 
   const removeSection = (keyToRemove) => {
     const updatedSections = { ...selectedTestSectionLabUnits };
     delete updatedSections[keyToRemove];
     setSelectedTestSectionLabUnits(updatedSections);
+    const index = selectedTestSectionList.indexOf(keyToRemove);
+    if (index != -1) {
+      const testSectionList = [...selectedTestSectionList];
+      testSectionList.splice(index, 1);
+      setSelectedTestSectionList(testSectionList);
+    }
   };
 
   useEffect(() => {
@@ -1054,13 +1079,13 @@ function UserAddModify() {
                 </Grid>
                 <br />
                 <>
-                  {Object.keys(selectedTestSectionLabUnits).map((key) => (
+                  {selectedTestSectionList.map((key) => (
                     <Grid
                       fullWidth={true}
                       key={key}
                       style={{ paddingBottom: "10px" }}
                     >
-                      <Column lg={8} md={4} sm={4}>
+                      <Column lg={4} md={4} sm={4}>
                         <Select
                           id={`select-${key}`}
                           noLabel={true}
@@ -1182,6 +1207,8 @@ function UserAddModify() {
                             />
                           )}
                         </FormGroup>
+                      </Column>
+                      <Column lg={4} md={4} sm={4}>
                         <Button
                           onClick={() => removeSection(key)}
                           kind="tertiary"