diff --git a/public/locale/en.json b/public/locale/en.json index 3fbcfc3de72..a7775ef6a89 100644 --- a/public/locale/en.json +++ b/public/locale/en.json @@ -106,6 +106,8 @@ "LOG_UPDATE_FIELD_LABEL__ventilator_spo2": "SpO₂", "LOG_UPDATE_UPDATED_NOTIFICATION": "{{ roundType }} updated successfully", "NORMAL": "Brief Update", + "no_sub_organizations_found": "No sub_organizations found", + "no_organizations_found_matching": "No organizations found matching", "NURSING_CARE_PROCEDURE__ascitic_tapping": "Ascitic Tapping", "NURSING_CARE_PROCEDURE__bed_bath": "Bed Bath", "NURSING_CARE_PROCEDURE__catheter_care": "Catheter Care", @@ -1615,6 +1617,8 @@ "search": "Search", "search_by_emergency_contact_phone_number": "Search by Emergency Contact Phone Number", "search_by_emergency_phone_number": "Search by Emergency Phone Number", + "search_facilities": "Search Facilities", + "search_by_name": "Search by name", "search_by_patient_name": "Search by Patient Name", "search_by_patient_no": "Search by Patient Number", "search_by_phone_number": "Search by Phone Number", @@ -1707,6 +1711,7 @@ "spokes": "Spoke Facilities", "srf_id": "SRF ID", "staff_list": "Staff List", + "staff": "Staff", "start_consultation": "Start Consultation", "start_datetime": "Start Date/Time", "start_dosage": "Start Dosage", @@ -1937,4 +1942,4 @@ "you_need_at_least_a_location_to_create_an_assest": "You need at least a location to create an assest.", "zoom_in": "Zoom In", "zoom_out": "Zoom Out" -} +} \ No newline at end of file diff --git a/src/pages/FacilityOrganization/FacilityOrganizationView.tsx b/src/pages/FacilityOrganization/FacilityOrganizationView.tsx index 8a362cf21cb..bfa7e1cdf8a 100644 --- a/src/pages/FacilityOrganization/FacilityOrganizationView.tsx +++ b/src/pages/FacilityOrganization/FacilityOrganizationView.tsx @@ -1,6 +1,7 @@ import { useQuery } from "@tanstack/react-query"; import { Link } from "raviger"; import { useState } from "react"; +import { useTranslation } from "react-i18next"; import CareIcon from "@/CAREUI/icons/CareIcon"; @@ -11,6 +12,8 @@ import { Input } from "@/components/ui/input"; import Pagination from "@/components/Common/Pagination"; +import useDebouncedState from "@/hooks/useDebouncedState"; + import routes from "@/Utils/request/api"; import query from "@/Utils/request/query"; @@ -26,7 +29,11 @@ export default function FacilityOrganizationView({ id, facilityId }: Props) { const [page, setPage] = useState(1); const [searchQuery, setSearchQuery] = useState(""); const limit = 12; // 3x4 grid - + const [debouncedParams, setDebouncedParams] = useDebouncedState( + searchQuery, + 500, + ); + const { t } = useTranslation(); const { data: children, isLoading } = useQuery({ queryKey: [ "facilityOrganization", @@ -35,7 +42,7 @@ export default function FacilityOrganizationView({ id, facilityId }: Props) { id, page, limit, - searchQuery, + debouncedParams, ], queryFn: query(routes.facilityOrganization.list, { pathParams: { facilityId, organizationId: id }, @@ -43,7 +50,7 @@ export default function FacilityOrganizationView({ id, facilityId }: Props) { parent: id, offset: (page - 1) * limit, limit, - name: searchQuery || undefined, + name: debouncedParams || undefined, }, }), }); @@ -52,15 +59,16 @@ export default function FacilityOrganizationView({ id, facilityId }: Props) {
-

Organizations

+

{t("organizations")}

{ setSearchQuery(e.target.value); setPage(1); // Reset to first page on search + setDebouncedParams(e.target.value); }} className="w-full" /> @@ -131,8 +139,8 @@ export default function FacilityOrganizationView({ id, facilityId }: Props) { {searchQuery - ? `No organizations found matching "${searchQuery}"` - : "No sub-organizations found."} + ? `${t("no_organizations_found_matching")} "${searchQuery}"` + : `${t("no_sub_organizations_found")}`} )} diff --git a/src/pages/Organization/OrganizationFacilities.tsx b/src/pages/Organization/OrganizationFacilities.tsx index 0717e682921..6027488e029 100644 --- a/src/pages/Organization/OrganizationFacilities.tsx +++ b/src/pages/Organization/OrganizationFacilities.tsx @@ -1,5 +1,6 @@ import { useQuery } from "@tanstack/react-query"; import { Link } from "raviger"; +import { useTranslation } from "react-i18next"; import CareIcon from "@/CAREUI/icons/CareIcon"; @@ -9,6 +10,7 @@ import { Input } from "@/components/ui/input"; import { Avatar } from "@/components/Common/Avatar"; +import useDebouncedState from "@/hooks/useDebouncedState"; import useFilters from "@/hooks/useFilters"; import routes from "@/Utils/request/api"; @@ -30,15 +32,17 @@ export default function OrganizationFacilities({ const { qParams, Pagination, advancedFilter, resultsPerPage, updateQuery } = useFilters({ limit: 14, cacheBlacklist: ["facility"] }); + const [debouncedParams, setDebouncedParams] = useDebouncedState(qParams, 500); + const { t } = useTranslation(); const { data: facilities, isLoading } = useQuery({ - queryKey: ["organizationFacilities", id, qParams], + queryKey: ["organizationFacilities", id, debouncedParams], queryFn: query(routes.facility.list, { queryParams: { - page: qParams.page, + page: debouncedParams.page, limit: resultsPerPage, - offset: (qParams.page - 1) * resultsPerPage, + offset: (debouncedParams.page - 1) * resultsPerPage, organization: id, - name: qParams.name, + name: debouncedParams.name, ...advancedFilter.filter, }, }), @@ -48,7 +52,7 @@ export default function OrganizationFacilities({ if (!id) { return null; } - + console.log("ddd", debouncedParams); return (
@@ -60,14 +64,15 @@ export default function OrganizationFacilities({
+ onChange={(e) => { updateQuery({ name: e.target.value, page: 1, - }) - } + }); + setDebouncedParams({ ...qParams, name: e.target.value, page: 1 }); + }} className="max-w-sm" />
@@ -102,7 +107,7 @@ export default function OrganizationFacilities({ ) : facilities?.results?.length === 0 ? ( - No facilities found. + {t("no_facilities_found")} ) : ( @@ -145,7 +150,7 @@ export default function OrganizationFacilities({ href={`/facility/${facility.id}`} className="text-sm text-primary hover:underline" > - View Facility + {t("view_facility")}