fix loader (#6204)

Co-authored-by: Mohammed Nihal <57055998+nihal467@users.noreply.github.com>
ohcnetwork · Sep 21, 2023 · c0f0e4b · c0f0e4b
1 parent f4bddb9
commit c0f0e4b
Showing 1 changed file with 56 additions and 55 deletions.
diff --git a/src/Components/Patient/PatientNotes.tsx b/src/Components/Patient/PatientNotes.tsx
@@ -101,10 +101,6 @@ const PatientNotes = (props: PatientNotesProps) => {
     });
   };
 
-  if (isLoading) {
-    return <Loading />;
-  }
-
   return (
     <div className="flex w-full flex-col">
       <PageTitle
@@ -119,6 +115,7 @@ const PatientNotes = (props: PatientNotesProps) => {
       <h3 className="pl-10 text-lg">Add new notes</h3>
       <textarea
         rows={3}
+        value={noteField}
         placeholder="Type your Note"
         className="mx-10 my-4 rounded-lg border border-gray-500 p-4 focus:border-primary-500 focus:outline-none focus:ring-primary-500"
         onChange={(e) => setNoteField(e.target.value)}
@@ -132,66 +129,70 @@ const PatientNotes = (props: PatientNotesProps) => {
           Post Your Note
         </ButtonV2>
       </div>
-      <div className="px-10 py-5">
-        <h3 className="text-lg">Added Notes</h3>
-        <div className="w-full">
-          {state.notes.length ? (
-            state.notes.map((note: any) => (
-              <div
-                key={note.id}
-                className="mt-4 flex w-full flex-col rounded-lg border border-gray-300 bg-white p-4 text-gray-800"
-              >
-                <span className="whitespace-pre-wrap break-words">
-                  {note.note}
-                </span>
-                <div className="mt-3">
-                  <span className="text-xs text-gray-500">
-                    {formatDateTime(note.created_date) || "-"}
+      {isLoading ? (
+        <Loading />
+      ) : (
+        <div className="px-10 py-5">
+          <h3 className="text-lg">Added Notes</h3>
+          <div className="w-full">
+            {state.notes.length ? (
+              state.notes.map((note: any) => (
+                <div
+                  key={note.id}
+                  className="mt-4 flex w-full flex-col rounded-lg border border-gray-300 bg-white p-4 text-gray-800"
+                >
+                  <span className="whitespace-pre-wrap break-words">
+                    {note.note}
                   </span>
-                </div>
-
-                <div className="space-y-2 sm:flex sm:space-y-0">
-                  <div className="mr-2 inline-flex w-full items-center justify-center rounded-md border bg-gray-100 py-1 pl-2 pr-3 md:w-auto">
-                    <div className="flex h-8 w-8 items-center justify-center rounded-full">
-                      <i className="fas fa-user" />
-                    </div>
-                    <span className="text-sm text-gray-700">
-                      {note.created_by_object?.first_name || "Unknown"}{" "}
-                      {note.created_by_object?.last_name}
+                  <div className="mt-3">
+                    <span className="text-xs text-gray-500">
+                      {formatDateTime(note.created_date) || "-"}
                     </span>
                   </div>
 
-                  <div
-                    className="inline-flex w-full cursor-pointer items-center justify-center rounded-md border bg-gray-100 py-1 pl-2 pr-3 md:w-auto"
-                    onClick={() => navigate(`/facility/${note.facility?.id}`)}
-                  >
-                    <div className="flex h-8 w-8 items-center justify-center rounded-full">
-                      <i className="fas fa-hospital" />
+                  <div className="space-y-2 sm:flex sm:space-y-0">
+                    <div className="mr-2 inline-flex w-full items-center justify-center rounded-md border bg-gray-100 py-1 pl-2 pr-3 md:w-auto">
+                      <div className="flex h-8 w-8 items-center justify-center rounded-full">
+                        <i className="fas fa-user" />
+                      </div>
+                      <span className="text-sm text-gray-700">
+                        {note.created_by_object?.first_name || "Unknown"}{" "}
+                        {note.created_by_object?.last_name}
+                      </span>
+                    </div>
+
+                    <div
+                      className="inline-flex w-full cursor-pointer items-center justify-center rounded-md border bg-gray-100 py-1 pl-2 pr-3 md:w-auto"
+                      onClick={() => navigate(`/facility/${note.facility?.id}`)}
+                    >
+                      <div className="flex h-8 w-8 items-center justify-center rounded-full">
+                        <i className="fas fa-hospital" />
+                      </div>
+                      <span className="text-sm text-gray-700">
+                        {note.facility?.name || "Unknown"}
+                      </span>
                     </div>
-                    <span className="text-sm text-gray-700">
-                      {note.facility?.name || "Unknown"}
-                    </span>
                   </div>
                 </div>
+              ))
+            ) : (
+              <div className="mt-2 flex items-center justify-center text-2xl font-bold text-gray-500">
+                No Notes Found
               </div>
-            ))
-          ) : (
-            <div className="mt-2 flex items-center justify-center text-2xl font-bold text-gray-500">
-              No Notes Found
-            </div>
-          )}
-          {state.count > pageSize && (
-            <div className="mt-4 flex w-full justify-center">
-              <Pagination
-                data={{ totalCount: state.count }}
-                onChange={handlePagination}
-                defaultPerPage={pageSize}
-                cPage={state.cPage}
-              />
-            </div>
-          )}
+            )}
+            {state.count > pageSize && (
+              <div className="mt-4 flex w-full justify-center">
+                <Pagination
+                  data={{ totalCount: state.count }}
+                  onChange={handlePagination}
+                  defaultPerPage={pageSize}
+                  cPage={state.cPage}
+                />
+              </div>
+            )}
+          </div>
         </div>
-      </div>
+      )}
     </div>
   );
 };