From 10eafd27f95ca4a8414c005be6065a6dea48d2bd Mon Sep 17 00:00:00 2001 From: Jacob John Jeevan Date: Fri, 31 Jan 2025 12:09:58 +0530 Subject: [PATCH 1/3] rm alt_phone, whatsapp completely; rm email for updates --- src/components/Users/UserForm.tsx | 76 ++++++------------------------- src/types/user/user.ts | 7 +-- 2 files changed, 17 insertions(+), 66 deletions(-) diff --git a/src/components/Users/UserForm.tsx b/src/components/Users/UserForm.tsx index d5656c89694..91222bea76d 100644 --- a/src/components/Users/UserForm.tsx +++ b/src/components/Users/UserForm.tsx @@ -9,7 +9,6 @@ import * as z from "zod"; import CareIcon from "@/CAREUI/icons/CareIcon"; import { Button } from "@/components/ui/button"; -import { Checkbox } from "@/components/ui/checkbox"; import { Form, FormControl, @@ -92,8 +91,6 @@ export default function UserForm({ last_name: z.string().min(1, t("field_required")), email: z.string().email(t("invalid_email_address")), phone_number: validators.phoneNumber.required, - alt_phone_number: validators.phoneNumber.optional, - phone_number_is_whatsapp: z.boolean().default(true), gender: z.enum(GENDERS), /* TODO: Userbase doesn't currently support these, neither does BE but we will probably need these */ @@ -130,8 +127,6 @@ export default function UserForm({ last_name: "", email: "", phone_number: "", - alt_phone_number: "", - phone_number_is_whatsapp: true, }, }); @@ -151,7 +146,6 @@ export default function UserForm({ email: userData.email, phone_number: userData.phone_number || "", gender: userData.gender, - phone_number_is_whatsapp: true, }; form.reset(formData); } @@ -163,16 +157,12 @@ export default function UserForm({ //const userType = form.watch("user_type"); const usernameInput = form.watch("username"); const phoneNumber = form.watch("phone_number"); - const isWhatsApp = form.watch("phone_number_is_whatsapp"); useEffect(() => { - if (isWhatsApp) { - form.setValue("alt_phone_number", phoneNumber); - } if (usernameInput && usernameInput.length > 0 && !isEditMode) { form.trigger("username"); } - }, [phoneNumber, isWhatsApp, form, usernameInput, isEditMode]); + }, [phoneNumber, form, usernameInput, isEditMode]); const { isLoading: isUsernameChecking, isError: isUsernameTaken } = useQuery({ queryKey: ["checkUsername", usernameInput], @@ -496,36 +486,18 @@ export default function UserForm({ )} - ( - - {t("email")} - - - - - - )} - /> - -
+ {!isEditMode && ( ( - {t("phone_number")} + {t("email")} - @@ -533,49 +505,27 @@ export default function UserForm({ )} /> + )} +
( - {t("alternate_phone_number")} + {t("phone_number")} )} /> -
- ( - - - - -
- - {t("whatsapp_number_same_as_phone_number")} - -
-
- )} - /> - -
; +export type UpdateUserModel = Omit< + CreateUserModel, + "username" | "password" | "email" +>; From 605e49de3cc6fe9d8e0e62eb03b5d994da3dd4f2 Mon Sep 17 00:00:00 2001 From: Mohammed Nihal <57055998+nihal467@users.noreply.github.com> Date: Fri, 31 Jan 2025 12:32:06 +0530 Subject: [PATCH 2/3] removed the alt phone number cypress error message check --- cypress/pageObject/Users/UserCreation.ts | 4 ---- 1 file changed, 4 deletions(-) diff --git a/cypress/pageObject/Users/UserCreation.ts b/cypress/pageObject/Users/UserCreation.ts index e5cc81e0332..fb2a2a180f0 100644 --- a/cypress/pageObject/Users/UserCreation.ts +++ b/cypress/pageObject/Users/UserCreation.ts @@ -74,10 +74,6 @@ export class UserCreation { label: "Phone Number", message: "Invalid input", }, - { - label: "Alternate Phone Number", - message: "Invalid input", - }, { label: "State", message: "Required" }, ]); return this; From 01eb7cb500dd77856b07550357c7500d26427191 Mon Sep 17 00:00:00 2001 From: Jacob John Jeevan Date: Fri, 31 Jan 2025 13:16:30 +0530 Subject: [PATCH 3/3] switch to tanstack --- src/components/Common/UserColumns.tsx | 1 - src/components/Users/UserAvatar.tsx | 14 +++---- src/components/Users/UserHome.tsx | 55 ++++++++++++--------------- src/components/Users/UserSummary.tsx | 42 ++++++++++---------- 4 files changed, 51 insertions(+), 61 deletions(-) diff --git a/src/components/Common/UserColumns.tsx b/src/components/Common/UserColumns.tsx index 566c49997a2..76ec2bae148 100644 --- a/src/components/Common/UserColumns.tsx +++ b/src/components/Common/UserColumns.tsx @@ -3,7 +3,6 @@ import { UserBase } from "@/types/user/user"; export type userChildProps = { userData: UserBase; username: string; - refetchUserData?: () => void; }; export default function UserColumns({ diff --git a/src/components/Users/UserAvatar.tsx b/src/components/Users/UserAvatar.tsx index 93913c644a1..74762953e3e 100644 --- a/src/components/Users/UserAvatar.tsx +++ b/src/components/Users/UserAvatar.tsx @@ -1,5 +1,5 @@ import careConfig from "@careConfig"; -import { useQueryClient } from "@tanstack/react-query"; +import { useQuery, useQueryClient } from "@tanstack/react-query"; import { useState } from "react"; import { useTranslation } from "react-i18next"; import { toast } from "sonner"; @@ -15,9 +15,9 @@ import useAuthUser from "@/hooks/useAuthUser"; import { showAvatarEdit } from "@/Utils/permissions"; import routes from "@/Utils/request/api"; +import query from "@/Utils/request/query"; 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 { formatDisplayName, sleep } from "@/Utils/utils"; @@ -27,14 +27,14 @@ export default function UserAvatar({ username }: { username: string }) { const authUser = useAuthUser(); const queryClient = useQueryClient(); - const { data: userData, loading: isLoading } = useTanStackQueryInstead( - routes.getUserDetails, - { + const { data: userData, isLoading } = useQuery({ + queryKey: ["getUserDetails", username], + queryFn: query(routes.getUserDetails, { pathParams: { username: username, }, - }, - ); + }), + }); if (isLoading || !userData) { return ; diff --git a/src/components/Users/UserHome.tsx b/src/components/Users/UserHome.tsx index 34345657d30..c53aa40200a 100644 --- a/src/components/Users/UserHome.tsx +++ b/src/components/Users/UserHome.tsx @@ -1,7 +1,8 @@ -import { Link, navigate } from "raviger"; -import { useState } from "react"; +import { useQuery } from "@tanstack/react-query"; +import { Link } from "raviger"; import { useTranslation } from "react-i18next"; -import { toast } from "sonner"; + +import { cn } from "@/lib/utils"; import Loading from "@/components/Common/Loading"; import Page from "@/components/Common/Page"; @@ -11,12 +12,12 @@ import UserAvailabilityTab from "@/components/Users/UserAvailabilityTab"; import UserBanner from "@/components/Users/UserBanner"; import UserSummaryTab from "@/components/Users/UserSummary"; +import useAppHistory from "@/hooks/useAppHistory"; import useAuthUser from "@/hooks/useAuthUser"; import routes from "@/Utils/request/api"; -import useTanStackQueryInstead from "@/Utils/request/useQuery"; -import { classNames, formatName, keysOf } from "@/Utils/utils"; -import { UserBase } from "@/types/user/user"; +import query from "@/Utils/request/query"; +import { formatName, keysOf } from "@/Utils/utils"; export interface UserHomeProps { username?: string; @@ -31,35 +32,32 @@ export interface TabChildProp { export default function UserHome(props: UserHomeProps) { const { tab } = props; let { username } = props; - const [userData, setUserData] = useState(); const { t } = useTranslation(); const authUser = useAuthUser(); + const { goBack } = useAppHistory(); if (!username) { username = authUser.username; } const loggedInUser = username === authUser.username; - const { loading, refetch: refetchUserDetails } = useTanStackQueryInstead( - routes.getUserDetails, - { + const { + data: userData, + isLoading, + isError, + } = useQuery({ + queryKey: ["getUserDetails", username], + queryFn: query(routes.getUserDetails, { pathParams: { username: username, }, - onResponse: ({ res, data, error }) => { - if (res?.status === 200 && data) { - setUserData(data); - } else if (res?.status === 400) { - navigate("/users"); - } else if (error) { - toast.error( - t("error_fetching_user_details") + (error?.message || ""), - ); - } - }, - }, - ); + }), + }); + + if (isError) { + goBack("/"); + } - if (loading || !userData) { + if (isLoading || !userData) { return ; } @@ -124,7 +122,7 @@ export default function UserHome(props: UserHomeProps) { return (
- + } diff --git a/src/components/Users/UserSummary.tsx b/src/components/Users/UserSummary.tsx index ddcc79a1eb1..6a3a5cb83a8 100644 --- a/src/components/Users/UserSummary.tsx +++ b/src/components/Users/UserSummary.tsx @@ -1,3 +1,4 @@ +import { useMutation } from "@tanstack/react-query"; import { navigate } from "raviger"; import { useState } from "react"; import { useTranslation } from "react-i18next"; @@ -31,42 +32,39 @@ import request from "@/Utils/request/request"; import EditUserSheet from "@/pages/Organization/components/EditUserSheet"; import { UserBase } from "@/types/user/user"; -export default function UserSummaryTab({ - userData, - refetchUserData, -}: { - userData?: UserBase; - refetchUserData?: () => void; -}) { +export default function UserSummaryTab({ userData }: { userData?: UserBase }) { const { t } = useTranslation(); const [showDeleteDialog, setshowDeleteDialog] = useState(false); - const [isDeleting, setIsDeleting] = useState(false); const authUser = useAuthUser(); const [showEditUserSheet, setShowEditUserSheet] = useState(false); + + const { mutate: deleteUser, isPending: isDeleting } = useMutation({ + mutationFn: async () => { + return await request(routes.deleteUser, { + pathParams: { username: userData?.username || "" }, + }); + }, + onSuccess: () => { + toast.success(t("user_deleted_successfully")); + setshowDeleteDialog(false); + navigate("/users"); + }, + onError: () => { + setshowDeleteDialog(false); + toast.error(t("user_delete_error")); + }, + }); if (!userData) { return <>; } const handleSubmit = async () => { - setIsDeleting(true); - const { res, error } = await request(routes.deleteUser, { - pathParams: { username: userData.username }, - }); - setIsDeleting(false); - if (res?.status === 204) { - toast.success(t("user_deleted_successfully")); - setshowDeleteDialog(!showDeleteDialog); - navigate("/users"); - } else { - toast.error(t("user_delete_error") + ": " + (error || "")); - setshowDeleteDialog(!showDeleteDialog); - } + deleteUser(); }; const userColumnsData = { userData, username: userData.username, - refetchUserData, }; const deletePermitted = showUserDelete(authUser, userData); const passwordResetPermitted = showUserPasswordReset(authUser, userData);