-
diff --git a/src/components/Kanban/Board.tsx b/src/components/Kanban/Board.tsx
index 337f98f1caf..d311cdd17bd 100644
--- a/src/components/Kanban/Board.tsx
+++ b/src/components/Kanban/Board.tsx
@@ -4,12 +4,13 @@ import {
Droppable,
OnDragEndResponder,
} from "@hello-pangea/dnd";
-import { ReactNode, RefObject, useEffect, useRef, useState } from "react";
+import { useInfiniteQuery } from "@tanstack/react-query";
+import { ReactNode, RefObject, useEffect, useRef } from "react";
import { useTranslation } from "react-i18next";
import CareIcon from "@/CAREUI/icons/CareIcon";
-import request from "@/Utils/request/request";
+import { callApi } from "@/Utils/request/query";
import { QueryRoute } from "@/Utils/request/types";
import { QueryOptions } from "@/Utils/request/useQuery";
@@ -57,7 +58,7 @@ export default function KanbanBoard
- {dayjs(itemData.created_date).format("DD/MM/YYYY")}
+
-
-
+
+
+
{itemData.is_kasp && (
diff --git a/src/components/Facility/FacilityCard.tsx b/src/components/Facility/FacilityCard.tsx
index 2f6ecec204b..be00a21ece0 100644
--- a/src/components/Facility/FacilityCard.tsx
+++ b/src/components/Facility/FacilityCard.tsx
@@ -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";
@@ -103,6 +104,7 @@ export const FacilityCard = (props: {
+
+
+ {/* Patient Status Section */}
+
+ {dayjs(itemData.created_date).format("DD/MM/YYYY")}
+
+
+
+ {t("patient_status")}
+
+
@@ -233,38 +236,81 @@ export const FacilityCard = (props: {
{["DistrictAdmin", "StateAdmin"].includes(userType) && (
- setNotifyModalFor(facility.id)}
- >
-
+
+
+
+
+
)}
-
-
-
-
+
+
+
+
+
+
+
+
+
+
{/*
*/}
+
{props.sections.map((section, i) => (
@@ -74,6 +75,12 @@ export default function KanbanBoard(
);
}
+interface QueryResponse {
+ results: T[];
+ next: string | null;
+ count: number;
+}
+
export function KanbanSection(
props: Omit, "sections" | "onDragEnd"> & {
section: KanbanBoardProps["sections"][number];
@@ -81,107 +88,105 @@ export function KanbanSection(
},
) {
const { section } = props;
- const [offset, setOffset] = useState(0);
- const [pages, setPages] = useState([]);
- const [fetchingNextPage, setFetchingNextPage] = useState(false);
- const [hasMore, setHasMore] = useState(true);
- const [totalCount, setTotalCount] = useState();
-
- const options = section.fetchOptions(section.id);
const sectionRef = useRef(null);
const defaultLimit = 14;
const { t } = useTranslation();
- // should be replaced with useInfiniteQuery when we move over to react query
-
- const fetchNextPage = async (refresh: boolean = false) => {
- if (!refresh && (fetchingNextPage || !hasMore)) return;
- if (refresh) setPages([]);
- const offsetToUse = refresh ? 0 : offset;
- setFetchingNextPage(true);
- const res = await request(options.route, {
- ...options.options,
- query: { ...options.options?.query, offsetToUse, limit: defaultLimit },
- });
- const newPages = refresh ? [] : [...pages];
- const page = Math.floor(offsetToUse / defaultLimit);
- if (res.error) return;
- newPages[page] = (res.data as any).results;
- setPages(newPages);
- setHasMore(!!(res.data as any)?.next);
- setTotalCount((res.data as any)?.count);
- setOffset(offsetToUse + defaultLimit);
- setFetchingNextPage(false);
+ const fetchPage = async ({ pageParam = 0 }) => {
+ const options = section.fetchOptions(section.id);
+ try {
+ const data = await callApi(options.route, {
+ ...options.options,
+ queryParams: {
+ ...options.options?.query,
+ offset: pageParam,
+ limit: defaultLimit,
+ },
+ });
+ return data as QueryResponse;
+ } catch (error) {
+ console.error("Error fetching section data:", error);
+ return { results: [], next: null, count: 0 };
+ }
};
- const items = pages.flat();
+ const {
+ data,
+ fetchNextPage,
+ hasNextPage,
+ isFetchingNextPage,
+ isLoading,
+ refetch,
+ } = useInfiniteQuery({
+ queryKey: [section.id],
+ queryFn: fetchPage,
+ getNextPageParam: (lastPage, pages) => {
+ if (!lastPage.next) return undefined;
+ return pages.length * defaultLimit;
+ },
+ initialPageParam: 0,
+ });
- useEffect(() => {
- const onBoardReachEnd = async () => {
- const sectionElementHeight =
- sectionRef.current?.getBoundingClientRect().height;
- const scrolled = props.boardRef.current?.scrollTop;
- // if user has scrolled 3/4th of the current items
- if (
- scrolled &&
- sectionElementHeight &&
- scrolled > sectionElementHeight * (3 / 4)
- ) {
- fetchNextPage();
- }
- };
-
- props.boardRef.current?.addEventListener("scroll", onBoardReachEnd);
- return () =>
- props.boardRef.current?.removeEventListener("scroll", onBoardReachEnd);
- }, [props.boardRef, fetchingNextPage, hasMore]);
+ const items = data?.pages?.flatMap((page) => page.results || []) ?? [];
+ const totalCount = data?.pages[0]?.count ?? 0;
useEffect(() => {
- fetchNextPage(true);
- }, [props.section]);
+ refetch();
+ }, [section.id, refetch]);
return (
- {(provided) => (
+ {(provided, _snapshot) => (
-
{section.title}
- {typeof totalCount === "undefined" ? "..." : totalCount}
+ {isLoading ? "..." : totalCount}
- {!fetchingNextPage && totalCount === 0 && (
+
{
+ const target = e.target as HTMLDivElement;
+ if (
+ target.scrollTop + target.clientHeight >=
+ target.scrollHeight - 100
+ ) {
+ if (hasNextPage && !isFetchingNextPage) {
+ fetchNextPage();
+ }
+ }
+ }}
+ >
+ {!isLoading && items.length === 0 && (
- {(provided) => (
-
- ))}
- {fetchingNextPage && (
+ {items.map((item, index) => (
+
+ {(provided, _snapshot) => (
+
+ ))}
+ {provided.placeholder}
+ {isFetchingNextPage && (
)}
diff --git a/src/components/Patient/PatientDetailsTab/Demography.tsx b/src/components/Patient/PatientDetailsTab/Demography.tsx
index d6e1379cd7e..95811be7361 100644
--- a/src/components/Patient/PatientDetailsTab/Demography.tsx
+++ b/src/components/Patient/PatientDetailsTab/Demography.tsx
@@ -3,7 +3,6 @@ import { navigate } from "raviger";
import { Fragment, useEffect, useState } from "react";
import { useTranslation } from "react-i18next";
-import Chip from "@/CAREUI/display/Chip";
import CareIcon from "@/CAREUI/icons/CareIcon";
import AuthorizedChild from "@/CAREUI/misc/AuthorizedChild";
@@ -356,23 +355,6 @@ export const Demography = (props: PatientProps) => {
{t("no_results_found")}
)}
- {items
- .filter((item) => item)
- .map((item, i) => (
-
- {props.itemRender(item)}
-
- )}
-
+ {props.itemRender(item)}
+
+ )}
+
-
{({ isAuthorized }) => (
diff --git a/src/components/Patient/PatientHome.tsx b/src/components/Patient/PatientHome.tsx
index 1c992445706..b50c73ece88 100644
--- a/src/components/Patient/PatientHome.tsx
+++ b/src/components/Patient/PatientHome.tsx
@@ -5,19 +5,11 @@ import { useTranslation } from "react-i18next";
import Chip from "@/CAREUI/display/Chip";
import CareIcon from "@/CAREUI/icons/CareIcon";
-import { Avatar } from "@/components/Common/Avatar";
-import ButtonV2 from "@/components/Common/ButtonV2";
+import { Button } from "@/components/ui/button";
+
+import { AuthorizedButton } from "@/components/Common/AuthorizedButton";
import ConfirmDialog from "@/components/Common/ConfirmDialog";
-import Loading from "@/components/Common/Loading";
-import Page from "@/components/Common/Page";
import UserAutocomplete from "@/components/Common/UserAutocompleteFormField";
-import { patientTabs } from "@/components/Patient/PatientDetailsTab";
-import { isPatientMandatoryDataFilled } from "@/components/Patient/Utils";
-import {
- AssignedToObjectModel,
- PatientModel,
-} from "@/components/Patient/models";
-import { SkillModel, UserBareMinimum } from "@/components/Users/models";
import useAuthUser from "@/hooks/useAuthUser";
@@ -34,6 +26,7 @@ import dayjs from "@/Utils/dayjs";
import routes from "@/Utils/request/api";
import request from "@/Utils/request/request";
import useTanStackQueryInstead from "@/Utils/request/useQuery";
+
import {
formatDateTime,
formatName,
@@ -42,7 +35,14 @@ import {
isAntenatal,
isPostPartum,
relativeDate,
-} from "@/Utils/utils";
+} from "../../Utils/utils";
+import { Avatar } from "../Common/Avatar";
+import Loading from "../Common/Loading";
+import Page from "../Common/Page";
+import { SkillModel, UserBareMinimum } from "../Users/models";
+import { patientTabs } from "./PatientDetailsTab";
+import { isPatientMandatoryDataFilled } from "./Utils";
+import { AssignedToObjectModel, PatientModel } from "./models";
export const parseOccupation = (occupation: string | undefined) => {
return OCCUPATION_TYPES.find((i) => i.value === occupation)?.text;
@@ -218,29 +218,55 @@ export const PatientHome = (props: {
@@ -366,7 +392,7 @@ export const PatientHome = (props: {
className="tooltip-text tooltip-bottom flex flex-col text-xs font-medium"
role="tooltip"
>
- {skillsQuery.data?.results.map((skill) => (
+ {skillsQuery.data?.results.map((skill: any) => (
{skill.skill_object.name}
@@ -456,16 +482,15 @@ export const PatientHome = (props: {
-
-
-
- {t("patient_status")}
-
-
-
-
- {patientData?.is_active &&
- (!patientData?.last_consultation ||
- patientData?.last_consultation?.discharge_date) && (
-
-
- navigate(
- `/facility/${patientData?.facility}/patient/${id}/consultation`,
- )
- }
- >
-
-
-
+ {facilityId ===
+ patientData.facility_object?.id.toString() &&
+ patientData?.is_active && (
+ <>
+ {patientData?.last_consultation &&
+ !patientData?.last_consultation.discharge_date ? (
+
+
+
+ ) : (
+
+
+
+ )}
+
)}
+
@@ -661,7 +683,7 @@ export const PatientHome = (props: {
{patientData.last_consultation?.new_discharge_reason ===
DISCHARGE_REASONS.find((i) => i.text == "Expired")?.id && (
diff --git a/src/components/Shifting/ShiftingTable.tsx b/src/components/Shifting/ShiftingTable.tsx
index de186a13d56..f7d75e13db2 100644
--- a/src/components/Shifting/ShiftingTable.tsx
+++ b/src/components/Shifting/ShiftingTable.tsx
@@ -134,8 +134,8 @@ export default function ShiftingTable(props: {
{t("actions")}
-
navigate(`/patient/${id}/investigation_reports`)
}
@@ -477,13 +502,12 @@ export const PatientHome = (props: {
/>
{t("investigations_summary")}
-
+
-
navigate(
`/facility/${patientData?.facility}/patient/${id}/files`,
@@ -494,18 +518,17 @@ export const PatientHome = (props: {
+
- {NonReadOnlyUsers && (
+ {NonReadOnlyUsers(authUser.user_type) && (
- setOpenAssignVolunteerDialog(true)}
disabled={false}
authorizeFor={NonReadOnlyUsers}
className="w-full bg-white font-semibold text-green-800 hover:bg-secondary-200"
- size="large"
>
+
)}
-
-
+
-
+
)}
-
+
+
-
+
+
{shift.origin_facility_object?.name}
@@ -197,17 +197,17 @@ export default function ShiftingTable(props: {
+
{shift.assigned_facility_external ||
shift.assigned_facility_object?.name ||
t("yet_to_be_decided")}
-
+
navigate(`/shifting/${shift.external_id}`)}
variant="secondary"
@@ -219,7 +219,7 @@ export default function ShiftingTable(props: {
{shift.status === "COMPLETED" && shift.assigned_facility && (
)}
-
+
(null);
- const [unlinkFacilityData, setUnlinkFacilityData] = useState<{
- show: boolean;
- userName: string;
- facility?: FacilityModel;
- isHomeFacility: boolean;
- }>({ show: false, userName: "", facility: undefined, isHomeFacility: false });
- const authUser = useAuthUser();
- const hideUnlinkFacilityModal = () => {
- setUnlinkFacilityData({
- show: false,
- facility: undefined,
- userName: "",
- isHomeFacility: false,
- });
- };
-
- const {
- data: userFacilities,
- loading: userFacilitiesLoading,
- refetch: refetchUserFacilities,
- } = useTanStackQueryInstead(routes.userListFacility, {
- pathParams: { username },
- query: {
- limit,
- offset,
- },
- onResponse: ({ res, data }) => {
- if (res?.status === 200 && data) {
- setTotalCount(data.count);
- }
- },
- });
-
- const handlePagination = (page: number, limit: number) => {
- const offset = (page - 1) * limit;
- setCurrentPage(page);
- setOffset(offset);
- };
-
- const updateHomeFacility = async (username: string, facility: any) => {
- setIsLoading(true);
- const { res } = await request(routes.partialUpdateUser, {
- pathParams: { username },
- body: { home_facility: facility.id.toString() },
- });
- if (!res?.ok) {
- Notification.Error({
- msg: "Error while updating Home facility",
- });
- } else {
- user.home_facility_object = facility;
- Notification.Success({
- msg: "Home Facility updated successfully",
- });
- }
- await refetchUserFacilities();
- setIsLoading(false);
- };
-
- const handleUnlinkFacilitySubmit = async () => {
- setIsLoading(true);
- if (unlinkFacilityData.isHomeFacility) {
- const { res } = await request(routes.clearHomeFacility, {
- pathParams: { username },
- });
-
- if (!res?.ok) {
- Notification.Error({
- msg: "Error while clearing home facility",
- });
- } else {
- user.home_facility_object = null;
- Notification.Success({
- msg: "Home Facility cleared successfully",
- });
- }
- } else {
- const { res } = await request(routes.deleteUserFacility, {
- pathParams: { username },
- body: { facility: unlinkFacilityData?.facility?.id?.toString() },
- });
- if (!res?.ok) {
- Notification.Error({
- msg: "Error while unlinking home facility",
- });
- } else {
- Notification.Success({
- msg: "Facility unlinked successfully",
- });
- }
- }
- await refetchUserFacilities();
- hideUnlinkFacilityModal();
- setIsLoading(false);
- };
-
- const addFacility = async (username: string, facility: any) => {
- setIsLoading(true);
- const { res } = await request(routes.addUserFacility, {
- pathParams: { username },
- body: { facility: facility.id.toString() },
- });
-
- if (!res?.ok) {
- Notification.Error({
- msg: "Error while linking facility",
- });
- } else {
- Notification.Success({
- msg: "Facility linked successfully",
- });
- }
- await refetchUserFacilities();
- setIsLoading(false);
- setFacility(null);
- };
-
- return (
-
- {unlinkFacilityData.show && (
-
- - {isLoading || userFacilitiesLoading ? ( -
- );
-}
diff --git a/src/components/Users/UserHome.tsx b/src/components/Users/UserHome.tsx
index 8c12ad2c561..f441e66370d 100644
--- a/src/components/Users/UserHome.tsx
+++ b/src/components/Users/UserHome.tsx
@@ -38,6 +38,8 @@ export default function UserHome(props: UserHomeProps) {
if (!username) {
username = authUser.username;
}
+ const loggedInUser = username === authUser.username;
+ const urlPrefix = loggedInUser ? "/user" : `/users/${username}`;
const { loading, refetch: refetchUserDetails } = useTanStackQueryInstead(
routes.getUserDetails,
@@ -96,7 +98,11 @@ export default function UserHome(props: UserHomeProps) {
<>
- addFacility(username, facility)}
- >
- {t("add")}
-
-
- - - {isLoading || userFacilitiesLoading ? ( -
-
- ) : (
-
- {/* Home Facility section */}
- {user?.home_facility_object && (
-
- )}
-
-
- )}
-
- {/* Linked Facilities section */}
- {!!userFacilities?.results.length && (
-
-
-
- {user?.home_facility_object?.name}
-
-
-
-
-
- )}
-
-
- )}
- {!user?.home_facility_object && !userFacilities?.results.length && (
-
- {userFacilities.results.map(
- (facility: FacilityModel, i: number) => {
- if (user?.home_facility_object?.id === facility.id) {
- // skip if it's a home facility
- return null;
- }
- return (
-
- {totalCount > limit && (
-
-
- );
- },
- )}
-
- {facility.name}
- {(["DistrictAdmin", "StateAdmin"].includes(
- authUser.user_type,
- ) ||
- username === authUser.username) && (
-
-
- {authUser.user_type !== "Nurse" && (
-
- )}
-
-
- )}
-
-
- )}
-
-
- )}
-
- 
-
-
- - {t("no_linked_facilities")} -
-
{t(`USERMANAGEMENT_TAB__${p}`)}
diff --git a/src/components/Users/UserProfile.tsx b/src/components/Users/UserProfile.tsx
deleted file mode 100644
index 786e569c4db..00000000000
--- a/src/components/Users/UserProfile.tsx
+++ /dev/null
@@ -1,1032 +0,0 @@
-import careConfig from "@careConfig";
-import { FormEvent, useEffect, useReducer, useState } from "react";
-import { useTranslation } from "react-i18next";
-
-import CareIcon from "@/CAREUI/icons/CareIcon";
-
-import AvatarEditModal from "@/components/Common/AvatarEditModal";
-import AvatarEditable from "@/components/Common/AvatarEditable";
-import ButtonV2, { Submit } from "@/components/Common/ButtonV2";
-import LanguageSelector from "@/components/Common/LanguageSelector";
-import Loading from "@/components/Common/Loading";
-import Page from "@/components/Common/Page";
-import UpdatableApp, { checkForUpdate } from "@/components/Common/UpdatableApp";
-import { PhoneNumberValidator } from "@/components/Form/FieldValidators";
-import DateFormField from "@/components/Form/FormFields/DateFormField";
-import PhoneNumberFormField from "@/components/Form/FormFields/PhoneNumberFormField";
-import { SelectFormField } from "@/components/Form/FormFields/SelectFormField";
-import TextFormField from "@/components/Form/FormFields/TextFormField";
-import { FieldChangeEvent } from "@/components/Form/FormFields/Utils";
-import { validateRule } from "@/components/Users/UserAddEditForm";
-import {
- GenderType,
- SkillModel,
- UpdatePasswordForm,
-} from "@/components/Users/models";
-
-import useAuthUser, { useAuthContext } from "@/hooks/useAuthUser";
-
-import { GENDER_TYPES } from "@/common/constants";
-import { validateEmailAddress } from "@/common/validation";
-
-import * as Notification from "@/Utils/Notifications";
-import dayjs from "@/Utils/dayjs";
-import routes from "@/Utils/request/api";
-import request from "@/Utils/request/request";
-import uploadFile from "@/Utils/request/uploadFile";
-import useTanStackQueryInstead from "@/Utils/request/useQuery";
-import { getAuthorizationHeader } from "@/Utils/request/utils";
-import {
- dateQueryString,
- formatDate,
- formatDisplayName,
- isValidUrl,
- parsePhoneNumber,
- sleep,
-} from "@/Utils/utils";
-
-type EditForm = {
- firstName: string;
- lastName: string;
- date_of_birth: Date | null | string;
- gender: GenderType;
- email: string;
- video_connect_link: string | undefined;
- phoneNumber: string;
- altPhoneNumber: string;
- user_type: string | undefined;
- qualification: string | undefined;
- doctor_experience_commenced_on: number | string | undefined;
- doctor_medical_council_registration: string | undefined;
- weekly_working_hours: string | null | undefined;
-};
-type ErrorForm = {
- firstName: string;
- lastName: string;
- date_of_birth: string | null;
- gender: string;
- email: string;
- video_connect_link: string | undefined;
- phoneNumber: string;
- altPhoneNumber: string;
- user_type: string | undefined;
- qualification: string | undefined;
- doctor_experience_commenced_on: number | string | undefined;
- doctor_medical_council_registration: string | undefined;
- weekly_working_hours: string | undefined;
-};
-type State = {
- form: EditForm;
- errors: ErrorForm;
-};
-type Action =
- | { type: "set_form"; form: EditForm }
- | { type: "set_error"; errors: ErrorForm };
-
-const initForm: EditForm = {
- firstName: "",
- lastName: "",
- date_of_birth: null,
- gender: "Male",
- video_connect_link: "",
- email: "",
- phoneNumber: "",
- altPhoneNumber: "",
- user_type: "",
- qualification: undefined,
- doctor_experience_commenced_on: undefined,
- doctor_medical_council_registration: undefined,
- weekly_working_hours: undefined,
-};
-
-const initError: ErrorForm = Object.assign(
- {},
- ...Object.keys(initForm).map((k) => ({ [k]: "" })),
-);
-
-const initialState: State = {
- form: { ...initForm },
- errors: { ...initError },
-};
-
-const editFormReducer = (state: State, action: Action) => {
- switch (action.type) {
- case "set_form": {
- return {
- ...state,
- form: action.form,
- };
- }
- case "set_error": {
- return {
- ...state,
- errors: action.errors,
- };
- }
- }
-};
-
-export default function UserProfile() {
- const { t } = useTranslation();
- const { signOut, refetchUser } = useAuthContext();
- const [states, dispatch] = useReducer(editFormReducer, initialState);
- const [editAvatar, setEditAvatar] = useState(false);
- const [updateStatus, setUpdateStatus] = useState({
- isChecking: false,
- isUpdateAvailable: false,
- });
- const [dirty, setDirty] = useState(false);
-
- const authUser = useAuthUser();
-
- const [changePasswordForm, setChangePasswordForm] = useState<{
- username: string;
- old_password: string;
- new_password_1: string;
- new_password_2: string;
- }>({
- username: authUser.username,
- old_password: "",
- new_password_1: "",
- new_password_2: "",
- });
-
- const [changePasswordErrors] = useState<{
- old_password: string;
- password_confirmation: string;
- }>({
- old_password: "",
- password_confirmation: "",
- });
-
- const [showEdit, setShowEdit] = useState(false);
-
- useEffect(() => {
- const formData: EditForm = {
- firstName: authUser.first_name,
- lastName: authUser.last_name,
- date_of_birth: authUser.date_of_birth || null,
- gender: authUser.gender || "Male",
- email: authUser.email,
- video_connect_link: authUser.video_connect_link,
- phoneNumber: authUser.phone_number?.toString() || "",
- altPhoneNumber: authUser.alt_phone_number?.toString() || "",
- user_type: authUser.user_type,
- qualification: authUser.qualification,
- doctor_experience_commenced_on: dayjs().diff(
- dayjs(authUser.doctor_experience_commenced_on),
- "years",
- ),
- doctor_medical_council_registration:
- authUser.doctor_medical_council_registration,
- weekly_working_hours: authUser.weekly_working_hours,
- };
- dispatch({
- type: "set_form",
- form: formData,
- });
- setDirty(false);
- }, [authUser]);
-
- const { data: skillsView, loading: isSkillsLoading } =
- useTanStackQueryInstead(routes.userListSkill, {
- pathParams: { username: authUser.username },
- });
-
- const validatePassword = (password: string) => {
- const rules = [
- {
- test: (p: string) => p.length >= 8,
- message: "Password should be at least 8 characters long",
- },
- {
- test: (p: string) => p !== p.toUpperCase(),
- message: "Password should contain at least 1 lowercase letter",
- },
- {
- test: (p: string) => p !== p.toLowerCase(),
- message: "Password should contain at least 1 uppercase letter",
- },
- {
- test: (p: string) => /\d/.test(p),
- message: "Password should contain at least 1 number",
- },
- ];
- return rules.map((rule) =>
- validateRule(rule.test(password), rule.message, !password),
- );
- };
-
- const validateNewPassword = (password: string) => {
- if (
- password.length < 8 ||
- !/\d/.test(password) ||
- password === password.toUpperCase() ||
- password === password.toLowerCase()
- ) {
- return false;
- }
- return true;
- };
-
- const validateForm = () => {
- const errors = { ...initError };
- let invalidForm = false;
- Object.keys(states.form).forEach((field) => {
- switch (field) {
- case "firstName":
- case "lastName":
- case "gender":
- if (!states.form[field]) {
- errors[field] = t("field_required");
- invalidForm = true;
- }
- return;
- case "date_of_birth":
- if (!states.form[field]) {
- errors[field] = "Enter a valid date of birth";
- invalidForm = true;
- } else if (
- !dayjs(states.form[field]).isValid() ||
- dayjs(states.form[field]).isAfter(dayjs().subtract(17, "year"))
- ) {
- errors[field] = "Enter a valid date of birth";
- invalidForm = true;
- }
- return;
- case "phoneNumber":
- // eslint-disable-next-line no-case-declarations
- const phoneNumber = parsePhoneNumber(states.form[field]);
-
- // eslint-disable-next-line no-case-declarations
- let is_valid = false;
- if (phoneNumber) {
- is_valid = PhoneNumberValidator()(phoneNumber) === undefined;
- }
-
- if (!states.form[field] || !is_valid) {
- errors[field] = "Please enter valid phone number";
- invalidForm = true;
- }
- return;
- case "altPhoneNumber":
- // eslint-disable-next-line no-case-declarations
- let alt_is_valid = false;
- if (states.form[field] && states.form[field] !== "+91") {
- const altPhoneNumber = parsePhoneNumber(states.form[field]);
- if (altPhoneNumber) {
- alt_is_valid =
- PhoneNumberValidator(["mobile"])(altPhoneNumber) === undefined;
- }
- }
-
- if (
- states.form[field] &&
- states.form[field] !== "+91" &&
- !alt_is_valid
- ) {
- errors[field] = "Please enter valid mobile number";
- invalidForm = true;
- }
- return;
- case "email":
- if (!states.form[field]) {
- errors[field] = t("field_required");
- invalidForm = true;
- } else if (!validateEmailAddress(states.form[field])) {
- errors[field] = "Enter a valid email address";
- invalidForm = true;
- }
- return;
- case "doctor_experience_commenced_on":
- if (states.form.user_type === "Doctor" && !states.form[field]) {
- errors[field] = t("field_required");
- invalidForm = true;
- } else if (
- (states.form.user_type === "Doctor" &&
- Number(states.form.doctor_experience_commenced_on) >= 100) ||
- Number(states.form.doctor_experience_commenced_on) < 0
- ) {
- errors[field] =
- "Doctor experience should be at least 0 years and less than 100 years.";
- invalidForm = true;
- }
- return;
- case "qualification":
- if (
- (states.form.user_type === "Doctor" ||
- states.form.user_type === "Nurse") &&
- !states.form[field]
- ) {
- errors[field] = t("field_required");
- invalidForm = true;
- }
- return;
- case "doctor_medical_council_registration":
- if (states.form.user_type === "Doctor" && !states.form[field]) {
- errors[field] = t("field_required");
- invalidForm = true;
- }
- return;
- case "weekly_working_hours":
- if (
- states.form[field] &&
- (Number(states.form[field]) < 0 ||
- Number(states.form[field]) > 168 ||
- !/^\d+$/.test(states.form[field] ?? ""))
- ) {
- errors[field] =
- "Average weekly working hours must be a number between 0 and 168";
- invalidForm = true;
- }
- return;
- case "video_connect_link":
- if (states.form[field]) {
- if (isValidUrl(states.form[field]) === false) {
- errors[field] = "Please enter a valid url";
- invalidForm = true;
- }
- }
- return;
- }
- });
- dispatch({ type: "set_error", errors });
- return !invalidForm;
- };
-
- const handleFieldChange = (event: FieldChangeEvent) => {
- dispatch({
- type: "set_form",
- form: { ...states.form, [event.name]: event.value },
- });
- setDirty(true);
- };
-
- const getDate = (value: any) =>
- value && dayjs(value).isValid() && dayjs(value).toDate();
-
- const fieldProps = (name: string) => {
- return {
- name,
- id: name,
- value: (states.form as any)[name],
- onChange: handleFieldChange,
- error: (states.errors as any)[name],
- };
- };
-
- const handleSubmit = async (e: FormEvent) => {
- e.preventDefault();
- const validForm = validateForm();
- if (validForm) {
- const data = {
- username: authUser.username,
- first_name: states.form.firstName,
- last_name: states.form.lastName,
- email: states.form.email,
- video_connect_link: states.form.video_connect_link,
- phone_number: parsePhoneNumber(states.form.phoneNumber) ?? "",
- alt_phone_number: parsePhoneNumber(states.form.altPhoneNumber) ?? "",
- gender: states.form.gender,
- date_of_birth: dateQueryString(states.form.date_of_birth),
- qualification:
- states.form.user_type === "Doctor" ||
- states.form.user_type === "Nurse"
- ? states.form.qualification
- : undefined,
- doctor_experience_commenced_on:
- states.form.user_type === "Doctor"
- ? dayjs()
- .subtract(
- parseInt(
- (states.form.doctor_experience_commenced_on as string) ??
- "0",
- ),
- "years",
- )
- .format("YYYY-MM-DD")
- : undefined,
- doctor_medical_council_registration:
- states.form.user_type === "Doctor"
- ? states.form.doctor_medical_council_registration
- : undefined,
- weekly_working_hours:
- states.form.weekly_working_hours &&
- states.form.weekly_working_hours !== ""
- ? states.form.weekly_working_hours
- : null,
- };
- const { res } = await request(routes.partialUpdateUser, {
- pathParams: { username: authUser.username },
- body: data,
- });
- if (res?.ok) {
- Notification.Success({
- msg: "Details updated successfully",
- });
- await refetchUser();
- setShowEdit(false);
- }
- }
- };
-
- const isLoading = isSkillsLoading;
-
- if (isLoading) {
- return
- setEditAvatar(false)}
- />
-
- );
-}
diff --git a/src/components/Users/UserSoftwareUpdate.tsx b/src/components/Users/UserSoftwareUpdate.tsx
new file mode 100644
index 00000000000..5cc685f575d
--- /dev/null
+++ b/src/components/Users/UserSoftwareUpdate.tsx
@@ -0,0 +1,72 @@
+import { useState } from "react";
+import { useTranslation } from "react-i18next";
+
+import CareIcon from "@/CAREUI/icons/CareIcon";
+
+import { Button } from "@/components/ui/button";
+
+import UpdatableApp, { checkForUpdate } from "@/components/Common/UpdatableApp";
+
+import * as Notification from "@/Utils/Notifications";
+
+export default function UserSoftwareUpdate() {
+ const [updateStatus, setUpdateStatus] = useState({
+ isChecking: false,
+ isUpdateAvailable: false,
+ });
+ const { t } = useTranslation();
+
+ const checkUpdates = async () => {
+ setUpdateStatus({ ...updateStatus, isChecking: true });
+ await new Promise((resolve) => setTimeout(resolve, 500));
+ if ((await checkForUpdate()) != null) {
+ setUpdateStatus({
+ isUpdateAvailable: true,
+ isChecking: false,
+ });
+ } else {
+ setUpdateStatus({
+ isUpdateAvailable: false,
+ isChecking: false,
+ });
+ Notification.Success({
+ msg: "No update available",
+ });
+ }
+ };
+
+ return (
+ <>
+ {updateStatus.isChecking ? (
+ // While checking for updates
+
+ ) : updateStatus.isUpdateAvailable ? (
+ // When an update is available
+
+
+
+ ) : (
+ // Default state to check for updates
+
+ )}
+
+ );
+}
diff --git a/src/components/Users/UserSummary.tsx b/src/components/Users/UserSummary.tsx
index f75aa066e65..9b703deddbd 100644
--- a/src/components/Users/UserSummary.tsx
+++ b/src/components/Users/UserSummary.tsx
@@ -15,6 +15,7 @@ import {
UserProfessionalInfoView,
} from "@/components/Users/UserEditDetails";
import UserResetPassword from "@/components/Users/UserResetPassword";
+import UserSoftwareUpdate from "@/components/Users/UserSoftwareUpdate";
import {
BasicInfoDetails,
ContactInfoDetails,
@@ -200,12 +201,20 @@ export default function UserSummaryTab({
/>
)}
{authUser.username === userData.username && (
-
-
-
-
-
- - {t("local_body")}, {t("district")}, {t("state")}{" "} - {t("are_non_editable_fields")}. -
-
- setEditAvatar(!editAvatar)}
- className="h-20 w-20"
- />
-
-
-
- - {authUser.first_name} {authUser.last_name} -
-- @{authUser.username} -
-
- setShowEdit(!showEdit)}
- type="button"
- id="edit-cancel-profile-button"
- >
- {showEdit ? t("cancel") : t("edit_user_profile")}
-
-
-
-
-
- {!showEdit && !isLoading && (
-
-
-
- )}
- {showEdit && (
- -
-
- - {t("username")} - -
- - {authUser.username || "-"} - -
- - {t("phone_number")} - -
- - {authUser.phone_number || "-"} - -
- - {t("whatsapp_number")} - -
- - {authUser.alt_phone_number || "-"} - -
- - {t("email")} - -
- - {authUser.email || "-"} - -
- - {t("first_name")} - -
- - {authUser.first_name || "-"} - -
- - {t("last_name")} - -
- - {authUser.last_name || "-"} - -
- - {t("date_of_birth")} - -
- - {authUser.date_of_birth - ? formatDate(authUser.date_of_birth) - : "-"} - -
- - {t("access_level")} - -
-
-
- {authUser.user_type || "-"} -
- - - {t("gender")} - -
- - {authUser.gender || "-"} - -
- - {t("local_body")} - -
- - {authUser.local_body_object?.name || "-"} - -
- - {t("district")} - -
- - {authUser.district_object?.name || "-"} - -
- - {t("state")} - -
- - {authUser.state_object?.name || "-"} - -
- - {t("skills")} - -
-
- - {skillsView?.results?.length - ? skillsView.results?.map((skill: SkillModel) => { - return ( - --
- {skill.skill_object.name} -
- - ); - }) - : "-"} -
- - - {t("average_weekly_working_hours")} - -
- - {authUser.weekly_working_hours ?? "-"} - -
- - {t("video_conference_link")} - -
- - {authUser.video_connect_link ? ( - - {authUser.video_connect_link} - - ) : ( - "-" - )} - -
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- )}
-
-
-
-
-
-
- - {t("language_selection")} -
-- {t("set_your_local_language")} -
-
-
-
-
-
-
-
-
- - {t("software_update")} -
-- {t("check_for_available_update")} -
-
- {updateStatus.isChecking ? (
- // While checking for updates
-
-
- ) : updateStatus.isUpdateAvailable ? (
- // When an update is available
-
-
-
-
- ) : (
- // Default state to check for updates
-
-
- )}
-
-
-
-
-
-
-
-
diff --git a/src/components/ui/breadcrumb.tsx b/src/components/ui/breadcrumb.tsx
new file mode 100644
index 00000000000..de505bc5833
--- /dev/null
+++ b/src/components/ui/breadcrumb.tsx
@@ -0,0 +1,118 @@
+import { ChevronRightIcon, DotsHorizontalIcon } from "@radix-ui/react-icons";
+import { Slot } from "@radix-ui/react-slot";
+import * as React from "react";
+
+import { cn } from "@/lib/utils";
+
+const Breadcrumb = React.forwardRef<
+ HTMLElement,
+ React.ComponentPropsWithoutRef<"nav"> & {
+ separator?: React.ReactNode;
+ }
+>(({ ...props }, ref) => );
+Breadcrumb.displayName = "Breadcrumb";
+
+const BreadcrumbList = React.forwardRef<
+ HTMLOListElement,
+ React.ComponentPropsWithoutRef<"ol">
+>(({ className, ...props }, ref) => (
+