feat: edit user and add admin permission

src/Pages/Users.tsx

@@ -12,6 +12,7 @@ import { DeleteButtonForPopOver } from "../components/PopOverButtons/PopOverButt
 import { getFaPermissions } from "../utils/getFaPermissions";
 import { getFaProvince } from "../utils/getFaProvince";
 import { getFaCityName } from "../utils/getFaCityName";
+import { Tooltip } from "../components/Tooltip/Tooltip";
 
 const Users: React.FC = () => {
   const { profile } = useUserProfileStore();
@@ -38,19 +39,32 @@ const Users: React.FC = () => {
           )) || "-",
           getFaProvince(item?.province || ""),
           getFaCityName(item?.city || ""),
-          item?.mobile === profile?.mobile ? (
-            <Typography variant="body2" className="text-gray-400">
-              -
-            </Typography>
-          ) : (
-            <Popover key={i}>
-              <DeleteButtonForPopOver
+
+          <Popover key={i}>
+            <Tooltip title="ویرایش" position="right">
+              <Button
+                variant="edit"
                 access="add"
-                api={`users/${item?._id || item?.Id}`}
-                getData={refetch}
+                onClick={() => {
+                  openDrawer({
+                    title: "ویرایش کاربر",
+                    content: (
+                      <SubmitNewUser
+                        province={profile?.province || ""}
+                        onSuccess={refetch}
+                        item={item}
+                      />
+                    ),
+                  });
+                }}
               />
-            </Popover>
-          ),
+            </Tooltip>
+            <DeleteButtonForPopOver
+              access="add"
+              api={`users/${item?._id || item?.Id}`}
+              getData={refetch}
+            />
+          </Popover>,
         ];
       });
       setTableData(d);

src/partials/auth/Login.tsx

@@ -1,4 +1,4 @@
-import React, { useState, useEffect } from "react";
+import React, { useState } from "react";
 import { motion, Variants } from "framer-motion";
 import { useNavigate } from "@tanstack/react-router";
 import { useApiMutation } from "../../utils/useApiRequest";
@@ -52,12 +52,6 @@ const Login: React.FC = () => {
     disableBackdrop: false,
   });
 
