From c1e5f329c820e3d4807fc6d57025f774bdff96d7 Mon Sep 17 00:00:00 2001
From: Shivank Kacker <kacker.shivank@gmail.com>
Date: Tue, 3 Sep 2024 15:24:51 +0530
Subject: [PATCH] Fixed User page Spacing and added translations (#8462)

Co-authored-by: Khavin Shankar <khavinshankar@gmail.com>
---
 src/Components/Facility/FacilityUsers.tsx | 22 ++++++++++------------
 src/Locale/en/Common.json                 |  2 ++
 src/Locale/en/Users.json                  |  6 ++++--
 3 files changed, 16 insertions(+), 14 deletions(-)

diff --git a/src/Components/Facility/FacilityUsers.tsx b/src/Components/Facility/FacilityUsers.tsx
index 61231ed7d21..2572731f720 100644
--- a/src/Components/Facility/FacilityUsers.tsx
+++ b/src/Components/Facility/FacilityUsers.tsx
@@ -27,7 +27,6 @@ export default function FacilityUsers(props: any) {
   const [currentPage, setCurrentPage] = useState(1);
   const [expandFacilityList, setExpandFacilityList] = useState(false);
   const [selectedUser, setSelectedUser] = useState<any | null>(null);
-  // eslint-disable-next-line @typescript-eslint/no-unused-vars
   const [offset, setOffset] = useState(0);
 
   const [linkFacility, setLinkFacility] = useState<{
@@ -103,7 +102,7 @@ export default function FacilityUsers(props: any) {
       onResponse: ({ res }) => {
         if (res?.status === 204) {
           Notification.Success({
-            msg: "User deleted successfully",
+            msg: t("user_deleted_successfuly"),
           });
         }
       },
@@ -152,7 +151,7 @@ export default function FacilityUsers(props: any) {
                     </div>
                   )}
                   <div className="min-width-50 shrink-0 text-sm text-secondary-600">
-                    Last Online:{" "}
+                    {t("last_online")}{" "}
                     <span
                       aria-label="Online"
                       className={
@@ -165,7 +164,7 @@ export default function FacilityUsers(props: any) {
                     <span className="pl-2">
                       {user.last_login
                         ? relativeTime(user.last_login)
-                        : "Never"}
+                        : t("never")}
                     </span>
                   </div>
                 </div>
@@ -189,7 +188,7 @@ export default function FacilityUsers(props: any) {
                       <div className="flex justify-between py-4">
                         <div>
                           <div className="leading-relaxed text-secondary-500">
-                            Phone:
+                            {t("phone_number")}
                           </div>
                           <a
                             href={`tel:${user.phone_number}`}
@@ -214,7 +213,7 @@ export default function FacilityUsers(props: any) {
                       }}
                     >
                       <CareIcon icon="l-hospital" className="text-lg" />
-                      <p>Linked Facilities</p>
+                      <p>{t("linked_facilities")}</p>
                     </ButtonV2>
                   </UserDetails>
                 )}
@@ -250,7 +249,7 @@ export default function FacilityUsers(props: any) {
     manageUsers = (
       <div>
         <div>
-          <h5> No Users Found</h5>
+          <h5>{t("no_users_found")}</h5>
         </div>
       </div>
     );
@@ -258,9 +257,8 @@ export default function FacilityUsers(props: any) {
 
   return (
     <Page
-      title={`Users - ${facilityData?.name}`}
+      title={`${t("users")} - ${facilityData?.name}`}
       hideBack={true}
-      className="mx-3 md:mx-8"
       breadcrumbs={false}
     >
       {linkFacility.show && (
@@ -271,10 +269,10 @@ export default function FacilityUsers(props: any) {
         />
       )}
 
-      <div className="m-4 mt-5 grid grid-cols-1 sm:grid-cols-3 md:gap-5 md:px-4">
+      <div className="mt-5 grid grid-cols-1 sm:grid-cols-3 md:gap-5">
         {facilityUserData && (
           <CountBlock
-            text="Total Users"
+            text={t("total_users")}
             count={facilityUserData.count}
             loading={isLoading}
             icon="l-user-injured"
@@ -291,7 +289,7 @@ export default function FacilityUsers(props: any) {
       >
         <UserFacilities user={selectedUser} />
       </SlideOverCustom>
-      <div className="px-3 md:px-8">
+      <div>
         <div>{manageUsers}</div>
       </div>
       {userData.show && (
diff --git a/src/Locale/en/Common.json b/src/Locale/en/Common.json
index 085442963a0..24855e05d70 100644
--- a/src/Locale/en/Common.json
+++ b/src/Locale/en/Common.json
@@ -195,6 +195,8 @@
   "discharged": "Discharged",
   "archived": "Archived",
   "no_changes_made": "No changes made",
+  "user_deleted_successfuly": "User Deleted Successfuly",
+  "users": "Users",
   "are_you_sure_want_to_delete": "Are you sure you want to delete {{name}}?",
   "oxygen_information": "Oxygen Information",
   "deleted_successfully": "{{name}} deleted successfully",
diff --git a/src/Locale/en/Users.json b/src/Locale/en/Users.json
index 01fe031c61a..035ed8933a5 100644
--- a/src/Locale/en/Users.json
+++ b/src/Locale/en/Users.json
@@ -4,11 +4,13 @@
   "add_new_user": "Add New User",
   "no_users_found": "No Users Found",
   "home_facility": "Home Facility",
-  "no_home_facility" : "No home facility assigned",
+  "no_home_facility": "No home facility assigned",
   "clear_home_facility": "Clear Home Facility",
   "linked_facilities": "Linked Facilities",
   "no_linked_facilities": "No Linked Facilities",
   "average_weekly_working_hours": "Average weekly working hours",
   "set_average_weekly_working_hours_for": "Set Average weekly working hours for",
-  "search_by_username": "Search by username"
+  "search_by_username": "Search by username",
+  "last_online": "Last Online",
+  "total_users": "Total Users"
 }