Removes usages of Legacy Components that are not covered by #5006 (#5763

) * deletes unused component: `DiagnosisSelect` * updates SwitchV2 to use new components * updates consultationform to use new fielderror * replaces error component in doctor capacity * deletes unused externalresultbodyselector * use new user select field in shift details update form
ohcnetwork · Jun 28, 2023 · be67cf3 · be67cf3
1 parent 1365104
commit be67cf3
Show file tree

Hide file tree

Showing 7 changed files with 32 additions and 180 deletions.
diff --git a/src/Components/Common/DiagnosisSelect.tsx b/src/Components/Common/DiagnosisSelect.tsx
diff --git a/src/Components/Common/UserAutocompleteFormField.tsx b/src/Components/Common/UserAutocompleteFormField.tsx
@@ -1,5 +1,5 @@
 import { useAsyncOptions } from "../../Common/hooks/useAsyncOptions";
-import { getUserList } from "../../Redux/actions";
+import { getFacilityUsers, getUserList } from "../../Redux/actions";
 import { Autocomplete } from "../Form/FormFields/Autocomplete";
 import FormField from "../Form/FormFields/FormField";
 import {
@@ -10,6 +10,7 @@ import { UserModel } from "../Users/models";
 
 type Props = FormFieldBaseProps<UserModel> & {
   placeholder?: string;
+  facilityId?: string;
 };
 
 export default function UserAutocompleteFormField(props: Props) {
@@ -32,7 +33,11 @@ export default function UserAutocompleteFormField(props: Props) {
         optionDescription={(option) => `${option.user_type}`}
         optionValue={(option) => option}
         onQuery={(query) =>
-          fetchOptions(getUserList({ limit: 5, offset: 0, search_text: query }))
+          fetchOptions(
+            props.facilityId
+              ? getFacilityUsers(props.facilityId)
+              : getUserList({ limit: 5, offset: 0, search_text: query })
+          )
         }
         isLoading={isLoading}
       />

diff --git a/src/Components/Common/components/Switch.tsx b/src/Components/Common/components/Switch.tsx
@@ -1,5 +1,4 @@
-import { FieldLabel } from "../../Form/FormFields/FormField";
-import { LegacyErrorHelperText } from "../HelperInputFields";
+import { FieldErrorText, FieldLabel } from "../../Form/FormFields/FormField";
 
 type SwitchProps<T> = {
   name?: string;
@@ -51,7 +50,7 @@ export default function SwitchV2<T>(props: SwitchProps<T>) {
           );
         })}
       </ul>
-      <LegacyErrorHelperText error={props.error} />
+      <FieldErrorText error={props.error} />
     </div>
   );
 }
diff --git a/src/Components/ExternalResult/ExternalResultLocalbodySelector.tsx b/src/Components/ExternalResult/ExternalResultLocalbodySelector.tsx
diff --git a/src/Components/Facility/ConsultationForm.tsx b/src/Components/Facility/ConsultationForm.tsx
@@ -19,7 +19,6 @@ import {
 } from "../../Redux/actions";
 import * as Notification from "../../Utils/Notifications.js";
 import { FacilitySelect } from "../Common/FacilitySelect";
-import { LegacyErrorHelperText } from "../Common/HelperInputFields";
 import { BedModel, FacilityModel } from "./models";
 import { OnlineUsersSelect } from "../Common/OnlineUsersSelect";
 import { UserModel } from "../Users/models";
@@ -36,7 +35,7 @@ import { ICD11DiagnosisModel } from "./models";
 import { Cancel, Submit } from "../Common/components/ButtonV2";
 import TextAreaFormField from "../Form/FormFields/TextAreaFormField";
 import { FieldChangeEventHandler } from "../Form/FormFields/Utils";
-import { FieldLabel } from "../Form/FormFields/FormField";
+import { FieldErrorText, FieldLabel } from "../Form/FormFields/FormField";
 import PatientCategorySelect from "../Patient/PatientCategorySelect";
 import { SelectFormField } from "../Form/FormFields/SelectFormField";
 import TextFormField from "../Form/FormFields/TextFormField";
@@ -1140,7 +1139,7 @@ export const ConsultationForm = (props: any) => {
                                 });
                               }}
                             />
-                            <LegacyErrorHelperText
+                            <FieldErrorText
                               error={state.errors.investigation}
                             />
                           </div>
@@ -1159,9 +1158,7 @@ export const ConsultationForm = (props: any) => {
                                 });
                               }}
                             />
-                            <LegacyErrorHelperText
-                              error={state.errors.procedure}
-                            />
+                            <FieldErrorText error={state.errors.procedure} />
                           </div>
                           <div
                             className="col-span-6"