-  useEffect(() => {
-    if (phoneNumber && phoneNumber.length >= 10) {
-      handleGetCaptcha();
-    }
-  }, [phoneNumber]);
-
   const handleGetCaptcha = async () => {
     try {
       const data = await mutationCaptcha.mutateAsync({

src/partials/users/SubmitNewUser.tsx

@@ -17,25 +17,42 @@ import {
   zValidateAutoComplete,
 } from "../../data/getFormTypeErrors";
 
+interface UserItem {
+  _id?: string;
+  Id?: string;
+  mobile?: string;
+  fullname?: string;
+  permissions?: string[];
+  province?: string;
+  city?: string;
+}
+
 interface SubmitNewUserProps {
   province: string;
   onSuccess?: () => void;
+  item?: UserItem | null;
 }
 
-const schema = z.object({
-  mobile: zValidateMobile("موبایل"),
-  password: zValidateString("کلمه عبور"),
-  fullname: zValidateString("نام کامل"),
-  permissions: zValidateAutoComplete("دسترسی‌ها"),
-  city: zValidateAutoComplete("شهر"),
-});
+const getSchema = (isEdit: boolean) =>
+  z.object({
+    mobile: zValidateMobile("موبایل"),
+    password: isEdit ? z.string().optional() : zValidateString("کلمه عبور"),
+    fullname: zValidateString("نام کامل"),
+    permissions: zValidateAutoComplete("دسترسی‌ها"),
+    city: zValidateAutoComplete("شهر"),
+  });
 
-type FormValues = z.infer<typeof schema>;
+type FormValues = z.infer<ReturnType<typeof getSchema>>;
 
-export const SubmitNewUser: React.FC<SubmitNewUserProps> = ({ onSuccess }) => {
+export const SubmitNewUser: React.FC<SubmitNewUserProps> = ({
+  onSuccess,
+  item,
+}) => {
   const { profile } = useUserProfileStore();
   const showToast = useToast();
   const { closeDrawer } = useDrawerStore();
+  const isEdit = !!item;
+  const schema = useMemo(() => getSchema(isEdit), [isEdit]);
 
   const {
     control,
@@ -44,20 +61,33 @@ export const SubmitNewUser: React.FC<SubmitNewUserProps> = ({ onSuccess }) => {
     formState: { errors, isSubmitting },
   } = useForm<FormValues>({
     resolver: zodResolver(schema),
-    defaultValues: {
-      mobile: "",
-      password: "",
-      fullname: "",
-      permissions: [],
-      city: [],
-    },
+    defaultValues: item
+      ? {
+          mobile: item.mobile ?? "",
+          password: "",
+          fullname: item.fullname ?? "",
+          permissions: Array.isArray(item.permissions) ? item.permissions : [],
+          city: item.city ? [item.city] : [],
+        }
+      : {
+          mobile: "",
+          password: "",
+          fullname: "",
+          permissions: [],
+          city: [],
+        },
   });
 
-  const submitUserMutation = useApiMutation({
+  const createUserMutation = useApiMutation({
     api: "user",
     method: "post",
   });
 
+  const updateUserMutation = useApiMutation({
+    api: `user/${item?._id ?? item?.Id ?? ""}`,
+    method: "put",
+  });
+
   const cityOptions = useMemo(() => {
     return getCitiesOfProvinceInfo(profile?.province || "").map((item) => ({
       key: item.en,
@@ -65,18 +95,23 @@ export const SubmitNewUser: React.FC<SubmitNewUserProps> = ({ onSuccess }) => {
     }));
   }, [profile?.province]);
 
+  const hasAdminPermission = profile?.permissions?.includes("admin");
+
   const permissionOptions = useMemo(() => {
-    return [
+    const options = [
       { key: "add", value: "ثبت کاربر" },
       { key: "submit", value: "ثبت بازرسی" },
     ];
-  }, []);
+    if (hasAdminPermission) {
+      options.push({ key: "admin", value: "ادمین" });
+    }
+    return options;
+  }, [hasAdminPermission]);
 
   const onSubmit = async (data: FormValues) => {
     try {
-      const payload = {
+      const basePayload = {
         mobile: data.mobile,
-        password: data.password,
         fullname: data.fullname,
         pic: "",
         permissions: data.permissions as string[],
@@ -87,15 +122,34 @@ export const SubmitNewUser: React.FC<SubmitNewUserProps> = ({ onSuccess }) => {
             : "",
       };
 
-      await submitUserMutation.mutateAsync(payload);
-      showToast("کاربر با موفقیت ثبت شد", "success");
+      if (isEdit) {
+        const payload =
+          data.password && String(data.password).trim() !== ""
+            ? { ...basePayload, password: data.password }
+            : basePayload;
+        await updateUserMutation.mutateAsync(payload);
+        showToast("کاربر با موفقیت ویرایش شد", "success");
+      } else {
+        if (!data.password || String(data.password).trim() === "") {
+          showToast("کلمه عبور را وارد کنید", "error");
+          return;
+        }
+        const payload = { ...basePayload, password: data.password };
+        await createUserMutation.mutateAsync(payload);
+        showToast("کاربر با موفقیت ثبت شد", "success");
+      }
       closeDrawer();
       if (onSuccess) {
         onSuccess();
       }
     } catch (error) {
       console.error(error);
-      showToast("مشکلی پیش آمده است، ممکن است کاربر تکراری باشد!", "error");
+      showToast(
+        isEdit
+          ? "مشکلی پیش آمده است!"
+          : "مشکلی پیش آمده است، ممکن است کاربر تکراری باشد!",
+        "error",
+      );
     }
   };
 
@@ -198,9 +252,13 @@ export const SubmitNewUser: React.FC<SubmitNewUserProps> = ({ onSuccess }) => {
           type="submit"
           variant="submit"
           fullWidth
-          disabled={isSubmitting || submitUserMutation.isPending}
+          disabled={
+            isSubmitting ||
+            createUserMutation.isPending ||
+            updateUserMutation.isPending
+          }
         >
-          ثبت کاربر
+          {isEdit ? "ذخیره تغییرات" : "ثبت کاربر"}
         </Button>
       </Grid>
     </form>

src/utils/axios.ts

@@ -33,7 +33,7 @@ api.interceptors.request.use(
 
     return config;
   },
-  (error) => Promise.reject(error)
+  (error) => Promise.reject(error),
 );
 
 api.interceptors.response.use(
@@ -50,12 +50,13 @@ api.interceptors.response.use(
           rtl: true,
         });
         if (typeof logOut === "function") {
+          window.location.href = "/";
           logOut();
         }
       }
     }
     return Promise.reject(error);
-  }
+  },
 );
 
 export default api;

src/utils/getFaPermissions.ts

@@ -1,6 +1,9 @@
 export function getFaPermissions(permission: string) {
   let faPermission = "";
   switch (permission) {
+    case "admin":
+      faPermission = "ادمین";
+      break;
     case "users":
       faPermission = "کاربران";
       break;
@@ -28,9 +31,7 @@ export function getFaPermissions(permission: string) {
     case "submit":
       faPermission = "ثبت بازرسی";
       break;
-    case "admin":
-      faPermission = "مدیر";
-      break;
+
     default:
       faPermission = permission;
       break;