diff --git a/public/locale/en.json b/public/locale/en.json
index 5d33733b15c..64448127e51 100644
--- a/public/locale/en.json
+++ b/public/locale/en.json
@@ -28,7 +28,6 @@
   "CONSCIOUSNESS_LEVEL__RESPONDS_TO_PAIN": "Responds to Pain",
   "CONSCIOUSNESS_LEVEL__RESPONDS_TO_VOICE": "Responds to Voice",
   "CONSCIOUSNESS_LEVEL__UNRESPONSIVE": "Unresponsive",
-  "Cancel": "Cancel",
   "DAYS_OF_WEEK_SHORT__0": "Mon",
   "DAYS_OF_WEEK_SHORT__1": "Tue",
   "DAYS_OF_WEEK_SHORT__2": "Wed",
@@ -355,6 +354,7 @@
   "age_input_warning_bold": "Recommended only when the patient's date of birth is unknown",
   "age_less_than_0": "Age cannot be less than 0",
   "age_notice": "Only year of birth will be stored for age.",
+  "ago": "ago",
   "all": "All",
   "all_changes_have_been_saved": "All changes have been saved",
   "all_details": "All Details",
@@ -485,6 +485,7 @@
   "cancelled": "Cancelled",
   "capture": "Capture",
   "capture_cover_photo": "Capture Cover Photo",
+  "card": "Card",
   "care": "CARE",
   "category": "Category",
   "caution": "Caution",
@@ -655,6 +656,7 @@
   "csv_file_in_the_specified_format": "Select a CSV file in the specified format",
   "current_address": "Current Address",
   "current_password": "Current Password",
+  "current_role": "Current Role",
   "current_status": "Current Status",
   "customer_support_email": "Customer Support Email",
   "customer_support_name": "Customer Support Name",
@@ -675,7 +677,6 @@
   "date_of_return": "Date of Return",
   "date_of_test": "Date of sample collection for Covid testing",
   "day": "Day",
-  "days": "Days",
   "death_report": "Death Report",
   "delete": "Delete",
   "delete_account": "Delete account",
@@ -763,7 +764,9 @@
   "edit_policy_description": "Add or edit patient's insurance details",
   "edit_prescriptions": "Edit Prescriptions",
   "edit_profile": "Edit Profile",
+  "edit_role": "Edit Role",
   "edit_user_profile": "Edit Profile",
+  "edit_user_role": "Edit User Role",
   "edited_by": "Edited by",
   "edited_on": "Edited on",
   "education": "Education",
@@ -1029,7 +1032,6 @@
   "home_facility_cleared_success": "Home Facility cleared successfully",
   "home_facility_updated_error": "Error while updating Home Facility",
   "home_facility_updated_success": "Home Facility updated successfully",
-  "hours": "hours",
   "hubs": "Hub Facilities",
   "i_declare": "I hereby declare that:",
   "icd11_as_recommended": "As per ICD-11 recommended by WHO",
@@ -1113,6 +1115,7 @@
   "last_administered": "Last administered",
   "last_discharge_reason": "Last Discharge Reason",
   "last_edited": "Last Edited",
+  "last_login": "Last Login",
   "last_modified": "Last Modified",
   "last_modified_by": "Last Modified By",
   "last_name": "Last Name",
@@ -1226,6 +1229,7 @@
   "nationality": "Nationality",
   "nearby_facilities": "Nearby Facilities",
   "never": "never",
+  "never_logged_in": "Never Logged In",
   "new_password": "New Password",
   "new_password_confirmation": "Confirm New Password",
   "new_password_same_as_old": "New password is same as old password, please enter a different new password.",
@@ -1538,6 +1542,8 @@
   "reload": "Reload",
   "remove": "Remove",
   "remove_user": "Remove User",
+  "remove_user_organization": "Remove User from Organization",
+  "remove_user_warn": "Are you sure you want to remove {{firstName}} {{lastName}} from this organization? This action cannot be undone.",
   "rename": "Rename",
   "replace_home_facility": "Replace Home Facility",
   "replace_home_facility_confirm": "Are you sure you want to replace",
@@ -1634,7 +1640,9 @@
   "select_all": "Select All",
   "select_date": "Select date",
   "select_department": "Select Department",
+  "select_diff_role": "Please select a different role",
   "select_eligible_policy": "Select an Eligible Insurance Policy",