diff --git a/src/Components/Facility/DoctorCapacity.tsx b/src/Components/Facility/DoctorCapacity.tsx
@@ -4,12 +4,11 @@ import { DOCTOR_SPECIALIZATION } from "../../Common/constants";
 import { statusType, useAbortableEffect } from "../../Common/utils";
 import { createDoctor, getDoctor, listDoctor } from "../../Redux/actions";
 import * as Notification from "../../Utils/Notifications.js";
-import { LegacyErrorHelperText } from "../Common/HelperInputFields";
 import { DoctorModal, OptionsType } from "./models";
 import ButtonV2, { Cancel } from "../Common/components/ButtonV2";
 import SelectMenuV2 from "../Form/SelectMenuV2";
 import TextFormField from "../Form/FormFields/TextFormField";
-import { FieldLabel } from "../Form/FormFields/FormField";
+import { FieldErrorText, FieldLabel } from "../Form/FormFields/FormField";
 import { FieldChangeEventHandler } from "../Form/FormFields/Utils";
 
 interface DoctorCapacityProps extends DoctorModal {
@@ -230,7 +229,7 @@ export const DoctorCapacity = (props: DoctorCapacityProps) => {
               }
               disabled={!!id}
             />
-            <LegacyErrorHelperText error={state.errors.area} />
+            <FieldErrorText error={state.errors.area} />
           </div>
           <div>
             <TextFormField

diff --git a/src/Components/Shifting/ShiftDetailsUpdate.tsx b/src/Components/Shifting/ShiftDetailsUpdate.tsx
@@ -23,7 +23,6 @@ import PhoneNumberFormField from "../Form/FormFields/PhoneNumberFormField";
 import { SelectFormField } from "../Form/FormFields/SelectFormField.js";
 import TextAreaFormField from "../Form/FormFields/TextAreaFormField";
 import TextFormField from "../Form/FormFields/TextFormField";
-import { UserSelect } from "../Common/UserSelect";
 import loadable from "@loadable/component";
 import { parsePhoneNumberFromString } from "libphonenumber-js";
 import useAppHistory from "../../Common/hooks/useAppHistory";
@@ -34,6 +33,8 @@ import CircularProgress from "../Common/components/CircularProgress.js";
 import Card from "../../CAREUI/display/Card";
 import RadioFormField from "../Form/FormFields/RadioFormField.js";
 import Page from "../Common/components/Page.js";
+import UserAutocompleteFormField from "../Common/UserAutocompleteFormField.js";
+import { UserModel } from "../Users/models.js";
 
 const Loading = loadable(() => import("../Common/Loading"));
 
@@ -47,7 +48,7 @@ export const ShiftDetailsUpdate = (props: patientShiftProps) => {
   const dispatchAction: any = useDispatch();
   const [qParams, _] = useQueryParams();
   const [isLoading, setIsLoading] = useState(true);
-  const [assignedUser, SetAssignedUser] = useState(null);
+  const [assignedUser, SetAssignedUser] = useState<UserModel>();
   const [assignedUserLoading, setAssignedUserLoading] = useState(false);
   const [consultationData, setConsultationData] = useState<ConsultationModel>(
     {} as ConsultationModel
@@ -158,7 +159,8 @@ export const ShiftDetailsUpdate = (props: patientShiftProps) => {
     return !isInvalidForm;
   };
 
-  const handleOnSelect = (user: any) => {
+  const handleAssignedUserSelect = (event: FieldChangeEvent<UserModel>) => {
+    const user = event.value;
     const form = { ...state.form };
     form["assigned_to"] = user?.id;
     SetAssignedUser(user);
@@ -320,24 +322,19 @@ export const ShiftDetailsUpdate = (props: patientShiftProps) => {
             className="bg-white w-full md:leading-5 mt-2 md:col-span-1"
           />
 
-          {wartime_shifting && (
-            <div>
-              <FieldLabel>{t("assigned_to")}</FieldLabel>
-              {assignedUserLoading ? (
-                <CircularProgress />
-              ) : (
-                <UserSelect
-                  multiple={false}
-                  selected={assignedUser}
-                  setSelected={handleOnSelect}
-                  errors={""}
-                  facilityId={
-                    state.form?.shifting_approving_facility_object?.id
-                  }
-                />
-              )}
-            </div>
-          )}
+          {wartime_shifting &&
+            (assignedUserLoading ? (
+              <CircularProgress />
+            ) : (
+              <UserAutocompleteFormField
+                name="assigned_to"
+                label={t("assigned_to")}
+                value={assignedUser}
+                onChange={handleAssignedUserSelect}
+                facilityId={state.form?.shifting_approving_facility_object?.id}
+                error={state.errors.assigned_to}
+              />
+            ))}
 
           {wartime_shifting && (
             <div>