update src/views/Address/index.js

src/views/Address/index.js

@@ -1,7 +1,13 @@
 import React, { useState, useEffect } from "react";
 import { connect } from "react-redux";
 import { useNavigate, useLocation } from "react-router-dom";
-import { publicApi, userAddress, dialog, user } from "../../redux/actions";
+import {
+  publicApi,
+  userAddress,
+  dialog,
+  user,
+  dashboard,
+} from "../../redux/actions";
 
 import onInput from "../../utils/onInput";
 import location from "../../utils/location";
@@ -33,18 +39,14 @@ export const Address = ({
   isMobile,
   isDark,
   setDialog,
-  profilePage,
   editPage,
-  setProfileFields,
-  profileFields,
-  setProfile,
-  user,
   setHeaderOptions,
   headerOptions,
   getAddress,
   addressInfo,
   updateAddress,
   isDashboard,
+  setDashboardPage,
 }) => {
   const [addressFields, setAddressFields] = useState({});
   const [mapAddress, setMapAddress] = useState(null);
@@ -57,7 +59,7 @@ export const Address = ({
       getProvince();
     }
     if (isMobile) {
-      if (editPage || profilePage) {
+      if (editPage) {
         setHeaderOptions(headerOptions);
       } else {
         setHeaderOptions({
@@ -106,61 +108,10 @@ export const Address = ({
     }
   }, [addressFields]);
 
-  useEffect(() => {
-    if (profileFields?.provinceId) {
-      getCity({
-        provinceId: profileFields?.provinceId,
-      });
-    }
-  }, [profileFields]);
-
   const onChange = (name, value) => {
     setAddressFields({ ...addressFields, [name]: value });
   };
 
-  const submitProfile = () => {
-    if (user.cellphone && user.cellphone.length < 11) {
-      setDialog({
-        text: window.t("شماره موبایل خود را وارد کنید."),
-        type: "alert",
-        accept: () => {},
-        open: true,
-      });
-      return;
-    }
-    const postalCode = profileFields?.postalCode || user.postalCode;
-    if (postalCode && postalCode.length < 10) {
-      setDialog({
-        text: window.t("شماره کد پستی خود را وارد کنید."),
-        type: "alert",
-        accept: () => {},
-        open: true,
-      });
-      return;
-    }
-    const data = {
-      firstName: profileFields?.firstName || user.firstName,
-      lastName: profileFields?.lastName || user.lastName,
-      username: profileFields?.username || user.username,
-      cellphone: user.cellphone,
-      password: profileFields?.password || user.password,
-      postalCode,
-      address: profileFields?.address || user.address,
-      email: profileFields?.email || user.email,
-      phone: profileFields?.phone || user.phone,
-      nationalId: profileFields?.nationalId || user.nationalId,
-      picFileId: profileFields?.picFileId || user.picFileId,
-      gender: profileFields?.gender || user.gender,
-      birthDate: profileFields?.birthDate || user.birthDate,
-      schools: profileFields?.schools || user.schools,
-      gradeIds: profileFields?.gradeIds || user.gradeIds,
-      provinceId: profileFields?.provinceId || user.provinceId,
-      cityId: profileFields?.cityId || user.cityId,
-      docFileIds: profileFields?.docFileIds || user.docFileIds,
-    };
-    setProfile(data);
-  };
-
   const [activeCheckbox, setActiveCheckbox] = useState(true);
 
   const submit = () => {
@@ -300,11 +251,10 @@ export const Address = ({
   return (
     <div
       className={`flex flex-col lg:flex-row-reverse px-4 flex-1 lg:pt-0 pb-20 gap-5 lg:divide-x lg:divide-solid lg:divide-gray-200 ${
-        location?.state?.panel === isMobile ? "mt-2" : "lg:mt-32 lg:px-10"
+        location?.state?.panel === isMobile ? "mt-2" : "lg:pt-10 lg:px-10"
       } `}
       // style={{ minHeight: "calc(100vh - 500px)" }}
     >
-      {!profilePage && (
       <div className="flex flex-col w-full lg:w-1/2">
         <Input
           width="100%"
@@ -336,8 +286,12 @@ export const Address = ({
             <button
               className="bg-transparent mt-4 text-base lg:text-tiny border border-blueC0 text-blueC0 font-bold rounded-md py-3.5 lg:py-4 flex justify-center items-center"
               onClick={() => {
+                if (isDashboard) {
+                  setDashboardPage("addresses");
+                } else {
                   setPhase("deliveryForm");
                   navigation(-1);
+                }
               }}
             >
               {window.t("بازگشت")}
@@ -350,15 +304,8 @@ export const Address = ({
           </div>
         </div>
       </div>
-      )}
 
-      <div
+      <div className={`flex flex-col w-full lg:w-1/2 lg:pl-4`}>
-        className={`flex flex-col w-full lg:w-1/2 lg:pl-4 ${
-          profilePage ? "mx-auto" : ""
-        }`}
-      >
-        {!profilePage && (
-          <>
         <div className="flex item-center gap-x-4">
           {/* my self */}
           <div
@@ -397,10 +344,8 @@ export const Address = ({
             </p>
           </div>
         </div>
-          </>
-        )}
 
-        {profilePage || activeCheckbox === false ? (
+        {activeCheckbox === false ? (
           <>
             <Header
               title={window.t("اطلاعات هویتی")}
@@ -415,16 +360,8 @@ export const Address = ({
                 label={window.t("نام")}
                 regex={(val) => val}
                 name="firstName"
-                onChange={(name, value) =>
+                onChange={(name, value) => onChange(name, value)}
-                  profilePage
+                value={addressFields?.firstName}
-                    ? setProfileFields({ ...profileFields, firstName: value })
-                    : onChange(name, value)
-                }
-                value={
-                  profilePage
-                    ? profileFields.firstName || user.firstName
-                    : addressFields?.firstName
-                }
                 align="text-right"
                 direction="rtl"
               />
@@ -434,16 +371,8 @@ export const Address = ({
                 label={window.t("نام خانوادگی")}
                 regex={(val) => val}
                 name="lastName"
-                onChange={(name, value) =>
+                onChange={(name, value) => onChange(name, value)}
-                  profilePage
+                value={addressFields?.lastName}
-                    ? setProfileFields({ ...profileFields, lastName: value })
-                    : onChange(name, value)
-                }
-                value={
-                  profilePage
-                    ? profileFields.lastName || user.lastName
-                    : addressFields?.lastName
-                }
                 align="text-right"
                 direction="rtl"
               />
@@ -462,11 +391,7 @@ export const Address = ({
                 label={window.t("شماره موبایل")}
                 regex={(val) => onInput.phonenumber(val)}
                 name="cellphone"
-                value={
+                value={addressFields?.cellphone}
-                  profilePage
-                    ? profileFields.cellphone || user.cellphone
-                    : addressFields?.cellphone
-                }
                 onChange={(name, value) => onChange(name, value)}
                 align="text-right"
                 direction="ltr"
@@ -477,16 +402,8 @@ export const Address = ({
                 label={window.t("شماره تلفن")}
                 regex={(val) => onInput.numberOnly(val)}
                 name="phone"
-                value={
+                value={addressFields?.phone}
-                  profilePage
+                onChange={(name, value) => onChange(name, value)}
-                    ? profileFields.phone || user.phone
-                    : addressFields?.phone
-                }
-                onChange={(name, value) =>
-                  profilePage
-                    ? setProfileFields({ ...profileFields, phone: value })
-                    : onChange(name, value)
-                }
                 align="text-right"
                 direction="ltr"
                 maxLength={11}
@@ -507,17 +424,9 @@ export const Address = ({
             selectProvince={"استان"}
             options={provinces.map((e) => ({ value: e.id, name: e.name }))}
             name="provinceId"
-            defaultValue={
+            defaultValue={provinces[0]?.id}
-              profilePage
-                ? profileFields.provinceId || provinces[0]?.id
-                : provinces[0]?.id
-            }
             onChange={(name, value) =>
-              value === window.t("استان")
+              value === window.t("استان") ? {} : onChange(name, value)
-                ? {}
-                : profilePage
-                ? setProfileFields({ ...profileFields, provinceId: value })
-                : onChange(name, value)
             }
             width={isMobile ? "w-full" : "w-1/2"}
             backgroundColor={
@@ -530,17 +439,9 @@ export const Address = ({
               selectProvince={"شهر"}
               options={cities.map((e) => ({ value: e.id, name: e.name }))}
               name="cityId"
-              defaultValue={
+              defaultValue={cities[0]?.id}
-                profilePage
-                  ? profileFields.cityId || cities[0]?.id
-                  : cities[0]?.id
-              }
               onChange={(name, value) =>
-                value === window.t("شهر")
+                value === window.t("شهر") ? {} : onChange(name, value)
-                  ? {}
-                  : profilePage
-                  ? setProfileFields({ ...profileFields, cityId: value })
-                  : onChange(name, value)
               }
               width={isMobile ? "w-full" : "w-1/2"}
               backgroundColor={
@@ -567,16 +468,8 @@ export const Address = ({
             label={window.t("کد پستی")}
             regex={(val) => onInput.numberOnly(val)}
             name="postalCode"
-            value={
+            value={addressFields?.postalCode}
-              profilePage
+            onChange={(name, value) => onChange(name, value)}
-                ? profileFields.postalCode || user.postalCode
-                : addressFields?.postalCode
-            }
-            onChange={(name, value) =>
-              profilePage
-                ? setProfileFields({ ...profileFields, postalCode: value })
-                : onChange(name, value)
-            }
             align="text-right"
             direction="ltr"
             maxLength={10}
@@ -584,31 +477,26 @@ export const Address = ({
           <div className="lg:w-1/2"></div>
         </div>
 
-        <div
+        <div className={`flex lg:hidden flex-col items-end w-full mt-3`}>
-          className={`flex ${
-            profilePage ? "mt-10" : "lg:hidden"
-          } flex-col items-end w-full mt-3`}
-        >
           <Button
             loading={loading}
-            title={
+            title={window.t("ذخیره اطلاعات و بازگشت به صفحه قبل")}
-              !profilePage
-                ? `${window.t("ذخیره اطلاعات و بازگشت به صفحه قبل")}`
-                : `${window.t("ارسال")}`
-            }
             backgroundColor="bg-blueC0"
             border={{ color: "#196EC055", width: "0px" }}
-            width={profilePage ? "30%" : "100%"}
+            width={"100%"}
             color="text-white"
-            onClick={() => (profilePage ? submitProfile() : submit())}
+            onClick={() => submit()}
           />
-          {!isMobile && (
           <button
             style={{ width: "30%" }}
-              className="flex justify-center items-center mt-4 py-3 text-blueC0 text-base lg:text-tiny border-2 border-blueC0 cursor-pointer rounded-md"
+            className="hidden lg:flex justify-center items-center mt-4 py-3 text-blueC0 text-base lg:text-tiny border-2 border-blueC0 cursor-pointer rounded-md"
             onClick={() => {
+              if (isDashboard) {
+                setDashboardPage("addresses");
+              } else {
                 setPhase("deliveryForm");
                 navigation(-1);
+              }
             }}
           >
             {window.t("بازگشت")}
@@ -618,7 +506,6 @@ export const Address = ({
               className="w-3.5 transform rotate-90"
             />
           </button>
-          )}
         </div>
       </div>
     </div>
@@ -635,7 +522,6 @@ const mapStateToProps = (state) => ({
   cityLoading: state.publicApi.loading,
   isMobile: state.config.device === "mobile",
   isDark: state.publicApi.isDark,
-  profileFields: state.user.profileFields,
   addressInfo: state.userAddress.info,
 });
 
@@ -646,9 +532,8 @@ const mapDispatchToProps = {
   updateAddress: userAddress.update,
   getAddress: userAddress.info,
   setDialog: dialog.set,
-  setProfileFields: user.setProfileFields,
-  setProfile: user.setProfile,
   setHeaderOptions: publicApi.setHeaderOptions,
+  setDashboardPage: dashboard.setPage,
 };
 
 export default connect(mapStateToProps, mapDispatchToProps)(Address);