fix: CE-1047 'Select office' field on admin screen includes multiples of offices not found within the organization selected

backend/src/types/models/office/office-assignment-dto.ts

@@ -4,4 +4,5 @@ export interface OfficeAssignmentDto {
   id: UUID;
   name: string;
   agency: string;
+  code: string;
 }

backend/src/v1/office/office.service.ts

@@ -73,17 +73,17 @@ export class OfficeService {
       .select("office.office_guid")
       .leftJoin("office.cos_geo_org_unit", "organization")
       .leftJoin("office.agency_code", "agency")
-      .addSelect(["organization.office_location_name", "agency.short_description"]);
+      .addSelect(["organization.office_location_name", "agency.short_description", "agency.agency_code"]);
 
     const data = await queryBuilder.getMany();
 
     const results = data.map((item) => {
       const {
         office_guid: id,
         cos_geo_org_unit: { office_location_name: name },
-        agency_code: { short_description: description },
+        agency_code: { short_description: description, agency_code: code },
       } = item;
-      const record: OfficeAssignmentDto = { id, name, agency: description };
+      const record: OfficeAssignmentDto = { id, name, agency: description, code };
       return record;
     });
 

frontend/src/app/components/containers/admin/user-management.tsx

@@ -4,7 +4,11 @@ import { useAppDispatch, useAppSelector } from "../../../hooks/hooks";
 import { assignOfficerToOffice, selectOfficersDropdown } from "../../../store/reducers/officer";
 import { CompSelect } from "../../common/comp-select";
 import Option from "../../../types/app/option";
-import { fetchOfficeAssignments, selectOfficesForAssignmentDropdown } from "../../../store/reducers/office";
+import {
+  fetchOfficeAssignments,
+  selectOfficesForAssignmentDropdown,
+  selectOffices,
+} from "../../../store/reducers/office";
 import { ToastContainer } from "react-toastify";
 import { ToggleError, ToggleSuccess } from "../../../common/toast";
 import { clearNotification, selectNotification } from "../../../store/reducers/app";
@@ -14,7 +18,6 @@ import { generateApiParameters, get, patch } from "../../../common/api";
 import config from "../../../../config";
 import { Officer } from "../../../types/person/person";
 import { UUID } from "crypto";
-import Roles from "../../../types/app/roles";
 import { ValidationMultiSelect } from "../../../common/validation-multiselect";
 
 export const UserManagement: FC = () => {
@@ -25,6 +28,8 @@ export const UserManagement: FC = () => {
   const teams = useAppSelector(selectTeamDropdown);
   const agency = useAppSelector(selectAgencyDropdown);
 
+  const availableOffices = useAppSelector(selectOffices);
+
   const [officer, setOfficer] = useState<Option>();
   const [officerError, setOfficerError] = useState<string>("");
   const [office, setOffice] = useState<Option>();
@@ -35,9 +40,23 @@ export const UserManagement: FC = () => {
   const [userIdirs, setUserIdirs] = useState<any[]>([]);
   const [selectedUserIdir, setSelectedUserIdir] = useState<string>("");
   const [officerGuid, setOfficerGuid] = useState<string>("");
+  const [offices, setOffices] = useState<Array<Option>>([]);
 
   useEffect(() => {
-    if (officeAssignments) dispatch(fetchOfficeAssignments());
+    if (officeAssignments) {
+      dispatch(fetchOfficeAssignments());
+      let options = availableOffices.map((item) => {
+        const { id, name, agency } = item;
+        const record: Option = {
+          label: `${agency} - ${name}`,
+          value: id,
+        };
+
+        return record;
+      });
+      setOffices(options);
+    }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [dispatch]);
 
   useEffect(() => {
@@ -58,8 +77,25 @@ export const UserManagement: FC = () => {
           const currentUserRoles = mapRolesDropdown(current.roles);
           setSelectedRoles(currentUserRoles);
         }
+
+        if (current.agency) {
+          let filtered = availableOffices
+            .filter((item) => item.code === current.agency)
+            .map((item) => {
+              const { id, name, agency } = item;
+              const record: Option = {
+                label: `${agency} - ${name}`,
+                value: id,
+              };
+
+              return record;
+            });
+
+          setOffices(filtered);
+        }
       }
     })();
+    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [officerGuid, selectedUserIdir]);
 
   const mapRolesDropdown = (userRoles: any): Option[] => {
@@ -143,6 +179,20 @@ export const UserManagement: FC = () => {
   };
   const handleAgencyChange = (input: any) => {
     if (input.value) {
+      let filtered = availableOffices
+        .filter((item) => item.code === input.value)
+        .map((item) => {
+          const { id, name, agency } = item;
+          const record: Option = {
+            label: `${agency} - ${name}`,
+            value: id,
+          };
+
+          return record;
+        });
+
+      setOffices(filtered);
+
       setSelectedAgency(input);
     }
   };
@@ -176,17 +226,23 @@ export const UserManagement: FC = () => {
       const mapRoles = selectedRoles?.map((role) => {
         return { name: role.value };
       });
-      let res;
+
       switch (selectedAgency.value) {
         case "EPO": {
           if (selectedUserIdir && selectedTeam && selectedRoles) {
-            res = await updateTeamRole(
+            let res = await updateTeamRole(
               selectedUserIdir,
               officerGuid,
               selectedAgency?.value,
               selectedTeam?.value,
               mapRoles,
             );
+
+            if (res?.team && res?.roles) {
+              ToggleSuccess("Officer updated successfully");
+            } else {
+              ToggleError("Unable to update");
+            }
           }
           break;
         }
@@ -201,16 +257,16 @@ export const UserManagement: FC = () => {
           const mapRoles = selectedRoles?.map((role) => {
             return { name: role.value };
           });
-          res = await updateTeamRole(selectedUserIdir, officerGuid, selectedAgency?.value, null, mapRoles);
+          let res = await updateTeamRole(selectedUserIdir, officerGuid, selectedAgency?.value, null, mapRoles);
+
+          if (res?.roles) {
+            ToggleSuccess("Officer updated successfully");
+          } else {
+            ToggleError("Unable to update");
+          }
           break;
         }
       }
-      if (res && res.team && res.roles) {
-        ToggleSuccess("Success");
-      } else {
-        debugger;
-        ToggleError("Unable to update");
-      }
     }
   };
 
@@ -339,7 +395,7 @@ export const UserManagement: FC = () => {
                   classNames={{
                     menu: () => "top-layer-select",
                   }}
-                  options={officeAssignments}
+                  options={offices}
                   placeholder="Select"
                   enableValidation={true}
                   value={office}

frontend/src/app/store/reducers/office.ts

@@ -86,4 +86,12 @@ export const selectOfficesForAssignmentDropdown = (state: RootState): Array<Drop
   return data;
 };
 
+export const selectOffices = (state: RootState): Array<OfficeAssignment> => {
+  const {
+    offices: { officeAssignments },
+  } = state;
+
+  return officeAssignments;
+};
+
 export default officeSlice.reducer;

frontend/src/app/types/app/office/office-assignment.ts

@@ -4,4 +4,5 @@ export interface OfficeAssignment {
   id: UUID;
   name: string;
   agency: string;
+  code: string;
 }