Skip to content

Commit

Permalink
Use shadcn Tooltip Components across FacilityCard (#9317)
Browse files Browse the repository at this point in the history
  • Loading branch information
rajku-dev authored Dec 23, 2024
1 parent 6ca96ab commit 650b196
Show file tree
Hide file tree
Showing 6 changed files with 94 additions and 47 deletions.
3 changes: 2 additions & 1 deletion public/locale/en.json
Original file line number Diff line number Diff line change
Expand Up @@ -1046,6 +1046,7 @@
"notification_cancelled": "Notification cancelled",
"notification_permission_denied": "Notification permission denied",
"notification_permission_granted": "Notification permission granted",
"notify": "Notify",
"number_of_aged_dependents": "Number of Aged Dependents (Above 60)",
"number_of_beds": "Number of beds",
"number_of_beds_out_of_range_error": "Number of beds cannot be greater than 100",
Expand Down Expand Up @@ -1541,7 +1542,7 @@
"view_cns": "View CNS",
"view_consultation_and_log_updates": "View Consultation / Log Updates",
"view_details": "View Details",
"view_faciliy": "View Facility",
"view_facility": "View Facility",
"view_files": "View Files",
"view_patients": "View Patients",
"view_update_patient_files": "View/Update patient files",
Expand Down
2 changes: 1 addition & 1 deletion public/locale/hi.json
Original file line number Diff line number Diff line change
Expand Up @@ -795,7 +795,7 @@
"view_abdm_records": "ABDM रिकॉर्ड देखें",
"view_asset": "संपत्तियां देखें",
"view_details": "विवरण देखें",
"view_faciliy": "सुविधा देखें",
"view_facility": "सुविधा देखें",
"view_patients": "मरीज़ देखें",
"view_users": "उपयोगकर्ता देखें",
"virtual_nursing_assistant": "वर्चुअल नर्सिंग सहायक",
Expand Down
2 changes: 1 addition & 1 deletion public/locale/kn.json
Original file line number Diff line number Diff line change
Expand Up @@ -796,7 +796,7 @@
"view_abdm_records": "ABDM ದಾಖಲೆಗಳನ್ನು ವೀಕ್ಷಿಸಿ",
"view_asset": "ಸ್ವತ್ತುಗಳನ್ನು ವೀಕ್ಷಿಸಿ",
"view_details": "ವಿವರಗಳನ್ನು ವೀಕ್ಷಿಸಿ",
"view_faciliy": "ವೀಕ್ಷಣೆ ಸೌಲಭ್ಯ",
"view_facility": "ವೀಕ್ಷಣೆ ಸೌಲಭ್ಯ",
"view_patients": "ರೋಗಿಗಳನ್ನು ವೀಕ್ಷಿಸಿ",
"view_users": "ಬಳಕೆದಾರರನ್ನು ವೀಕ್ಷಿಸಿ",
"virtual_nursing_assistant": "ವರ್ಚುವಲ್ ನರ್ಸಿಂಗ್ ಸಹಾಯಕ",
Expand Down
2 changes: 1 addition & 1 deletion public/locale/ml.json
Original file line number Diff line number Diff line change
Expand Up @@ -796,7 +796,7 @@
"view_abdm_records": "ABDM റെക്കോർഡുകൾ കാണുക",
"view_asset": "അസറ്റുകൾ കാണുക",
"view_details": "വിശദാംശങ്ങൾ കാണുക",
"view_faciliy": "സൗകര്യം കാണുക",
"view_facility": "സൗകര്യം കാണുക",
"view_patients": "രോഗികളെ കാണുക",
"view_users": "ഉപയോക്താക്കളെ കാണുക",
"virtual_nursing_assistant": "വെർച്വൽ നഴ്സിംഗ് അസിസ്റ്റൻ്റ്",
Expand Down
2 changes: 1 addition & 1 deletion public/locale/ta.json
Original file line number Diff line number Diff line change
Expand Up @@ -795,7 +795,7 @@
"view_abdm_records": "ABDM பதிவுகளைப் பார்க்கவும்",
"view_asset": "சொத்துக்களைப் பார்க்கவும்",
"view_details": "விவரங்களைக் காண்க",
"view_faciliy": "பார்வை வசதி",
"view_facility": "பார்வை வசதி",
"view_patients": "நோயாளிகளைப் பார்க்கவும்",
"view_users": "பயனர்களைக் காண்க",
"virtual_nursing_assistant": "மெய்நிகர் நர்சிங் உதவியாளர்",
Expand Down
130 changes: 88 additions & 42 deletions src/components/Facility/FacilityCard.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -6,10 +6,11 @@ import { useTranslation } from "react-i18next";
import Chip from "@/CAREUI/display/Chip";
import CareIcon from "@/CAREUI/icons/CareIcon";

import { Button } from "@/components/ui/button";
import { TooltipComponent, TooltipProvider } from "@/components/ui/tooltip";

import { Avatar } from "@/components/Common/Avatar";
import ButtonV2, { Cancel, Submit } from "@/components/Common/ButtonV2";
import { Cancel, Submit } from "@/components/Common/ButtonV2";
import DialogModal from "@/components/Common/Dialog";
import { FacilityModel } from "@/components/Facility/models";
import TextAreaFormField from "@/components/Form/FormFields/TextAreaFormField";
Expand Down Expand Up @@ -103,6 +104,7 @@ export const FacilityCard = (props: {
<TooltipProvider>
<TooltipComponent
content={t("live_patients_total_beds")}
className="text-sm px-3 py-3 max-w-[300px]"
>
<div
data-test-id="occupancy-badge"
Expand All @@ -123,19 +125,20 @@ export const FacilityCard = (props: {
</TooltipComponent>
</TooltipProvider>
</div>
<ButtonV2
<Button
id="view-cns-button"
href={`/facility/${facility.id}/cns`}
border
ghost
asChild
className="mt-2 sm:mt-0"
variant={"outline_primary"}
>
<CareIcon
icon="l-monitor-heart-rate"
className="text-lg"
/>
<span>{t("view_cns")}</span>
</ButtonV2>
<Link href={`/facility/${facility.id}/cns`}>
<CareIcon
icon="l-monitor-heart-rate"
className="text-lg mr-1"
/>
<span>{t("view_cns")}</span>
</Link>
</Button>
</div>

<div className="mt-2 flex flex-wrap gap-1">
Expand Down Expand Up @@ -233,38 +236,81 @@ export const FacilityCard = (props: {
</div>
<div className="flex flex-wrap gap-2">
{["DistrictAdmin", "StateAdmin"].includes(userType) && (
<ButtonV2
id="facility-notify"
ghost
border
className="h-[38px]"
onClick={(_) => setNotifyModalFor(facility.id)}
>
<CareIcon icon="l-megaphone" className="text-lg" />
<span className="hidden md:block">Notify</span>
</ButtonV2>
<TooltipProvider>
<TooltipComponent
content={t("notify")}
side="top"
className="sm:hidden text-sm px-3 py-3 max-w-[300px]"
>
<Button
id="facility-notify"
variant={"outline_primary"}
className="h-[38px]"
onClick={(_) => setNotifyModalFor(facility.id)}
aria-label={t("notify")}
role="button"
>
<CareIcon
icon="l-megaphone"
className="text-lg mr-1"
/>
<span className="hidden sm:inline">
{t("notify")}
</span>
</Button>
</TooltipComponent>
</TooltipProvider>
)}
<ButtonV2
href={`/facility/${facility.id}`}
id="facility-details"
border
ghost
className="h-[38px]"
>
<CareIcon icon="l-hospital" className="text-lg" />
<span className="hidden md:inline">
{t("view_faciliy")}
</span>
</ButtonV2>
<ButtonV2
href={`/patients?facility=${facility.id}`}
id="facility-patients"
border
ghost
>
<CareIcon icon="l-user-injured" className="text-lg" />
{t("view_patients")}
</ButtonV2>
<TooltipProvider>
<TooltipComponent
content={t("view_facility")}
side="top"
className="sm:hidden text-sm px-3 py-3 max-w-[300px]"
>
<Button
id="facility-details"
variant={"outline_primary"}
className="tooltip h-[38px]"
aria-label={t("view_facility")}
asChild
>
<Link href={`/facility/${facility.id}`}>
<CareIcon
icon="l-hospital"
className="text-lg mr-1"
/>
<span className="hidden sm:inline">
{t("view_facility")}
</span>
</Link>
</Button>
</TooltipComponent>
</TooltipProvider>
<TooltipProvider>
<TooltipComponent
content={t("view_patients")}
side="top"
className="sm:hidden text-sm px-3 py-3 max-w-[300px]"
>
<Button
id="facility-patients"
variant={"outline_primary"}
aria-label={t("view_patients")}
asChild
className="tooltip h-[38px]"
>
<Link href={`/patients?facility=${facility.id}`}>
<CareIcon
icon="l-user-injured"
className="text-lg mr-1"
/>
<span className="hidden sm:inline">
{t("view_patients")}
</span>
</Link>
</Button>
</TooltipComponent>
</TooltipProvider>
{/* </div> */}
</div>
</div>
Expand Down

0 comments on commit 650b196

Please sign in to comment.