Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Fix: Added location for linked facility #9383

Merged
merged 9 commits into from
Dec 12, 2024
Merged

Fix: Added location for linked facility #9383

Changes from all commits
Commits
Show all changes
9 commits
Select commit Hold shift + click to select a range
476f36e
added location for linked facility
AdityaJ2305 Dec 11, 2024
edf19dc
Merge branch 'develop' into issue/9367/add_address_for_linked_facility
AdityaJ2305 Dec 11, 2024
e51a8a3
Merge branch 'develop' into issue/9367/add_address_for_linked_facility
AdityaJ2305 Dec 11, 2024
929c2ca
Merge branch 'develop' into issue/9367/add_address_for_linked_facility
AdityaJ2305 Dec 11, 2024
c0e56c0
Merge branch 'develop' into issue/9367/add_address_for_linked_facility
AdityaJ2305 Dec 11, 2024
cfb0048
Merge branch 'develop' into issue/9367/add_address_for_linked_facility
AdityaJ2305 Dec 12, 2024
ab51657
Changed to suggested design
AdityaJ2305 Dec 12, 2024
a1ea309
updated Button and responsive for mobile view
AdityaJ2305 Dec 12, 2024
f18c840
Merge branch 'develop' into issue/9367/add_address_for_linked_facility
AdityaJ2305 Dec 12, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
61 changes: 39 additions & 22 deletions src/components/Users/LinkedFacilities.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,7 @@ import { useTranslation } from "react-i18next";

import CareIcon from "@/CAREUI/icons/CareIcon";

import { Button } from "@/components/ui/button";
import {
DropdownMenu,
DropdownMenuContent,
Expand All @@ -24,8 +25,6 @@ import routes from "@/Utils/request/api";
import request from "@/Utils/request/request";
import useTanStackQueryInstead from "@/Utils/request/useQuery";

import ButtonV2 from "../Common/ButtonV2";

const initModalProps: {
selectedFacility?: FacilityModel;
type: string;
Expand Down Expand Up @@ -201,11 +200,22 @@ export default function LinkedFacilities({
return (
<div id={`facility_${facility.id}`} key={`facility_${facility.id}`}>
<DropdownMenu>
<div className="flex flex-row items-center rounded-sm border bg-secondary-100">
<div className="rounded p-1 text-sm">{facility.name}</div>
<div className="flex flex-row items-center rounded-sm border bg-secondary-100 w-full md:w-full">
<div className="text-sm text-black p-2 font-bold flex-1">
{facility.name}
{facility.district_object?.name && (
<div className="text-sm text-gray-500 font-medium">
{facility.district_object?.name}
{facility.district_object?.name &&
facility.state_object?.name &&
", "}
{facility.state_object?.name}
</div>
)}
</div>
<DropdownMenuTrigger id="linked-facility-settings">
<div className="rounded-r bg-secondary-300 px-2 py-1">
<CareIcon icon="l-setting" className="text-sm" />
<div className="flex items-center justify-center rounded-r bg-secondary-300 px-2 min-h-16">
<CareIcon icon="l-setting" className="text-xl" />
</div>
</DropdownMenuTrigger>
</div>
Expand Down Expand Up @@ -244,12 +254,21 @@ export default function LinkedFacilities({
id={`facility_${homeFacility.id}`}
key={`facility_${homeFacility.id}`}
>
<div className="flex flex-row items-center rounded-sm border bg-secondary-100">
<div id="home-facility" className="rounded p-1 text-sm">
<div className="flex flex-row items-center rounded-sm border bg-secondary-100 w-full">
<div className="text-sm text-black p-2 font-bold flex-1">
{homeFacility.name}
{homeFacility.district_object?.name && (
<div className="text-sm text-gray-500 font-medium">
{homeFacility.district_object?.name}
{homeFacility.district_object?.name &&
homeFacility.state_object?.name &&
", "}
{homeFacility.state_object?.name}
</div>
)}
</div>
{(authorizeForHomeFacility || isCurrentUser) && (
<div className="border-l-3 rounded-r bg-secondary-300 px-2 py-1">
<div className="border-l-3 rounded-r bg-secondary-300 px-2 py-4 h-14">
<button
id="clear-home-facility"
onClick={() =>
Expand All @@ -258,7 +277,7 @@ export default function LinkedFacilities({
title={t("clear_home_facility")}
aria-label={t("clear_home_facility")}
>
<CareIcon icon="l-multiply" className="text-sm" />
<CareIcon icon="l-multiply" className="text-xl" />
</button>
</div>
)}
Expand All @@ -280,7 +299,7 @@ export default function LinkedFacilities({
/>
)}
<div className="flex flex-col gap-y-6 rounded bg-white p-4 shadow">
<div className="flex flex-row gap-3">
<div className="flex flex-col sm:flex-row gap-3">
<FacilitySelect
id="select-facility"
multiple={false}
Expand All @@ -294,37 +313,35 @@ export default function LinkedFacilities({
className="z-10 w-full"
disabled={!authorizeForHomeFacility}
/>
<ButtonV2
id="link-facility"
<Button
variant="primary"
size="lg"
name="Add"
className="mt-1 rounded-lg px-6 py-[11px] text-base"
id="link-facility"
className="mt-1 rounded-lg px-6 py-[23px] text-base"
onClick={() => linkFacility(userData.username, facility)}
disabled={!authorizeForHomeFacility}
tooltip={
!authorizeForHomeFacility
? t("contact_your_admin_to_add_facilities")
: undefined
}
>
{t("add_facility")}
</ButtonV2>
</Button>
</div>

{homeFacility && (
<div className="flex flex-col gap-2">
<p className="text-xs">{t("home_facility")}</p>
<div className="flex flex-row gap-3">
<div className="flex flex-col sm:flex-row gap-3">
{renderHomeFacilityButton(homeFacility)}
</div>
</div>
)}

{userFacilities && userFacilities.length > 0 && (
<div className="flex flex-col gap-2">
<p className="text-xs">{t("linked_facilities")}</p>

<div
id="linked-facility-list"
className="flex flex-row flex-wrap gap-3"
className="flex flex-col sm:flex-row flex-wrap gap-3"
>
{userFacilities.map((facility: FacilityModel) => {
if (homeFacility?.id === facility.id) {
Expand Down
Loading