Merge branch 'develop' into feature/OH2-287-admin-user-group-crud

cypress/integrations/admin_activities/wards_activities/add_ward_activity.cy.ts

@@ -14,7 +14,7 @@ describe("Add Ward Activity specs", () => {
   });
 
   it("should fail to create a new ward", () => {
-    cy.byId("code").type("FAIL");
+    cy.byId("code").type("FL");
     cy.byId("description").type("Children ward");
     cy.byId("email").type("[email protected]");
     cy.byId("telephone").type("698123234");

docker-compose.yaml

@@ -73,7 +73,7 @@ services:
     environment: *mariadb-env
     ports:
       - "3306:3306"
-    command: mysqld --sql_mode="STRICT_TRANS_TABLES,NO_ZERO_IN_DATE,NO_ZERO_DATE,ERROR_FOR_DIVISION_BY_ZERO,NO_AUTO_CREATE_USER,NO_ENGINE_SUBSTITUTION" --lower_case_table_names=1
+    command: mysqld --sql_mode="STRICT_TRANS_TABLES,NO_ZERO_IN_DATE,NO_ZERO_DATE,ERROR_FOR_DIVISION_BY_ZERO,NO_AUTO_CREATE_USER,NO_ENGINE_SUBSTITUTION" --lower_case_table_names=1 --explicit_defaults_for_timestamp=OFF
     networks:
       - openhospital
 

package.json

@@ -3,6 +3,7 @@
   "version": "0.1.0",
   "private": true,
   "dependencies": {
+    "@babel/plugin-proposal-private-property-in-object": "^7.21.11",
     "@date-io/date-fns": "^1.3.13",
     "@emotion/react": "^11.13.0",
     "@emotion/styled": "^11.13.0",

src/components/Private.js

@@ -1,12 +1,11 @@
 import React from "react";
-import { Navigate, Outlet, useLocation } from "react-router-dom";
+import { Navigate, Outlet } from "react-router-dom";
 import { PATHS } from "../consts";
 import { isAuthenticated } from "../libraries/authUtils/isAuthenticated";
 import { useAuthentication } from "../libraries/authUtils/useAuthentication";
 
 export const Private = () => {
   useAuthentication();
-  const { pathname } = useLocation();
 
   return isAuthenticated() ? <Outlet /> : <Navigate to={PATHS.login} replace />;
 };

src/components/accessories/admin/diseases/Diseases.tsx

@@ -37,14 +37,11 @@ export const Diseases = () => {
     });
   };
 
-  const handleViewChange = useCallback(
-    (event: any, value: any) => {
-      if (!isEmpty(value)) {
-        setView(value);
-      }
-    },
-    [view]
-  );
+  const handleViewChange = useCallback((event: any, value: any) => {
+    if (!isEmpty(value)) {
+      setView(value);
+    }
+  }, []);
 
   const predicate = useCallback(
     (disease: DiseaseDTO) => {

src/components/accessories/admin/exams/examsTable/ExamsTable.tsx

@@ -48,7 +48,7 @@ export const ExamsTable = ({ onDelete, onEdit, headerActions }: IOwnProps) => {
 
   const filters: TFilterField[] = [
     {
-      key: "type",
+      key: "examtype",
       label: t("exam.examtype"),
       type: "select",
       options: examTypesOptions,
@@ -124,7 +124,10 @@ export const ExamsTable = ({ onDelete, onEdit, headerActions }: IOwnProps) => {
                   onDelete={onDelete}
                   headerActions={headerActions}
                   filterColumns={filters}
-                  rawData={data ?? []}
+                  rawData={(data ?? []).map((exam) => ({
+                    ...exam,
+                    examtype: exam.examtype?.code,
+                  }))}
                   manualFilter={false}
                   rowKey="code"
                 />

src/components/accessories/admin/operations/Operations.tsx

@@ -2,6 +2,7 @@ import { useAppDispatch } from "libraries/hooks/redux";
 import React, { useEffect } from "react";
 import { useTranslation } from "react-i18next";
 import { useNavigate } from "react-router";
+import { getOperationTypes } from "state/types/operations";
 import { PATHS } from "../../../../consts";
 import { OperationDTO } from "../../../../generated";
 import {
@@ -20,6 +21,7 @@ export const Operations = () => {
 
   useEffect(() => {
     dispatch(getOperations());
+    dispatch(getOperationTypes());
 
     return () => {
       dispatch(deleteOperationReset());

src/components/accessories/admin/suppliers/editSupplier/EditSupplier.tsx

@@ -24,7 +24,7 @@ export const EditSupplier = () => {
     if (state?.supId !== Number(id)) {
       navigate(PATHS.admin_suppliers);
     }
-  }, [id, state]);
+  }, [id, navigate, state]);
 
   return (
     <SupplierForm

src/components/accessories/admin/suppliers/supplierForm/SupplierForm.tsx

@@ -30,8 +30,6 @@ import TextField from "../../../textField/TextField";
 import "./styles.scss";
 import { ISupplierFormProps } from "./types";
 
-const FORMAT = /^([0-9]{3})?[0-9]{2,10}$/;
-
 const SupplierForm: FC<ISupplierFormProps> = ({
   fields,
   onSubmit,

src/components/accessories/admin/types/TypesAdmin.tsx

@@ -1,6 +1,6 @@
 import { useAppSelector } from "libraries/hooks/redux";
 import { sortBy } from "lodash";
-import React, { useEffect, useState } from "react";
+import React, { useEffect, useMemo, useState } from "react";
 import { useTranslation } from "react-i18next";
 import { Outlet, useLocation, useNavigate } from "react-router";
 import { PATHS } from "../../../../consts";
@@ -16,7 +16,11 @@ const TypesAdmin = () => {
   const { t } = useTranslation();
   const location = useLocation();
   const navigate = useNavigate();
-  const defaultTypeOption: TypeOption = { label: "", value: "" };
+  const defaultTypeOption: TypeOption = useMemo(
+    () => ({ label: "", value: "" }),
+    []
+  );
+
   const [selectedOption, setSelectedOption] =
     useState<TypeOption>(defaultTypeOption);
   const mode = useAppSelector((state) => state.types.config.mode);
@@ -57,7 +61,7 @@ const TypesAdmin = () => {
         setSelectedOption(defaultTypeOption);
       }
     }
-  }, [location]);
+  }, [defaultTypeOption, location, typeOptions]);
 
   const handleTypeChange = (value: string) => {
     if (value?.length > 0) {

src/components/accessories/admin/users/usersTable/UsersTable.tsx

@@ -9,6 +9,7 @@ import InfoBox from "../../../infoBox/InfoBox";
 import Table from "../../../table/Table";
 import { TFilterField } from "../../../table/filter/types";
 
+import { getUserGroups } from "state/usergroups";
 import classes from "./UsersTable.module.scss";
 
 interface IOwnProps {
@@ -21,6 +22,7 @@ export const UsersTable = ({ headerActions }: IOwnProps) => {
 
   useEffect(() => {
     dispatch(getUsers({}));
+    dispatch(getUserGroups());
   }, [dispatch]);
 
   const header = ["userName", "userGroupName", "desc"];
@@ -31,8 +33,21 @@ export const UsersTable = ({ headerActions }: IOwnProps) => {
     desc: t("user.description"),
   };
   const order = ["userName", "userGroupName", "desc"];
+  const userGroupOptions = useAppSelector(
+    (state) =>
+      state.usergroups.groupList.data?.map((item) => ({
+        value: item.code ?? "",
+        label: item.desc ?? item.code ?? "",
+      })) ?? []
+  );
 
   const filters: TFilterField[] = [
+    {
+      key: "userGroupName",
+      label: t("user.groups"),
+      type: "select",
+      options: userGroupOptions,
+    },
     { key: "userName", label: t("user.username"), type: "text" },
   ];
 
@@ -75,7 +90,10 @@ export const UsersTable = ({ headerActions }: IOwnProps) => {
                 filterColumns={filters}
                 manualFilter={false}
                 isCollapsabile={false}
-                rawData={data}
+                rawData={(data ?? []).map((user) => ({
+                  ...user,
+                  userGroupName: user.userGroupName?.code,
+                }))}
                 rowKey="userName"
                 headerActions={headerActions}
               />

src/components/accessories/admin/wards/wardForm/WardForm.tsx

@@ -11,6 +11,7 @@ import React, {
 } from "react";
 import { useTranslation } from "react-i18next";
 import { useNavigate } from "react-router";
+import { FIELD_VALIDATION } from "types";
 import { number, object, string } from "yup";
 import checkIcon from "../../../../../assets/check-icon.png";
 import warningIcon from "../../../../../assets/warning-icon.png";
@@ -49,8 +50,8 @@ const WardForm: FC<IWardProps> = ({
   const errorMessage = useMemo(
     () =>
       (creationMode
-        ? wardStore.create.error?.message
-        : wardStore.update.error?.message) ?? t("common.somethingwrong"),
+        ? t(wardStore.create.error?.message)
+        : t(wardStore.update.error?.message)) ?? t("common.somethingwrong"),
     [
       creationMode,
       t,
@@ -62,7 +63,9 @@ const WardForm: FC<IWardProps> = ({
   const initialValues = getFromFields(fields, "value");
 
   const validationSchema = object({
-    code: string().required(t("common.required")),
+    code: string()
+      .max(3, t("validations.maxLength", { max: 3 }))
+      .required(t("common.required")),
     description: string().required(t("common.required")),
     email: string().email(t("validations.email")),
     beds: number().min(0, t("validations.min", { min: 0 })),
@@ -133,6 +136,7 @@ const WardForm: FC<IWardProps> = ({
               onBlur={formik.handleBlur}
               type="text"
               disabled={isLoading || !creationMode}
+              required={FIELD_VALIDATION.REQUIRED}
             />
           </div>
           <div className="wardForm__item halfWidth">
@@ -145,6 +149,7 @@ const WardForm: FC<IWardProps> = ({
               onBlur={formik.handleBlur}
               type="text"
               disabled={isLoading}
+              required={FIELD_VALIDATION.REQUIRED}
             />
           </div>
         </div>

src/components/accessories/admin/wards/wardTable/WardTable.tsx

@@ -6,7 +6,7 @@ import { useTranslation } from "react-i18next";
 import checkIcon from "../../../../../assets/check-icon.png";
 import { WardDTO } from "../../../../../generated";
 import { scrollToElement } from "../../../../../libraries/uiUtils/scrollToElement";
-import { deleteWardReset } from "../../../../../state/ward";
+import { deleteWardReset, getWards } from "../../../../../state/ward";
 import ConfirmationDialog from "../../../confirmationDialog/ConfirmationDialog";
 import InfoBox from "../../../infoBox/InfoBox";
 import { TFilterField } from "../../../table/filter/types";
@@ -72,7 +72,14 @@ export const WardTable: FunctionComponent<IOwnProps> = ({
     if (deleteWard.status === "FAIL") {
       scrollToElement(infoBoxRef.current);
     }
-  }, [deleteWard.status]);
+
+    if (
+      deleteWard.status === "SUCCESS" ||
+      deleteWard.status === "SUCCESS_EMPTY"
+    ) {
+      dispatch(getWards());
+    }
+  }, [deleteWard.status, dispatch]);
 
   const formatDataToDisplay = (data: WardDTO[]) => {
     return data.map((item) => {

src/components/accessories/admission/PatientAdmission.tsx

@@ -83,7 +83,7 @@ const PatientAdmission: FC = () => {
     if (patientCode && creationMode) {
       dispatch(getLastOpd(parseInt(id!!)));
     }
-  }, [dispatch, patientCode, creationMode]);
+  }, [dispatch, patientCode, creationMode, id]);
 
   const fields = useFields(admissionToEdit, lastOpd?.disease);
 
@@ -157,7 +157,7 @@ const PatientAdmission: FC = () => {
       dispatch(getPatient(id!!));
       dispatch(getCurrentAdmission(parseInt(id!!)));
     }
-  }, [createStatus, updateStatus]);
+  }, [createStatus, dispatch, id, updateStatus]);
 
   const resetFormCallback = () => {
     setCreationMode(true);
@@ -173,7 +173,7 @@ const PatientAdmission: FC = () => {
     return () => {
       dispatch(getCurrentAdmissionReset());
     };
-  }, [dispatch]);
+  }, [dispatch, id]);
 
   const onEdit = (row: AdmissionDTO) => {
     setAdmissionToEdit(row);

src/components/accessories/appHeader/AppHeader.tsx

@@ -35,7 +35,7 @@ const AppHeader: FunctionComponent<IOwnProps> = ({ breadcrumbMap }) => {
   );
   useEffect(() => {
     dispatch(getHospital());
-  }, [dispatch, getHospital]);
+  }, [dispatch]);
 
   const hospital = useAppSelector(
     (state) => state.hospital.getHospital.data

src/components/accessories/appHeader/types.ts

@@ -1,5 +1,4 @@
 import { TUserCredentials } from "../../../state/main/types";
-import { TAPIResponseStatus } from "../../../state/types";
 
 export type TBreadcrumbMap = Record<string, string>;
 

src/components/accessories/autocompleteField/AutocompleteField.tsx

@@ -11,7 +11,6 @@ import _ from "lodash";
 import React, {
   ChangeEvent,
   FC,
-  Fragment,
   useCallback,
   useEffect,
   useState,
@@ -76,6 +75,7 @@ const AutocompleteField: FC<IProps> = ({
     }
   };
 
+  // eslint-disable-next-line react-hooks/exhaustive-deps
   const debounceUpdate = useCallback(
     debounce((value: any) => {
       setValue(value);
@@ -111,16 +111,6 @@ const AutocompleteField: FC<IProps> = ({
     return option.label;
   };
 
-  const isSelected = (option: DefaultOptionType, v: DefaultOptionType) => {
-    return option.value === v.value;
-  };
-
-  const rendOption = (props: any, option: DefaultOptionType | string) => {
-    return (
-      <Fragment>{typeof option === "string" ? option : option.label}</Fragment>
-    );
-  };
-
   const filter = createFilterOptions<DefaultOptionType>({
     limit: options_limit,
   });

src/components/accessories/billTable/BillTable.tsx

@@ -91,7 +91,7 @@ export const BillTable: FC<IBillTableProps> = ({ fields }) => {
         dispatch(searchBills(filter));
         break;
     }
-  }, [filter]);
+  }, [dispatch, filter]);
 
   const { setFieldValue, handleBlur } = formik;
 

src/components/accessories/billrecords/BillRecords.tsx

@@ -67,7 +67,7 @@ const BillRecords = () => {
     dispatch(deleteBillReset());
     dispatch(payBillReset());
     dispatch(closeBillReset());
-  }, []);
+  }, [dispatch]);
 
   useEffect(() => {
     if (patient && patient.code) {
@@ -275,7 +275,7 @@ const BillRecords = () => {
         }}
         handleSecondaryButtonClick={() => ({})}
       />
-      <iframe id="ifmcontentstoprint"></iframe>
+      <iframe id="ifmcontentstoprint" title="ifmcontentstoprint"></iframe>
     </div>
   );
 };