+  "select_facility": "Select Facility",
   "select_facility_for_discharged_patients_warning": "Facility needs to be selected to view discharged patients.",
   "select_for_administration": "Select for Administration",
   "select_groups": "Select Groups",
@@ -1642,6 +1650,7 @@
   "select_investigation_groups": "Select Investigation Groups",
   "select_investigations": "Select Investigations",
   "select_local_body": "Select Local Body",
+  "select_new_role": "Select New Role",
   "select_patient": "Select Patient",
   "select_policy": "Select an Insurance Policy",
   "select_policy_to_add_items": "Select a Policy to Add Items",
@@ -1827,9 +1836,11 @@
   "update_preset_position_to_current": "Update preset's position to camera's current position",
   "update_record": "Update Record",
   "update_record_for_asset": "Update record for asset",
+  "update_role": "Update Role",
   "update_shift_request": "Update Shift Request",
   "update_status": "Update Status",
   "update_status_details": "Update Status/Details",
+  "update_user_role_organization": "Update the role for this user in the organization",
   "update_volunteer": "Reassign Volunteer",
   "updated": "Updated",
   "updated_on": "Updated On",
@@ -1859,6 +1870,8 @@
   "user_not_available_for_appointments": "This user is not available for appointments",
   "user_qualifications": "Qualifications",
   "user_qualifications_note": "Enter appropriate qualifications for this user",
+  "user_removed_success": "User removed from organization successfully",
+  "user_role_update_success": "User role updated successfully",
   "user_type": "User Type",
   "username": "Username",
   "username_already_exists": "This username already exists",
@@ -1896,6 +1909,7 @@
   "view_cns": "View CNS",
   "view_consultation": "View Latest Encounter",
   "view_consultation_and_log_updates": "View Consultation / Log Updates",
+  "view_dashboard": "View Dashboard",
   "view_details": "View Details",
   "view_facility": "View Facility",
   "view_files": "View Files",
diff --git a/src/components/Users/UserListAndCard.tsx b/src/components/Users/UserListAndCard.tsx
index e436afe6e15..6422f096f2f 100644
--- a/src/components/Users/UserListAndCard.tsx
+++ b/src/components/Users/UserListAndCard.tsx
@@ -4,6 +4,8 @@ import { useTranslation } from "react-i18next";
 import Card from "@/CAREUI/display/Card";
 import CareIcon from "@/CAREUI/icons/CareIcon";
 
+import { Badge } from "@/components/ui/badge";
+
 import { Avatar } from "@/components/Common/Avatar";
 import Tabs from "@/components/Common/Tabs";
 import SearchInput from "@/components/Form/SearchInput";
@@ -14,12 +16,7 @@ import useWindowDimensions from "@/hooks/useWindowDimensions";
 
 import { USER_TYPE_OPTIONS } from "@/common/constants";
 
-import {
-  classNames,
-  formatName,
-  isUserOnline,
-  relativeTime,
-} from "@/Utils/utils";
+import { formatName, isUserOnline, relativeTime } from "@/Utils/utils";
 import { UserBase } from "@/types/user/user";
 
 export const GetUserTypes = () => {
@@ -65,11 +62,7 @@ const GetDetailsButton = (username: string) => {
     </div>
   );
 };
