{asset.manufacturer}
@@ -78,7 +78,10 @@ export default function AssetWarrantyCard(props: { asset: AssetData }) {
["Phone", asset.support_phone, "l-phone"],
["Email", asset.support_email, "l-envelope"],
].map((item) => (
-
+
({
return (
{item[1] && (
<>
([]);
const authUser = useAuthUser();
+ const queryClient = useQueryClient();
- const fetchEditHistory = async () => {
- const { res, data } = await request(routes.getPatientNoteEditHistory, {
+ const { data, refetch } = useQuery({
+ queryKey: [patientId, note.id],
+ queryFn: query(routes.getPatientNoteEditHistory, {
pathParams: { patientId, noteId: note.id },
- });
- if (res?.status === 200) {
- setEditHistory(data?.results ?? []);
- }
- };
+ }),
+ });
+
+ const { mutate: updateNote } = useMutation({
+ mutationFn: mutate(routes.updatePatientNote, {
+ pathParams: { patientId, noteId: note.id },
+ }),
+ onSuccess: () => {
+ Success({ msg: "Note updated successfully" });
+ queryClient.invalidateQueries({ queryKey: ["notes", patientId] });
+ setIsEditing(false);
+ },
+ });
const onUpdateNote = async () => {
if (noteField === note.note) {
@@ -69,20 +80,15 @@ const PatientNoteCard = ({
return;
}
- const { res } = await request(routes.updatePatientNote, {
- pathParams: { patientId, noteId: note.id },
- body: payload,
- });
- if (res?.status === 200) {
- Success({ msg: "Note updated successfully" });
- setIsEditing(false);
- setReload(true);
- }
+ updateNote(payload);
};
+ useEffect(() => {
+ setEditHistory(data?.results ?? []);
+ }, [data]);
+
return (
<>
- {" "}
) : (
-
}
diff --git a/src/components/Facility/PatientNotesList.tsx b/src/components/Facility/PatientNotesList.tsx
index 8db68395744..d4de60512d1 100644
--- a/src/components/Facility/PatientNotesList.tsx
+++ b/src/components/Facility/PatientNotesList.tsx
@@ -1,4 +1,5 @@
-import { useEffect, useState } from "react";
+import { useInfiniteQuery } from "@tanstack/react-query";
+import { useEffect } from "react";
import CircularProgress from "@/components/Common/CircularProgress";
import DoctorNote from "@/components/Facility/DoctorNote";
@@ -10,7 +11,7 @@ import {
import { RESULTS_PER_PAGE_LIMIT } from "@/common/constants";
import routes from "@/Utils/request/api";
-import request from "@/Utils/request/request";
+import { callApi } from "@/Utils/request/query";
interface PatientNotesProps {
state: PatientNoteStateType;
@@ -23,57 +24,51 @@ interface PatientNotesProps {
setReplyTo?: (reply_to: PatientNotesModel | undefined) => void;
}
-const pageSize = RESULTS_PER_PAGE_LIMIT;
-
const PatientNotesList = (props: PatientNotesProps) => {
- const { state, setState, reload, setReload, thread, setReplyTo } = props;
-
- const [isLoading, setIsLoading] = useState(true);
+ const { state, setState, thread, setReplyTo, setReload, patientId, reload } =
+ props;
- const fetchNotes = async () => {
- setIsLoading(true);
- const { data }: any = await request(routes.getPatientNotes, {
- pathParams: { patientId: props.patientId },
- query: {
- offset: (state.cPage - 1) * RESULTS_PER_PAGE_LIMIT,
- thread,
- },
- });
+ const { data, isLoading, fetchNextPage, hasNextPage } = useInfiniteQuery({
+ queryKey: ["notes", patientId, thread],
+ queryFn: async ({ pageParam = 0, signal }) => {
+ const response = await callApi(routes.getPatientNotes, {
+ pathParams: { patientId },
+ queryParams: { thread, offset: pageParam },
+ signal,
+ });
- if (state.cPage === 1) {
- setState((prevState: any) => ({
- ...prevState,
- notes: data.results,
- totalPages: Math.ceil(data.count / pageSize),
- }));
- } else {
- setState((prevState: any) => ({
- ...prevState,
- notes: [...prevState.notes, ...data.results],
- totalPages: Math.ceil(data.count / pageSize),
- }));
- }
- setIsLoading(false);
- setReload(false);
- };
+ return {
+ results: response?.results ?? [],
+ nextPage: pageParam + RESULTS_PER_PAGE_LIMIT,
+ totalResults: response?.count ?? 0,
+ };
+ },
+ getNextPageParam: (lastPage, allPages) => {
+ const currentResults = allPages.flatMap((page) => page.results).length;
+ if (currentResults < lastPage.totalResults) {
+ return lastPage.nextPage;
+ }
+ return undefined;
+ },
+ initialPageParam: 0,
+ });
useEffect(() => {
- if (reload || thread) {
- fetchNotes();
- }
- }, [reload, thread]);
+ if (data?.pages) {
+ const allNotes = data.pages.flatMap((page) => page.results);
+
+ const notesMap = new Map(allNotes.map((note) => [note.id, note]));
+
+ const deduplicatedNotes = Array.from(notesMap.values());
- const handleNext = () => {
- if (state.cPage < state.totalPages) {
setState((prevState: any) => ({
...prevState,
- cPage: prevState.cPage + 1,
+ notes: deduplicatedNotes,
}));
- setReload(true);
}
- };
+ }, [data]);
- if (isLoading) {
+ if (isLoading || reload) {
return (
diff --git a/src/components/Common/AuthorizedButton.tsx b/src/components/Common/AuthorizedButton.tsx
new file mode 100644
index 00000000000..2b611a0c9f2
--- /dev/null
+++ b/src/components/Common/AuthorizedButton.tsx
@@ -0,0 +1,19 @@
+import { Button, ButtonProps } from "@headlessui/react";
+
+import AuthorizedChild from "@/CAREUI/misc/AuthorizedChild";
+
+import { AuthorizedElementProps } from "@/Utils/AuthorizeFor";
+
+export const AuthorizedButton: React.FC<
+ AuthorizedElementProps & ButtonProps
+> = ({ authorizeFor = () => true, ...props }) => {
+ return (
+
+ {({ isAuthorized }) => (
+
+ )}
+
+ );
+};
diff --git a/src/components/Common/Breadcrumbs.tsx b/src/components/Common/Breadcrumbs.tsx
index c2c4aa57446..f55edd4ccf6 100644
--- a/src/components/Common/Breadcrumbs.tsx
+++ b/src/components/Common/Breadcrumbs.tsx
@@ -3,7 +3,19 @@ import { useState } from "react";
import CareIcon from "@/CAREUI/icons/CareIcon";
+import {
+ Breadcrumb,
+ BreadcrumbItem,
+ BreadcrumbList,
+ BreadcrumbSeparator,
+} from "@/components/ui/breadcrumb";
import { Button } from "@/components/ui/button";
+import {
+ DropdownMenu,
+ DropdownMenuContent,
+ DropdownMenuItem,
+ DropdownMenuTrigger,
+} from "@/components/ui/dropdown-menu";
import useAppHistory from "@/hooks/useAppHistory";
@@ -69,76 +81,84 @@ export default function Breadcrumbs({
className={classNames("text-sm font-normal", crumb.style)}
>
= ({
const right = popOverX > viewportWidth - (allowTime ? 420 : 300);
const top = popOverY > viewportHeight - 400;
- return `${right ? "md:-translate-x-1/2" : ""} ${top ? "md:-translate-y-[calc(100%+50px)]" : ""}`;
+ return `${right ? "sm:-translate-x-1/2" : ""} ${top ? "md:-translate-y-[calc(100%+50px)]" : ""} ${right ? "max-sm:-translate-x-1/2" : ""} ${top ? "max-sm:-translate-y-[calc(100%+50px)]" : ""}`.trim();
};
const domValue = useValueInjectionObserver({
diff --git a/src/components/Facility/ConsultationCard.tsx b/src/components/Facility/ConsultationCard.tsx
index a2ede9f2667..d67926a3c6b 100644
--- a/src/components/Facility/ConsultationCard.tsx
+++ b/src/components/Facility/ConsultationCard.tsx
@@ -30,6 +30,7 @@ export const ConsultationCard = (props: ConsultationProps) => {
: !itemData.current_bed
? t("assign_bed")
: t("switch_bed");
+
return (
<>
{
)}
diff --git a/src/components/Facility/PatientConsultationNotesList.tsx b/src/components/Facility/PatientConsultationNotesList.tsx
index 243821b7d6d..adf922ad265 100644
--- a/src/components/Facility/PatientConsultationNotesList.tsx
+++ b/src/components/Facility/PatientConsultationNotesList.tsx
@@ -1,4 +1,5 @@
-import { Dispatch, SetStateAction, useEffect, useState } from "react";
+import { useInfiniteQuery } from "@tanstack/react-query";
+import { Dispatch, SetStateAction, useEffect } from "react";
import CircularProgress from "@/components/Common/CircularProgress";
import DoctorNote from "@/components/Facility/DoctorNote";
@@ -12,7 +13,7 @@ import useSlug from "@/hooks/useSlug";
import { RESULTS_PER_PAGE_LIMIT } from "@/common/constants";
import routes from "@/Utils/request/api";
-import request from "@/Utils/request/request";
+import { callApi } from "@/Utils/request/query";
interface PatientNotesProps {
state: PatientNoteStateType;
@@ -24,80 +25,63 @@ interface PatientNotesProps {
setReplyTo?: (value: PatientNotesModel | undefined) => void;
}
-const pageSize = RESULTS_PER_PAGE_LIMIT;
-
const PatientConsultationNotesList = (props: PatientNotesProps) => {
const {
state,
setState,
- reload,
setReload,
disableEdit,
thread,
setReplyTo,
+ reload,
} = props;
- const consultationId = useSlug("consultation") ?? "";
-
- const [isLoading, setIsLoading] = useState(true);
-
- const fetchNotes = async () => {
- setIsLoading(true);
- const { data } = await request(routes.getPatientNotes, {
- pathParams: {
- patientId: props.state.patientId || "",
- },
- query: {
- consultation: consultationId,
- thread,
- offset: (state.cPage - 1) * RESULTS_PER_PAGE_LIMIT,
- },
- });
+ const consultationId = useSlug("consultation") ?? "";
- if (data) {
- if (state.cPage === 1) {
- setState((prevState) => ({
- ...prevState,
- notes: data.results,
- totalPages: Math.ceil(data.count / pageSize),
- }));
- } else {
- setState((prevState) => ({
- ...prevState,
- notes: [...prevState.notes, ...data.results],
- totalPages: Math.ceil(data.count / pageSize),
- }));
+ const { data, isLoading, fetchNextPage, hasNextPage } = useInfiniteQuery({
+ queryKey: ["notes", state.patientId, thread, consultationId],
+ queryFn: async ({ pageParam = 0, signal }) => {
+ const response = await callApi(routes.getPatientNotes, {
+ pathParams: { patientId: state.patientId! },
+ queryParams: {
+ thread,
+ offset: pageParam,
+ consultation: consultationId,
+ },
+ signal,
+ });
+ return {
+ results: response?.results ?? [],
+ nextPage: pageParam + RESULTS_PER_PAGE_LIMIT,
+ totalResults: response?.count ?? 0,
+ };
+ },
+ getNextPageParam: (lastPage, allPages) => {
+ const currentResults = allPages.flatMap((page) => page.results).length;
+ if (currentResults < lastPage.totalResults) {
+ return lastPage.nextPage;
}
- }
- setIsLoading(false);
- setReload?.(false);
- };
+ return undefined;
+ },
+ initialPageParam: 0,
+ });
useEffect(() => {
- if (reload) {
- fetchNotes();
- }
- }, [reload]);
+ if (data?.pages) {
+ const allNotes = data.pages.flatMap((page) => page.results);
- useEffect(() => {
- fetchNotes();
- }, [thread]);
+ const notesMap = new Map(allNotes.map((note) => [note.id, note]));
- useEffect(() => {
- setReload?.(true);
- }, []);
+ const deduplicatedNotes = Array.from(notesMap.values());
- const handleNext = () => {
- if (state.cPage < state.totalPages) {
setState((prevState) => ({
...prevState,
- cPage: prevState.cPage + 1,
+ notes: deduplicatedNotes,
}));
- setReload?.(true);
}
- };
+ }, [data]);
- if (isLoading) {
+ if (isLoading || reload) {
return (
-
);
};
return (
-
+
);
}
diff --git a/src/components/Common/DateInputV2.tsx b/src/components/Common/DateInputV2.tsx
index 8debee7ac7b..26c6a702c50 100644
--- a/src/components/Common/DateInputV2.tsx
+++ b/src/components/Common/DateInputV2.tsx
@@ -348,7 +348,7 @@ const DateInputV2: React.FC
- void;
disableEdit?: boolean;
setReplyTo?: (reply_to: PatientNotesModel | undefined) => void;
+ hasMore: boolean;
}
const DoctorNote = (props: DoctorNoteProps) => {
- const { state, handleNext, setReload, disableEdit, setReplyTo } = props;
+ const { state, handleNext, setReload, disableEdit, setReplyTo, hasMore } =
+ props;
return (
- {dayjs(itemData.created_date).format("DD/MM/YYYY")}
+
+
{itemData.is_kasp && (
diff --git a/src/components/Facility/ConsultationDoctorNotes/index.tsx b/src/components/Facility/ConsultationDoctorNotes/index.tsx
index c1f3dc43072..00ca268a569 100644
--- a/src/components/Facility/ConsultationDoctorNotes/index.tsx
+++ b/src/components/Facility/ConsultationDoctorNotes/index.tsx
@@ -1,5 +1,6 @@
+import { useQuery } from "@tanstack/react-query";
import { t } from "i18next";
-import { useState } from "react";
+import { useEffect, useState } from "react";
import useKeyboardShortcut from "use-keyboard-shortcut";
import CareIcon from "@/CAREUI/icons/CareIcon";
@@ -13,6 +14,7 @@ import {
PatientNoteStateType,
} from "@/components/Facility/models";
import AutoExpandingTextInputFormField from "@/components/Form/FormFields/AutoExpandingTextInputFormField";
+import { useAddPatientNote } from "@/components/Patient/Utils";
import useAuthUser from "@/hooks/useAuthUser";
import { useMessageListener } from "@/hooks/useMessageListener";
@@ -22,8 +24,7 @@ import { PATIENT_NOTES_THREADS } from "@/common/constants";
import { NonReadOnlyUsers } from "@/Utils/AuthorizeFor";
import * as Notification from "@/Utils/Notifications";
import routes from "@/Utils/request/api";
-import request from "@/Utils/request/request";
-import useTanStackQueryInstead from "@/Utils/request/useQuery";
+import query from "@/Utils/request/query";
import { classNames, isAppleDevice, keysOf } from "@/Utils/utils";
interface ConsultationDoctorNotesProps {
@@ -54,53 +55,47 @@ const ConsultationDoctorNotes = (props: ConsultationDoctorNotesProps) => {
const initialData: PatientNoteStateType = {
notes: [],
- cPage: 1,
- totalPages: 1,
facilityId: facilityId,
patientId: patientId,
};
const [state, setState] = useState(initialData);
- const onAddNote = async () => {
+ const { mutate: addNote } = useAddPatientNote({
+ patientId,
+ thread,
+ consultationId,
+ });
+
+ const onAddNote = () => {
if (!/\S+/.test(noteField)) {
Notification.Error({
msg: "Note Should Contain At Least 1 Character",
});
return;
}
-
- const { res } = await request(routes.addPatientNote, {
- pathParams: {
- patientId: patientId,
- },
- body: {
- note: noteField,
- thread,
- consultation: consultationId,
- reply_to: reply_to?.id,
- },
+ setReplyTo(undefined);
+ setNoteField("");
+ addNote({
+ note: noteField,
+ reply_to: reply_to?.id,
+ thread,
+ consultation: consultationId,
});
-
- if (res?.status === 201) {
- Notification.Success({ msg: "Note added successfully" });
- setState({ ...state, cPage: 1 });
- setNoteField("");
- setReload(true);
- setReplyTo(undefined);
- }
};
- useTanStackQueryInstead(routes.getPatient, {
- pathParams: { id: patientId },
- onResponse: ({ data }) => {
- if (data) {
- setPatientActive(data.is_active ?? true);
- setPatientName(data.name ?? "");
- setFacilityName(data.facility_object?.name ?? "");
- }
- },
+ const { data } = useQuery({
+ queryKey: ["patient", patientId],
+ queryFn: query(routes.getPatient, {
+ pathParams: { patientId },
+ }),
});
+ useEffect(() => {
+ setPatientActive(data?.is_active ?? true);
+ setPatientName(data?.name ?? "");
+ setFacilityName(data?.facility_object?.name ?? "");
+ }, [data]);
+
useMessageListener((data) => {
const message = data?.message;
if (
@@ -147,13 +142,21 @@ const ConsultationDoctorNotes = (props: ConsultationDoctorNotesProps) => {
? "border-primary-500 font-bold text-secondary-800"
: "border-secondary-300 text-secondary-800",
)}
- onClick={() => setThread(PATIENT_NOTES_THREADS[current])}
+ onClick={() => {
+ if (thread !== PATIENT_NOTES_THREADS[current]) {
+ setThread(PATIENT_NOTES_THREADS[current]);
+ setState(initialData);
+ setReplyTo(undefined);
+ setNoteField("");
+ }
+ }}
>
{t(`patient_notes_thread__${current}`)}
))}
+
+
+ {/* Patient Status Section */}
+
+ {dayjs(itemData.created_date).format("DD/MM/YYYY")}
+
+
+
+ {t("patient_status")}
+
+ {
{state.notes.length ? (
-
-
+
+
@@ -233,38 +236,81 @@ export const FacilityCard = (props: {
{["DistrictAdmin", "StateAdmin"].includes(userType) && (
- setNotifyModalFor(facility.id)}
- >
-
+
+
+
+
+
)}
-
-
-
-
+
+
+
+
+
+
+
+
+
+
{/*
*/}
{
- fetchEditHistory();
+ refetch();
setShowEditHistory(true);
}}
>
@@ -207,7 +213,9 @@ const PatientNoteCard = ({
{noteField}
+
+ {noteField}
+
)}
+
{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,104 @@ 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 options = section.fetchOptions(section.id);
+ const fetchPage = async ({ pageParam = 0 }) => {
+ 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: ["board", section.id, options.options?.query],
+ 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/Medicine/MedibaseAutocompleteFormField.tsx b/src/components/Medicine/MedibaseAutocompleteFormField.tsx
index d2d57b1db85..185b3293b99 100644
--- a/src/components/Medicine/MedibaseAutocompleteFormField.tsx
+++ b/src/components/Medicine/MedibaseAutocompleteFormField.tsx
@@ -55,7 +55,7 @@ export default function MedibaseAutocompleteFormField(
required
onChange={field.handleChange}
options={mergeQueryOptions(
- field.value && !query ? [field.value] : [],
+ field.value ? [field.value] : [],
data ?? [],
(obj) => obj.id,
)}
diff --git a/src/components/Notifications/NoticeBoard.tsx b/src/components/Notifications/NoticeBoard.tsx
index 452cd7f568e..4097ae030c4 100644
--- a/src/components/Notifications/NoticeBoard.tsx
+++ b/src/components/Notifications/NoticeBoard.tsx
@@ -45,7 +45,7 @@ export const NoticeBoard = () => {
);
} else {
notices = (
-
{t("no_results_found")}
)}
- {items
- .filter((item) => item)
- .map((item, i) => (
-
- {props.itemRender(item)}
-
- )}
-
+ {props.itemRender(item)}
+
+ )}
+
+
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) => {
-
{({ isAuthorized }) => (
diff --git a/src/components/Patient/PatientDetailsTab/Notes.tsx b/src/components/Patient/PatientDetailsTab/Notes.tsx
index 4fccf7a1119..5c877c2d734 100644
--- a/src/components/Patient/PatientDetailsTab/Notes.tsx
+++ b/src/components/Patient/PatientDetailsTab/Notes.tsx
@@ -12,6 +12,7 @@ import {
} from "@/components/Facility/models";
import AutoExpandingTextInputFormField from "@/components/Form/FormFields/AutoExpandingTextInputFormField";
import { PatientProps } from "@/components/Patient/PatientDetailsTab";
+import { useAddPatientNote } from "@/components/Patient/Utils";
import useAuthUser from "@/hooks/useAuthUser";
import { useMessageListener } from "@/hooks/useMessageListener";
@@ -20,8 +21,6 @@ import { PATIENT_NOTES_THREADS } from "@/common/constants";
import { NonReadOnlyUsers } from "@/Utils/AuthorizeFor";
import * as Notification from "@/Utils/Notifications";
-import routes from "@/Utils/request/api";
-import request from "@/Utils/request/request";
import { classNames, keysOf } from "@/Utils/utils";
const PatientNotes = (props: PatientProps) => {
@@ -39,43 +38,29 @@ const PatientNotes = (props: PatientProps) => {
const [reply_to, setReplyTo] = useState(
undefined,
);
-
+ const { mutate: addNote } = useAddPatientNote({
+ patientId,
+ thread,
+ });
const initialData: PatientNoteStateType = {
notes: [],
- cPage: 1,
- totalPages: 1,
};
const [state, setState] = useState(initialData);
- const onAddNote = async () => {
+ const onAddNote = () => {
if (!/\S+/.test(noteField)) {
Notification.Error({
msg: "Note Should Contain At Least 1 Character",
});
return;
}
-
- try {
- const { res } = await request(routes.addPatientNote, {
- pathParams: { patientId: patientId },
- body: {
- note: noteField,
- thread,
- reply_to: reply_to?.id,
- },
- });
- if (res?.status === 201) {
- setNoteField("");
- setReload(!reload);
- setState({ ...state, cPage: 1 });
- setReplyTo(undefined);
- Notification.Success({ msg: "Note added successfully" });
- }
- } catch (error) {
- Notification.Error({
- msg: "Failed to add note. Please try again.",
- });
- }
+ addNote({
+ note: noteField,
+ reply_to: reply_to?.id,
+ thread,
+ });
+ setReplyTo(undefined);
+ setNoteField("");
};
useMessageListener((data) => {
@@ -104,13 +89,21 @@ const PatientNotes = (props: PatientProps) => {
? "border-primary-500 font-bold text-secondary-800"
: "border-secondary-300 text-secondary-800",
)}
- onClick={() => setThread(PATIENT_NOTES_THREADS[current])}
+ onClick={() => {
+ if (thread !== PATIENT_NOTES_THREADS[current]) {
+ setThread(PATIENT_NOTES_THREADS[current]);
+ setState(initialData);
+ setReplyTo(undefined);
+ setNoteField("");
+ }
+ }}
>
{t(`patient_notes_thread__${current}`)}
))}
{
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: {
- {
+ const queryClient = useQueryClient();
+ const { patientId, thread, consultationId } = options;
+
+ return useMutation({
+ mutationFn: mutate(routes.addPatientNote, {
+ pathParams: { patientId },
+ }),
+ onSuccess: (data) => {
+ queryClient.invalidateQueries({
+ queryKey: ["notes", patientId, thread, consultationId],
+ });
+ return data;
+ },
+ });
+};
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("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/Patient/PatientNotes.tsx b/src/components/Patient/PatientNotes.tsx
index 70dfcd6c426..b1e0c557837 100644
--- a/src/components/Patient/PatientNotes.tsx
+++ b/src/components/Patient/PatientNotes.tsx
@@ -12,6 +12,7 @@ import {
PatientNotesModel,
} from "@/components/Facility/models";
import AutoExpandingTextInputFormField from "@/components/Form/FormFields/AutoExpandingTextInputFormField";
+import { useAddPatientNote } from "@/components/Patient/Utils";
import useAuthUser from "@/hooks/useAuthUser";
import { useMessageListener } from "@/hooks/useMessageListener";
@@ -50,34 +51,28 @@ const PatientNotes = (props: PatientNotesProps) => {
const initialData: PatientNoteStateType = {
notes: [],
- cPage: 1,
- totalPages: 1,
};
const [state, setState] = useState(initialData);
- const onAddNote = async () => {
+ const { mutate: addNote } = useAddPatientNote({
+ patientId,
+ thread,
+ });
+
+ const onAddNote = () => {
if (!/\S+/.test(noteField)) {
Notification.Error({
msg: "Note Should Contain At Least 1 Character",
});
return;
}
-
- const { res } = await request(routes.addPatientNote, {
- pathParams: { patientId: patientId },
- body: {
- note: noteField,
- thread,
- reply_to: reply_to?.id,
- },
+ addNote({
+ note: noteField,
+ reply_to: reply_to?.id,
+ thread,
});
- if (res?.status === 201) {
- Notification.Success({ msg: "Note added successfully" });
- setNoteField("");
- setReload(!reload);
- setState({ ...state, cPage: 1 });
- setReplyTo(undefined);
- }
+ setReplyTo(undefined);
+ setNoteField("");
};
useEffect(() => {
@@ -130,13 +125,21 @@ const PatientNotes = (props: PatientNotesProps) => {
? "border-primary-500 font-bold text-secondary-800"
: "border-secondary-300 text-secondary-800",
)}
- onClick={() => setThread(PATIENT_NOTES_THREADS[current])}
+ onClick={() => {
+ if (thread !== PATIENT_NOTES_THREADS[current]) {
+ setThread(PATIENT_NOTES_THREADS[current]);
+ setState(initialData);
+ setReplyTo(undefined);
+ setNoteField("");
+ }
+ }}
>
{t(`patient_notes_thread__${current}`)}
))}
{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/UserListAndCard.tsx b/src/components/Users/UserListAndCard.tsx
index ee1ac5e9874..d8194853570 100644
--- a/src/components/Users/UserListAndCard.tsx
+++ b/src/components/Users/UserListAndCard.tsx
@@ -134,30 +134,33 @@ export const UserStatusIndicator = ({
className?: string;
addPadding?: boolean;
}) => {
- const cur_online = isUserOnline(user);
+ const authUser = useAuthUser();
+ const isAuthUser = user.id === authUser.id;
+ const isOnline = isUserOnline(user) || isAuthUser;
const { t } = useTranslation();
+
return (
- {cur_online
+ {isOnline
? t("online")
: user.last_login
? relativeTime(user.last_login)
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) => (
+