Skip to content

Commit

Permalink
Merge branch 'develop' into patch-4
Browse files Browse the repository at this point in the history
  • Loading branch information
NikhilGolla72 authored Oct 9, 2024
2 parents 899e787 + aa90ad5 commit 96bfec5
Show file tree
Hide file tree
Showing 8 changed files with 167 additions and 106 deletions.
64 changes: 46 additions & 18 deletions src/Components/Facility/CoverImageEditModal.tsx
Original file line number Diff line number Diff line change
@@ -1,11 +1,11 @@
import {
import React, {
useState,
ChangeEventHandler,
useCallback,
useEffect,
useRef,
useState,
} from "react";
import { Success } from "../../Utils/Notifications";
import { Success, Warn } from "../../Utils/Notifications";
import useDragAndDrop from "../../Utils/useDragAndDrop";
import { sleep } from "../../Utils/utils";
import ButtonV2, { Cancel, Submit } from "../Common/components/ButtonV2";
Expand Down Expand Up @@ -67,9 +67,11 @@ const CoverImageEditModal = ({
const LaptopScreenBreakpoint = 640;
const isLaptopScreen = width >= LaptopScreenBreakpoint;
const { t } = useTranslation();
const [isDragging, setIsDragging] = useState(false);

const handleSwitchCamera = useCallback(() => {
setConstraint((prev) =>
prev.facingMode === "user"
setConstraint(
constraint.facingMode === "user"
? VideoConstraints.environment
: VideoConstraints.user,
);
Expand All @@ -85,6 +87,7 @@ const CoverImageEditModal = ({
setSelectedFile(myFile);
});
};

const closeModal = () => {
setPreview(undefined);
setSelectedFile(undefined);
Expand Down Expand Up @@ -162,11 +165,25 @@ const CoverImageEditModal = ({
const onDrop = (e: React.DragEvent<HTMLDivElement>) => {
e.preventDefault();
dragProps.setDragOver(false);
const dropedFile = e?.dataTransfer?.files[0];
if (dropedFile.type.split("/")[0] !== "image")
setIsDragging(false);
const droppedFile = e?.dataTransfer?.files[0];
if (droppedFile.type.split("/")[0] !== "image")
return dragProps.setFileDropError("Please drop an image file to upload!");
setSelectedFile(dropedFile);
setSelectedFile(droppedFile);
};

const onDragOver = (e: React.DragEvent<HTMLDivElement>) => {
e.preventDefault();
dragProps.onDragOver(e);
setIsDragging(true);
};

const onDragLeave = (e: React.DragEvent<HTMLDivElement>) => {
e.preventDefault();
dragProps.onDragLeave();
setIsDragging(false);
};

const commonHint = (
<>
{t("max_size_for_image_uploaded_should_be")} 1mb.
Expand Down Expand Up @@ -202,24 +219,28 @@ const CoverImageEditModal = ({
</>
) : (
<div
onDragOver={dragProps.onDragOver}
onDragLeave={dragProps.onDragLeave}
onDragOver={onDragOver}
onDragLeave={onDragLeave}
onDrop={onDrop}
className={`mt-8 flex flex-1 flex-col items-center justify-center rounded-lg border-[3px] border-dashed px-3 py-6 ${
dragProps.dragOver && "border-primary-500"
} ${
dragProps.fileDropError !== ""
? "border-red-500"
: "border-secondary-500"
}`}
isDragging
? "border-primary-800 bg-primary-100"
: dragProps.dragOver
? "border-primary-500"
: "border-secondary-500"
} ${dragProps.fileDropError !== "" ? "border-red-500" : ""}`}
>
<svg
stroke="currentColor"
fill="none"
viewBox="0 0 48 48"
aria-hidden="true"
className={`h-12 w-12 stroke-[2px] ${
dragProps.dragOver && "text-primary-500"
isDragging
? "text-green-500"
: dragProps.dragOver
? "text-primary-500"
: "text-secondary-600"
} ${
dragProps.fileDropError !== ""
? "text-red-500"
Expand All @@ -230,7 +251,9 @@ const CoverImageEditModal = ({
</svg>
<p
className={`text-sm ${
dragProps.dragOver && "text-primary-500"
dragProps.dragOver
? "text-primary-500"
: "text-secondary-700"
} ${
dragProps.fileDropError !== ""
? "text-red-500"
Expand Down Expand Up @@ -267,6 +290,7 @@ const CoverImageEditModal = ({
<div className="sm:flex-1" />
<ButtonV2
onClick={() => {
setConstraint(() => VideoConstraints.user);
setIsCameraOpen(true);
}}
>
Expand Down Expand Up @@ -322,6 +346,10 @@ const CoverImageEditModal = ({
width={1280}
ref={webRef}
videoConstraints={constraint}
onUserMediaError={(_e) => {
setIsCameraOpen(false);
Warn({ msg: t("camera_permission_denied") });
}}
/>
</>
) : (
Expand Down
196 changes: 110 additions & 86 deletions src/Components/Facility/LocationManagement.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -13,6 +13,7 @@ import ConfirmDialog from "../Common/ConfirmDialog";
import DialogModal from "../Common/Dialog";
import Uptime from "../Common/Uptime";
import useAuthUser from "../../Common/hooks/useAuthUser";
import useQuery from "../../Utils/request/useQuery";

import Loading from "@/Components/Common/Loading";
interface Props {
Expand Down Expand Up @@ -223,97 +224,120 @@ const Location = ({
disabled,
setShowDeletePopup,
facilityId,
}: LocationProps) => (
<div className="flex h-full w-full flex-col rounded border border-secondary-300 bg-white p-6 shadow-sm transition-all duration-200 ease-in-out hover:border-primary-400">
<div className="flex-1">
<div className="flex w-full items-start justify-between gap-2">
<div className="flex items-end gap-3">
<p className="break-all text-xl font-medium" id="view-location-name">
{name}
</p>
<div
className="mt-2 h-fit rounded-full border-2 border-primary-500 bg-primary-100 px-3 py-[3px]"
id="location-type"
>
<p className="text-xs font-bold text-primary-500">
{location_type}
}: LocationProps) => {
const { loading, data } = useQuery(routes.listFacilityBeds, {
query: {
facility: facilityId,
location: id,
},
});

const totalBeds = data?.count ?? 0;

if (loading) {
return <Loading />;
}

return (
<div className="flex h-full w-full flex-col rounded border border-secondary-300 bg-white p-6 shadow-sm transition-all duration-200 ease-in-out hover:border-primary-400">
<div className="flex-1">
<div className="flex w-full items-start justify-between gap-2">
<div className="flex items-end gap-3">
<p
className="break-all text-xl font-medium"
id="view-location-name"
>
{name}
</p>
<div
className="mt-2 h-fit rounded-full border-2 border-primary-500 bg-primary-100 px-3 py-[3px]"
id="location-type"
>
<p className="text-xs font-bold text-primary-500">
{location_type}
</p>
</div>
</div>
</div>
</div>
<p
className="mt-3 break-all text-sm font-medium text-secondary-700"
id="view-location-description"
>
{description || "-"}
</p>
<p className="mt-3 text-sm font-semibold text-secondary-700">
Middleware Address:
</p>
<p
className="mt-1 break-all font-mono text-sm font-bold text-secondary-700"
id="view-location-middleware"
>
{middleware_address || "-"}
</p>
<Uptime
route={routes.listFacilityAssetLocationAvailability}
params={{ external_id: id, facility_external_id: facilityId }}
header={
<p className="mt-3 text-sm font-semibold text-secondary-700">
Middleware Uptime
</p>
}
centerInfoPanel
/>
</div>

<ButtonV2
id="manage-bed-button"
variant="secondary"
border
className="mt-3 w-full"
href={`location/${id}/beds`}
>
<CareIcon icon="l-bed" className="text-lg" />
Manage Beds
</ButtonV2>
<div className="mt-2 flex w-full flex-col gap-2 md:flex-row">
<div className="w-full md:w-1/2">
<ButtonV2
id="edit-location-button"
variant="secondary"
border
className="w-full"
href={`location/${id}/update`}
authorizeFor={NonReadOnlyUsers}
<p
className="mt-3 break-all text-sm font-medium text-secondary-700"
id="view-location-description"
>
<CareIcon icon="l-pen" className="text-lg" />
Edit
</ButtonV2>
</div>
<div className="w-full md:w-1/2">
<ButtonV2
authorizeFor={AuthorizeFor(["DistrictAdmin", "StateAdmin"])}
id="delete-location-button"
variant="secondary"
border
className="w-full"
tooltip={disabled ? "Contact your admin to delete the location" : ""}
tooltipClassName=" text-xs w-full lg:w-auto"
onClick={() =>
setShowDeletePopup({ open: true, name: name ?? "", id: id ?? "" })
}
{description || "-"}
</p>
<p className="mt-3 text-sm font-semibold text-secondary-700">
Middleware Address:
</p>
<p
className="mt-1 break-all font-mono text-sm font-bold text-secondary-700"
id="view-location-middleware"
>
<CareIcon icon="l-trash" className="text-lg" />
Delete
</ButtonV2>
{middleware_address || "-"}
</p>
<Uptime
route={routes.listFacilityAssetLocationAvailability}
params={{ external_id: id, facility_external_id: facilityId }}
header={
<p className="mt-3 text-sm font-semibold text-secondary-700">
Middleware Uptime
</p>
}
centerInfoPanel
/>
</div>
</div>

<div className="mt-3 flex items-center justify-between gap-4 text-sm font-medium text-secondary-700">
<RecordMeta time={created_date} prefix="Created:" />
<RecordMeta time={modified_date} prefix="Modified:" />
<ButtonV2
id="manage-bed-button"
variant="secondary"
border
className="mt-3 flex w-full items-center justify-between"
href={`location/${id}/beds`}
>
Manage Beds
<span className="flex items-center justify-center gap-2">
<CareIcon icon="l-bed" className="text-lg" />
{totalBeds}
</span>
</ButtonV2>
<div className="mt-2 flex w-full flex-col gap-2 md:flex-row">
<div className="w-full md:w-1/2">
<ButtonV2
id="edit-location-button"
variant="secondary"
border
className="w-full"
href={`location/${id}/update`}
authorizeFor={NonReadOnlyUsers}
>
<CareIcon icon="l-pen" className="text-lg" />
Edit
</ButtonV2>
</div>
<div className="w-full md:w-1/2">
<ButtonV2
authorizeFor={AuthorizeFor(["DistrictAdmin", "StateAdmin"])}
id="delete-location-button"
variant="secondary"
border
className="w-full"
tooltip={
disabled ? "Contact your admin to delete the location" : ""
}
tooltipClassName=" text-xs w-full lg:w-auto"
onClick={() =>
setShowDeletePopup({ open: true, name: name ?? "", id: id ?? "" })
}
>
<CareIcon icon="l-trash" className="text-lg" />
Delete
</ButtonV2>
</div>
</div>

<div className="mt-3 flex items-center justify-between gap-4 text-sm font-medium text-secondary-700">
<RecordMeta time={created_date} prefix="Created:" />
<RecordMeta time={modified_date} prefix="Modified:" />
</div>
</div>
</div>
);
);
};
4 changes: 4 additions & 0 deletions src/Components/Users/UserAdd.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -294,24 +294,28 @@ export const UserAdd = (props: UserProps) => {

const handleDateChange = (e: FieldChangeEvent<Date>) => {
if (dayjs(e.value).isValid()) {
const errors = { ...state.errors, [e.name]: "" };
dispatch({
type: "set_form",
form: {
...state.form,
[e.name]: dayjs(e.value).format("YYYY-MM-DD"),
},
});
dispatch({ type: "set_errors", errors });
}
};

const handleFieldChange = (event: FieldChangeEvent<unknown>) => {
const errors = { ...state.errors, [event.name]: "" };
dispatch({
type: "set_form",
form: {
...state.form,
[event.name]: event.value,
},
});
dispatch({ type: "set_errors", errors });
};

useAbortableEffect(() => {
Expand Down
3 changes: 2 additions & 1 deletion src/Locale/en.json
Original file line number Diff line number Diff line change
Expand Up @@ -198,6 +198,7 @@
"retake": "Retake",
"submit": "Submit",
"camera": "Camera",
"camera_permission_denied": "Camera Permission denied",
"submitting": "Submitting",
"view_details": "View Details",
"type_to_search": "Type to search",
Expand Down Expand Up @@ -1020,4 +1021,4 @@
"date_declared_positive": "Date of declaring positive",
"date_of_result": "Covid confirmation date",
"is_vaccinated": "Whether vaccinated"
}
}
Loading

0 comments on commit 96bfec5

Please sign in to comment.