OH2-240 | Improve discharge page

src/components/accessories/currentAdmission/CurrentAdmission.tsx

@@ -13,7 +13,6 @@ import { IOwnProps } from "./types";
 export const CurrentAdmission: FunctionComponent<IOwnProps> = ({
   onEditChange,
 }) => {
-  const { t } = useTranslation();
   const dispatch = useDispatch();
   const [editionMode, setEditionMode] = useState(false);
   const currentAdmission = useSelector(
@@ -50,14 +49,16 @@ export const CurrentAdmission: FunctionComponent<IOwnProps> = ({
   };
 
   useEffect(() => {
-    onEditChange(editionMode);
+    if (onEditChange) {
+      onEditChange(editionMode);
+    }
   }, [editionMode]);
 
   return (
     <div className="currentAdmission">
       {currentAdmission && !editionMode && (
         <CurrentAdmissionData
-          onEdit={handleEdit}
+          onEdit={onEditChange ? handleEdit : undefined}
           admission={currentAdmission}
         />
       )}

src/components/accessories/currentAdmission/currentAdmissionData/CurrentAdmissionData.tsx

@@ -2,20 +2,13 @@ import { IconButton } from "@material-ui/core";
 import { Edit } from "@material-ui/icons";
 import React, { FunctionComponent } from "react";
 import { useTranslation } from "react-i18next";
-import { useDispatch, useSelector } from "react-redux";
-import { AdmissionDTO, PatientDTO } from "../../../../generated";
-import { parseDate } from "../../../../libraries/formDataHandling/functions";
-import { IState } from "../../../../types";
-import Button from "../../button/Button";
-import TextField from "../../textField/TextField";
+import { AdmissionDTO } from "../../../../generated";
 import "../styles.scss";
-import AutocompleteField from "../../autocompleteField/AutocompleteField";
-import DateField from "../../dateField/DateField";
 import isEmpty from "lodash.isempty";
 import { renderDate } from "../../../../libraries/formatUtils/dataFormatting";
 
 interface IOwnProps {
-  onEdit: () => void;
+  onEdit?: () => void;
   admission: AdmissionDTO;
 }
 
@@ -28,9 +21,11 @@ export const CurrentAdmissionData: FunctionComponent<IOwnProps> = ({
   return (
     <div className="currentAdmissionData">
       <div className="currentAdmission_leading">
-        <IconButton onClick={onEdit}>
-          <Edit />
-        </IconButton>
+        {onEdit && (
+          <IconButton onClick={onEdit}>
+            <Edit />
+          </IconButton>
+        )}
       </div>
       <div className="currentAdmissionData__content">
         {!isEmpty(admission?.ward?.description) && (

src/components/accessories/currentAdmission/types.ts

@@ -1,3 +1,3 @@
 export interface IOwnProps {
-  onEditChange: (value: boolean) => void;
+  onEditChange?: (value: boolean) => void;
 }

src/components/accessories/discharge/PatientDischarge.tsx

@@ -18,6 +18,7 @@ import { useFields } from "./useFields";
 import DischargeForm from "./dischargeForm/DischargeForm";
 import { getPatientThunk } from "../../../state/patients/actions";
 import { parseDate } from "../../../libraries/formDataHandling/functions";
+import { CurrentAdmission } from "../currentAdmission/CurrentAdmission";
 
 const PatientDischarge: FC = () => {
   const { t } = useTranslation();
@@ -106,16 +107,19 @@ const PatientDischarge: FC = () => {
   return (
     <div className="patientAdmission">
       {currentAdmissionStatus === "SUCCESS" && (
-        <DischargeForm
-          fields={fields}
-          onSubmit={onSubmit}
-          submitButtonLabel={t("common.save")}
-          resetButtonLabel={t("common.reset")}
-          shouldResetForm={shouldResetForm}
-          resetFormCallback={resetFormCallback}
-          isLoading={dischargeStatus === "LOADING"}
-          admission={currentAdmission}
-        />
+        <>
+          <CurrentAdmission />
+          <DischargeForm
+            fields={fields}
+            onSubmit={onSubmit}
+            submitButtonLabel={t("common.save")}
+            resetButtonLabel={t("common.reset")}
+            shouldResetForm={shouldResetForm}
+            resetFormCallback={resetFormCallback}
+            isLoading={dischargeStatus === "LOADING"}
+            admission={currentAdmission}
+          />
+        </>
       )}
       {currentAdmissionStatus === "SUCCESS_EMPTY" && (
         <div ref={infoBoxRef} className="info-box-container">

src/components/accessories/discharge/dischargeForm/DischargeForm.tsx

@@ -238,19 +238,6 @@ const DischargeForm: FC<DischargeProps> = ({
             </div>
           </div>
           <div className="row start-sm center-xs">
-            <div className="fullWidth patientAdmissionForm__item">
-              <AutocompleteField
-                fieldName="disType"
-                fieldValue={formik.values.disType}
-                label={t("admission.disType")}
-                isValid={isValid("disType")}
-                errorText={getErrorText("disType")}
-                onBlur={onBlurCallback("disType")}
-                options={renderOptions(dischargeTypes)}
-                loading={disTypeStatus === "LOADING"}
-                disabled={isLoading}
-              />
-            </div>
             <div className="fullWidth patientAdmissionForm__item">
               <AutocompleteField
                 fieldName="diseaseOut1"
@@ -290,6 +277,19 @@ const DischargeForm: FC<DischargeProps> = ({
                 disabled={isLoading}
               />
             </div>
+            <div className="fullWidth patientAdmissionForm__item">
+              <AutocompleteField
+                fieldName="disType"
+                fieldValue={formik.values.disType}
+                label={t("admission.disType")}
+                isValid={isValid("disType")}
+                errorText={getErrorText("disType")}
+                onBlur={onBlurCallback("disType")}
+                options={renderOptions(dischargeTypes)}
+                loading={disTypeStatus === "LOADING"}
+                disabled={isLoading}
+              />
+            </div>
           </div>
 
           <div className="row start-sm center-xs">