-const getNameAndStatusCard = (
-  user: UserBase,
-  cur_online: boolean,
-  showDetailsButton = false,
-) => {
+const getNameAndStatusCard = (user: UserBase, showDetailsButton = false) => {
   return (
     <div>
       <div className="flex flex-row justify-between gap-x-3">
@@ -78,14 +71,7 @@ const getNameAndStatusCard = (
             <h1 id={`name-${user.username}`} className="text-base font-bold">
               {formatName(user)}
             </h1>
-            <div
-              className={classNames(
-                "flex items-center gap-2 rounded-full px-3 py-1",
-                cur_online ? "bg-green-100" : "bg-gray-100",
-              )}
-            >
-              <UserStatusIndicator user={user} />
-            </div>
+            <UserStatusIndicator user={user} />
           </div>
           <span
             className="text-sm text-gray-500"
@@ -102,8 +88,8 @@ const getNameAndStatusCard = (
 
 export const UserStatusIndicator = ({
   user,
-  className,
   addPadding = false,
+  className = "",
 }: {
   user: UserBase;
   className?: string;
@@ -111,37 +97,32 @@ export const UserStatusIndicator = ({
 }) => {
   const authUser = useAuthUser();
   const isAuthUser = user.id === authUser.external_id;
-  const isOnline = isUserOnline(user) || isAuthUser;
   const { t } = useTranslation();
 
   return (
-    <div
-      className={classNames(
-        "inline-flex items-center gap-2 rounded-full",
-        addPadding ? "px-3 py-1" : "py-px",
-        isOnline ? "bg-green-100" : "bg-gray-100",
-        className,
-      )}
+    <span
+      title={`${new Date(user.last_login).toLocaleString()}`}
+      className={`${addPadding ? "px-3 py-1" : "py-px"} ${className}`}
     >
-      <span
-        className={classNames(
-          "inline-block h-2 w-2 shrink-0 rounded-full",
-          isOnline ? "bg-green-500" : "bg-gray-400",
-        )}
-      ></span>
-      <span
-        className={classNames(
-          "whitespace-nowrap text-xs",
-          isOnline ? "text-green-700" : "text-gray-500",
-        )}
-      >
-        {isOnline
-          ? t("online")
-          : user.last_login
-            ? relativeTime(user.last_login)
-            : t("never")}
-      </span>
-    </div>
+      {isUserOnline(user) || isAuthUser ? (
+        <Badge variant="secondary" className="bg-green-100 whitespace-nowrap">
+          <span className="inline-block h-2 w-2 shrink-0 rounded-full bg-green-500 mr-2" />
+          <span className="text-xs text-green-700">{t("online")}</span>
+        </Badge>
+      ) : user.last_login ? (
+        <Badge variant="secondary" className="bg-yellow-100 whitespace-nowrap">
+          <span className="inline-block h-2 w-2 shrink-0 rounded-full bg-yellow-500 mr-2" />
+          <span className="text-xs text-yellow-700">
+            {relativeTime(user.last_login)}
+          </span>
+        </Badge>
+      ) : (
+        <Badge variant="secondary" className="bg-gray-100 whitespace-nowrap">
+          <span className="inline-block h-2 w-2 shrink-0 rounded-full bg-gray-500 mr-2" />
+          <span className="text-xs text-gray-700">{t("never_logged_in")}</span>
+        </Badge>
+      )}
+    </span>
   );
 };
 const UserCard = ({ user }: { user: UserBase }) => {
@@ -173,7 +154,7 @@ const UserCard = ({ user }: { user: UserBase }) => {
             </div>
             <div className="flex flex-col w-full">
               {!isMediumScreen &&
-                getNameAndStatusCard(user, userOnline, !isLessThanXLargeScreen)}
+                getNameAndStatusCard(user, !isLessThanXLargeScreen)}
               <div className="mt-4 grid grid-cols-2 gap-x-4 gap-y-4">
                 <div className="text-sm">
                   <div className="text-gray-500">{t("role")}</div>
@@ -312,7 +293,7 @@ export default function UserListView({
               text: (
                 <div className="flex items-center gap-2">
                   <CareIcon icon="l-credit-card" className="text-lg" />
-                  <span>Card</span>
+                  <span>{t("card")}</span>
                 </div>
               ),
               value: 0,
@@ -322,7 +303,7 @@ export default function UserListView({
               text: (
                 <div className="flex items-center gap-2">
                   <CareIcon icon="l-list-ul" className="text-lg" />
-                  <span>List</span>
+                  <span>{t("list")}</span>
                 </div>
               ),
               value: 1,
@@ -345,7 +326,7 @@ export default function UserListView({
       ) : (
         <div className="h-full space-y-2 rounded-lg bg-white p-7 shadow">
           <div className="flex w-full items-center justify-center text-xl font-bold text-secondary-500">
-            No Users Found
+            {t("no_users_found")}
           </div>
         </div>
       )}
diff --git a/src/components/ui/sidebar/facility-switcher.tsx b/src/components/ui/sidebar/facility-switcher.tsx
index 59715e4e02c..0769f2a825f 100644
--- a/src/components/ui/sidebar/facility-switcher.tsx
+++ b/src/components/ui/sidebar/facility-switcher.tsx
@@ -1,6 +1,7 @@
 import { CaretSortIcon, DashboardIcon } from "@radix-ui/react-icons";
 import { Hospital } from "lucide-react";
 import { navigate } from "raviger";
+import { useTranslation } from "react-i18next";
 
 import {
   DropdownMenu,
@@ -27,6 +28,7 @@ export function FacilitySwitcher({
   selectedFacility: UserFacilityModel | null;
 }) {
   const { isMobile, setOpenMobile } = useSidebar();
+  const { t } = useTranslation();
 
   return (
     <SidebarMenu>
@@ -42,7 +44,7 @@ export function FacilitySwitcher({
               </div>
               <div className="grid flex-1 text-left text-sm leading-tight">
                 <span className="truncate font-semibold">
-                  {selectedFacility?.name || "Select Facility"}
+                  {selectedFacility?.name || t("select_facility")}
                 </span>
               </div>
               <CaretSortIcon className="ml-auto" />
@@ -56,10 +58,10 @@ export function FacilitySwitcher({
           >
             <DropdownMenuItem onClick={() => navigate("/")}>
               <DashboardIcon className="size-4" />
-              View Dashboard
+              {t("view_dashboard")}
             </DropdownMenuItem>
             <DropdownMenuSeparator />
-            <DropdownMenuLabel>Facilities</DropdownMenuLabel>
+            <DropdownMenuLabel>{t("facilities")}</DropdownMenuLabel>
             <DropdownMenuSeparator />
             {facilities.map((facility, index) => (
               <DropdownMenuItem
diff --git a/src/pages/FacilityOrganization/FacilityOrganizationUsers.tsx b/src/pages/FacilityOrganization/FacilityOrganizationUsers.tsx
index 66daaa42b55..f467018fe08 100644
--- a/src/pages/FacilityOrganization/FacilityOrganizationUsers.tsx
+++ b/src/pages/FacilityOrganization/FacilityOrganizationUsers.tsx
@@ -1,13 +1,14 @@
 import { useQuery } from "@tanstack/react-query";
 import { useQueryParams } from "raviger";
+import { useTranslation } from "react-i18next";
 
 import CareIcon from "@/CAREUI/icons/CareIcon";
 
-import { Badge } from "@/components/ui/badge";
 import { Button } from "@/components/ui/button";
 import { Card, CardContent } from "@/components/ui/card";
 
 import { Avatar } from "@/components/Common/Avatar";
+import { UserStatusIndicator } from "@/components/Users/UserListAndCard";
 
 import routes from "@/Utils/request/api";
 import query from "@/Utils/request/query";
@@ -28,6 +29,7 @@ export default function FacilityOrganizationUsers({ id, facilityId }: Props) {
     sheet: string;
     username: string;
   }>();
+  const { t } = useTranslation();
 
   const openAddUserSheet = qParams.sheet === "add";
   const openLinkUserSheet = qParams.sheet === "link";
@@ -70,7 +72,7 @@ export default function FacilityOrganizationUsers({ id, facilityId }: Props) {
     <FacilityOrganizationLayout id={id} facilityId={facilityId}>
       <div className="space-y-6">
         <div className="flex justify-between items-center">
-          <h2 className="text-lg font-semibold">Users</h2>
+          <h2 className="text-lg font-semibold">{t("users")}</h2>
           <div className="flex gap-2">
             <AddUserSheet
               open={openAddUserSheet}
@@ -97,7 +99,7 @@ export default function FacilityOrganizationUsers({ id, facilityId }: Props) {
           {users?.results?.length === 0 ? (
             <Card className="col-span-full">
               <CardContent className="p-6 text-center text-gray-500">
-                No users found.
+                {t("no_users_found")}
               </CardContent>
             </Card>
           ) : (
@@ -117,33 +119,25 @@ export default function FacilityOrganizationUsers({ id, facilityId }: Props) {
                           <h1 className="text-base font-bold break-words pr-2">
                             {userRole.user.first_name} {userRole.user.last_name}
                           </h1>
-                          <div className="flex items-center gap-2 flex-wrap">
-                            <span className="text-sm text-gray-500 truncate">
+                          <span className="text-sm text-gray-500">
+                            <span className="mr-2">
                               {userRole.user.username}
                             </span>
-                            <Badge
-                              variant="secondary"
-                              className="bg-green-100 whitespace-nowrap"
-                            >
-                              <span className="inline-block h-2 w-2 shrink-0 rounded-full bg-green-500 mr-2" />
-                              <span className="text-xs text-green-700">
-                                online
-                              </span>
-                            </Badge>
-                          </div>
+                            <UserStatusIndicator user={userRole.user} />
+                          </span>
                         </div>
                       </div>
                     </div>
 
                     <div className="grid grid-cols-2 gap-4 text-sm">
                       <div>
-                        <div className="text-gray-500">Role</div>
+                        <div className="text-gray-500">{t("role")}</div>
                         <div className="font-medium truncate">
                           {userRole.role.name}
                         </div>
                       </div>
                       <div>
-                        <div className="text-gray-500">Phone Number</div>
+                        <div className="text-gray-500">{t("phone_number")}</div>
                         <div className="font-medium truncate">
                           {userRole.user.phone_number}
                         </div>
@@ -165,7 +159,7 @@ export default function FacilityOrganizationUsers({ id, facilityId }: Props) {
                               icon="l-arrow-up-right"
                               className="h-4 w-4"
                             />
-                            <span>More details</span>
+                            <span>{t("more_details")}</span>
                           </Button>
                         }
                       />
diff --git a/src/pages/FacilityOrganization/components/EditFacilityUserRoleSheet.tsx b/src/pages/FacilityOrganization/components/EditFacilityUserRoleSheet.tsx
index 39fb57115d2..3d96f2210a7 100644
--- a/src/pages/FacilityOrganization/components/EditFacilityUserRoleSheet.tsx
+++ b/src/pages/FacilityOrganization/components/EditFacilityUserRoleSheet.tsx
@@ -1,5 +1,6 @@
 import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
 import { useState } from "react";
+import { useTranslation } from "react-i18next";
 import { toast } from "sonner";
 
 import {
@@ -14,6 +15,7 @@ import {
   AlertDialogTrigger,
 } from "@/components/ui/alert-dialog";
 import { Button } from "@/components/ui/button";
+import { Label } from "@/components/ui/label";
 import {
   Select,
   SelectContent,
@@ -31,6 +33,7 @@ import {
 } from "@/components/ui/sheet";
 
 import { Avatar } from "@/components/Common/Avatar";
+import { UserStatusIndicator } from "@/components/Users/UserListAndCard";
 
 import routes from "@/Utils/request/api";
 import mutate from "@/Utils/request/mutate";
@@ -53,6 +56,7 @@ export default function EditUserRoleSheet({
   const queryClient = useQueryClient();
   const [open, setOpen] = useState(false);
   const [selectedRole, setSelectedRole] = useState<string>(userRole.role.id);
+  const { t } = useTranslation();
 
   const { data: roles } = useQuery({
     queryKey: ["roles"],
@@ -74,7 +78,7 @@ export default function EditUserRoleSheet({
       queryClient.invalidateQueries({
         queryKey: ["facilityOrganizationUsers", facilityId, organizationId],
       });
-      toast.success("User role updated successfully");
+      toast.success(t("user_role_update_success"));
       setOpen(false);
     },
     onError: (error) => {
@@ -98,7 +102,7 @@ export default function EditUserRoleSheet({
       queryClient.invalidateQueries({
         queryKey: ["facilityOrganizationUsers", facilityId, organizationId],
       });
-      toast.success("User removed from organization successfully");
+      toast.success(t("user_removed_success"));
       setOpen(false);
     },
     onError: (error) => {
@@ -111,7 +115,7 @@ export default function EditUserRoleSheet({
 
   const handleUpdateRole = () => {
     if (selectedRole === userRole.role.id) {
-      toast.error("Please select a different role");
+      toast.error(t("select_diff_role"));
       return;
     }
 
@@ -124,13 +128,13 @@ export default function EditUserRoleSheet({
   return (
     <Sheet open={open} onOpenChange={setOpen}>
       <SheetTrigger asChild>
-        {trigger || <Button variant="outline">Edit Role</Button>}
+        {trigger || <Button variant="outline">{t("edit_role")}</Button>}
       </SheetTrigger>
       <SheetContent>
         <SheetHeader>
-          <SheetTitle>Edit User Role</SheetTitle>
+          <SheetTitle>{t("edit_user_role")}</SheetTitle>
           <SheetDescription>
-            Update the role for this user in the organization.
+            {t("update_user_role_organization")}
           </SheetDescription>
         </SheetHeader>
         <div className="space-y-6 py-4">
@@ -153,29 +157,30 @@ export default function EditUserRoleSheet({
 
             <div className="grid grid-cols-2 gap-4 pt-2 border-t">
               <div>
-                <span className="text-sm text-gray-500">Username</span>
+                <span className="text-sm text-gray-500">{t("username")}</span>
                 <p className="text-sm font-medium">{userRole.user.username}</p>
               </div>
               <div>
-                <span className="text-sm text-gray-500">Current Role</span>
+                <span className="text-sm text-gray-500">
+                  {t("current_role")}
+                </span>
                 <p className="text-sm font-medium">{userRole.role.name}</p>
               </div>
-              <div>
-                <span className="text-sm text-gray-500">Last Login</span>
-                <p className="text-sm font-medium">
-                  {userRole.user.last_login
-                    ? new Date(userRole.user.last_login).toLocaleDateString()
-                    : "Never"}
-                </p>
+              <div className="col-span-2">
+                <span className="text-sm text-gray-500">
+                  {t("last_login")}{" "}
+                </span>
+                <UserStatusIndicator user={userRole.user} />
               </div>
             </div>
           </div>
-
           <div className="space-y-2">
-            <label className="text-sm font-medium">Select New Role</label>
+            <Label className="text-sm font-medium">
+              {t("select_new_role")}
+            </Label>
             <Select value={selectedRole} onValueChange={setSelectedRole}>
               <SelectTrigger className="h-12">
-                <SelectValue placeholder="Select a role" />
+                <SelectValue placeholder={t("select_role")} />
               </SelectTrigger>
               <SelectContent>
                 {roles?.results?.map((role) => (
@@ -200,33 +205,34 @@ export default function EditUserRoleSheet({
               onClick={handleUpdateRole}
               disabled={selectedRole === userRole.role.id}
             >
-              Update Role
+              {t("update_role")}
             </Button>
 
             <AlertDialog>
               <AlertDialogTrigger asChild>
                 <Button variant="destructive" className="w-full">
-                  Remove User
+                  {t("remove_user")}
                 </Button>
               </AlertDialogTrigger>
               <AlertDialogContent>
                 <AlertDialogHeader>
                   <AlertDialogTitle>
-                    Remove User from Organization
+                    {t("remove_user_organization")}
                   </AlertDialogTitle>
                   <AlertDialogDescription>
-                    Are you sure you want to remove {userRole.user.first_name}{" "}
-                    {userRole.user.last_name} from this organization? This
-                    action cannot be undone.
+                    {t("remove_user_warn", {
+                      firstName: userRole.user.first_name,
+                      lastName: userRole.user.last_name,
+                    })}
                   </AlertDialogDescription>
                 </AlertDialogHeader>
                 <AlertDialogFooter>
-                  <AlertDialogCancel>Cancel</AlertDialogCancel>
+                  <AlertDialogCancel>{t("cancel")}</AlertDialogCancel>
                   <AlertDialogAction
                     onClick={() => removeRole()}
                     className="bg-destructive text-destructive-foreground hover:bg-destructive/90"
                   >
-                    Remove
+                    {t("remove")}
                   </AlertDialogAction>
                 </AlertDialogFooter>
               </AlertDialogContent>
diff --git a/src/pages/Organization/OrganizationUsers.tsx b/src/pages/Organization/OrganizationUsers.tsx
index a94c466ec3b..83deb0a25b6 100644
--- a/src/pages/Organization/OrganizationUsers.tsx
+++ b/src/pages/Organization/OrganizationUsers.tsx
@@ -1,13 +1,14 @@
 import { useQuery } from "@tanstack/react-query";
 import { useQueryParams } from "raviger";
+import { useTranslation } from "react-i18next";
 
 import CareIcon from "@/CAREUI/icons/CareIcon";
 
-import { Badge } from "@/components/ui/badge";
 import { Button } from "@/components/ui/button";
 import { Card, CardContent } from "@/components/ui/card";
 
 import { Avatar } from "@/components/Common/Avatar";
+import { UserStatusIndicator } from "@/components/Users/UserListAndCard";
 
 import query from "@/Utils/request/query";
 import { OrganizationUserRole } from "@/types/organization/organization";
@@ -28,6 +29,7 @@ export default function OrganizationUsers({ id, navOrganizationId }: Props) {
     sheet: string;
     username: string;
   }>();
+  const { t } = useTranslation();
 
   const openAddUserSheet = qParams.sheet === "add";
   const openLinkUserSheet = qParams.sheet === "link";
@@ -70,7 +72,7 @@ export default function OrganizationUsers({ id, navOrganizationId }: Props) {
     <OrganizationLayout id={id} navOrganizationId={navOrganizationId}>
       <div className="space-y-6">
         <div className="flex justify-between items-center">
-          <h2 className="text-lg font-semibold">Users</h2>
+          <h2 className="text-lg font-semibold">{t("users")}</h2>
           <div className="flex gap-2">
             <AddUserSheet
               open={openAddUserSheet}
@@ -96,7 +98,7 @@ export default function OrganizationUsers({ id, navOrganizationId }: Props) {
           {users?.results?.length === 0 ? (
             <Card className="col-span-full">
               <CardContent className="p-6 text-center text-gray-500">
-                No users found.
+                {t("no_users_found")}
               </CardContent>
             </Card>
           ) : (
@@ -110,7 +112,6 @@ export default function OrganizationUsers({ id, navOrganizationId }: Props) {
                         imageUrl={userRole.user.profile_picture_url}
                         className="h-12 w-12 sm:h-16 sm:w-16 text-xl sm:text-2xl flex-shrink-0"
                       />
-
                       <div className="flex flex-col min-w-0 flex-1">
                         <div className="flex flex-col gap-1">
                           <h1 className="text-base font-bold break-words pr-2">
@@ -120,15 +121,7 @@ export default function OrganizationUsers({ id, navOrganizationId }: Props) {
                             <span className="text-sm text-gray-500 truncate">
                               {userRole.user.username}
                             </span>
-                            <Badge
-                              variant="secondary"
-                              className="bg-green-100 whitespace-nowrap"
-                            >
-                              <span className="inline-block h-2 w-2 shrink-0 rounded-full bg-green-500 mr-2" />
-                              <span className="text-xs text-green-700">
-                                online
-                              </span>
-                            </Badge>
+                            <UserStatusIndicator user={userRole.user} />
                           </div>
                         </div>
                       </div>
@@ -136,13 +129,13 @@ export default function OrganizationUsers({ id, navOrganizationId }: Props) {
 
                     <div className="grid grid-cols-2 gap-4 text-sm">
                       <div>
-                        <div className="text-gray-500">Role</div>
+                        <div className="text-gray-500">{t("role")}</div>
                         <div className="font-medium truncate">
                           {userRole.role.name}
                         </div>
                       </div>
                       <div>
-                        <div className="text-gray-500">Phone Number</div>
+                        <div className="text-gray-500">{t("phone_number")}</div>
                         <div className="font-medium truncate">
                           {userRole.user.phone_number}
                         </div>
@@ -163,7 +156,7 @@ export default function OrganizationUsers({ id, navOrganizationId }: Props) {
                               icon="l-arrow-up-right"
                               className="h-4 w-4"
                             />
-                            <span>More details</span>
+                            <span>{t("more_details")}</span>
                           </Button>
                         }
                       />
diff --git a/src/pages/Organization/components/EditUserRoleSheet.tsx b/src/pages/Organization/components/EditUserRoleSheet.tsx
index a5f8cc489da..555757a5b18 100644
--- a/src/pages/Organization/components/EditUserRoleSheet.tsx
+++ b/src/pages/Organization/components/EditUserRoleSheet.tsx
@@ -1,5 +1,6 @@
 import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
 import { useState } from "react";
+import { useTranslation } from "react-i18next";
 import { toast } from "sonner";
 
 import {
@@ -14,6 +15,7 @@ import {
   AlertDialogTrigger,
 } from "@/components/ui/alert-dialog";
 import { Button } from "@/components/ui/button";
+import { Label } from "@/components/ui/label";
 import {
   Select,
   SelectContent,
@@ -31,6 +33,7 @@ import {
 } from "@/components/ui/sheet";
 
 import { Avatar } from "@/components/Common/Avatar";
+import { UserStatusIndicator } from "@/components/Users/UserListAndCard";
 
 import routes from "@/Utils/request/api";
 import mutate from "@/Utils/request/mutate";
@@ -52,6 +55,7 @@ export default function EditUserRoleSheet({
   const queryClient = useQueryClient();
   const [open, setOpen] = useState(false);
   const [selectedRole, setSelectedRole] = useState<string>(userRole.role.id);
+  const { t } = useTranslation();
 
   const { data: roles } = useQuery({
     queryKey: ["roles"],
@@ -69,7 +73,7 @@ export default function EditUserRoleSheet({
       queryClient.invalidateQueries({
         queryKey: ["organizationUsers", organizationId],
       });
-      toast.success("User role updated successfully");
+      toast.success(t("user_role_update_success"));
       setOpen(false);
     },
     onError: (error) => {
@@ -89,7 +93,7 @@ export default function EditUserRoleSheet({
       queryClient.invalidateQueries({
         queryKey: ["organizationUsers", organizationId],
       });
-      toast.success("User removed from organization successfully");
+      toast.success(t("user_removed_success"));
       setOpen(false);
     },
     onError: (error) => {
@@ -102,7 +106,7 @@ export default function EditUserRoleSheet({
 
   const handleUpdateRole = () => {
     if (selectedRole === userRole.role.id) {
-      toast.error("Please select a different role");
+      toast.error(t("select_diff_role"));
       return;
     }
 
@@ -115,13 +119,13 @@ export default function EditUserRoleSheet({
   return (
     <Sheet open={open} onOpenChange={setOpen}>
       <SheetTrigger asChild>
-        {trigger || <Button variant="outline">Edit Role</Button>}
+        {trigger || <Button variant="outline">{t("edit_role")}</Button>}
       </SheetTrigger>
       <SheetContent>
         <SheetHeader>
-          <SheetTitle>Edit User Role</SheetTitle>
+          <SheetTitle>{t("edit_user_role")}</SheetTitle>
           <SheetDescription>
-            Update the role for this user in the organization.
+            {t("update_user_role_organization")}
           </SheetDescription>
         </SheetHeader>
         <div className="space-y-6 py-4">
@@ -144,29 +148,31 @@ export default function EditUserRoleSheet({
 
             <div className="grid grid-cols-2 gap-4 pt-2 border-t">
               <div>
-                <span className="text-sm text-gray-500">Username</span>
+                <span className="text-sm text-gray-500">{t("username")}</span>
                 <p className="text-sm font-medium">{userRole.user.username}</p>
               </div>
               <div>
-                <span className="text-sm text-gray-500">Current Role</span>
+                <span className="text-sm text-gray-500">
+                  {t("current_role")}
+                </span>
                 <p className="text-sm font-medium">{userRole.role.name}</p>
               </div>
-              <div>
-                <span className="text-sm text-gray-500">Last Login</span>
-                <p className="text-sm font-medium">
-                  {userRole.user.last_login
-                    ? new Date(userRole.user.last_login).toLocaleDateString()
-                    : "Never"}
-                </p>
+              <div className="col-span-2">
+                <span className="text-sm text-gray-500">
+                  {t("last_login")}{" "}
+                </span>
+                <UserStatusIndicator user={userRole.user} />
               </div>
             </div>
           </div>
 
           <div className="space-y-2">
-            <label className="text-sm font-medium">Select New Role</label>
+            <Label className="text-sm font-medium">
+              {t("select_new_role")}
+            </Label>
             <Select value={selectedRole} onValueChange={setSelectedRole}>
               <SelectTrigger className="h-12">
-                <SelectValue placeholder="Select a role" />
+                <SelectValue placeholder={t("select_role")} />
               </SelectTrigger>
               <SelectContent>
                 {roles?.results?.map((role) => (
@@ -191,33 +197,34 @@ export default function EditUserRoleSheet({
               onClick={handleUpdateRole}
               disabled={selectedRole === userRole.role.id}
             >
-              Update Role
+              {t("update_role")}
             </Button>
 
             <AlertDialog>
               <AlertDialogTrigger asChild>
                 <Button variant="destructive" className="w-full">
-                  Remove User
+                  {t("remove_user")}
                 </Button>
               </AlertDialogTrigger>
               <AlertDialogContent>
                 <AlertDialogHeader>
                   <AlertDialogTitle>
-                    Remove User from Organization
+                    {t("remove_user_organization")}
                   </AlertDialogTitle>
                   <AlertDialogDescription>
-                    Are you sure you want to remove {userRole.user.first_name}{" "}
-                    {userRole.user.last_name} from this organization? This
-                    action cannot be undone.
+                    {t("remove_user_warn", {
+                      firstName: userRole.user.first_name,
+                      lastName: userRole.user.last_name,
+                    })}
                   </AlertDialogDescription>
                 </AlertDialogHeader>
                 <AlertDialogFooter>
-                  <AlertDialogCancel>Cancel</AlertDialogCancel>
+                  <AlertDialogCancel>{t("cancel")}</AlertDialogCancel>
                   <AlertDialogAction
                     onClick={() => removeRole()}
                     className="bg-destructive text-destructive-foreground hover:bg-destructive/90"
                   >
-                    Remove
+                    {t("remove")}
                   </AlertDialogAction>
                 </AlertDialogFooter>
               </AlertDialogContent>