refactor: implement login state management and navigation flow in appointment components

app/component/date/dateTime/SendAppo.js

@@ -11,9 +11,15 @@ function SendAppo({ hour, setStep }) {
 
   const sendReq = () => {
     const isLogged = Cookies.get("access_token");
+
     if (isLogged) {
-      setStep((step) => step + 1);
+      // اگر لاگین کرده، به مرحله 3 (Detail) می‌رود
+      setStep(3);
+    } else {
+      // اگر لاگین نکرده، به مرحله 1 (Login) می‌رود
+      setStep(1);
     }
+
     // setLoading(true);
     // request
     //   .postAppointment({

components/appointment/Container.js

@@ -7,6 +7,9 @@ import Paying from "@/components/appointment/paying";
 import Detail from "@/components/appointment/detail";
 import FailedPay from "@/components/appointment/failedPay";
 import SuccessPay from "@/components/appointment/successPay";
+import LogInPage from "@/components/register/LogInPage";
+import VerificationPage from "@/components/register/verificationPage";
+import LayoutRegister from "@/components/register/LayoutRegister";
 
 function Container({
   step,
@@ -19,11 +22,33 @@ function Container({
   isForAnother,
   setIsForAnother,
   disabledDates,
+  // Login states
+  num,
+  setNum,
+  uuid,
+  setUuid,
+  isSendMsg,
+  setIsSendMsg,
 }) {
   const elements = [
     <Date doctor={doctor} setStep={setStep} disabledDates={disabledDates} />,
-    // <LogInPage setIsSendMsg={false} setStep={setStep} />,
+    <LogInPage
-    // <VerificationPage setIsSendMsg={false} link={false} setStep={setStep} />,
+      num={num}
+      setNum={setNum}
+      setUuid={setUuid}
+      setStep={setStep}
+      setIsSendMsg={setIsSendMsg}
+      matchedCity={matchedCity}
+    />,
+    <VerificationPage
+      num={num}
+      uuid={uuid}
+      setStep={setStep}
+      setUuid={setUuid}
+      isSendMsg={isSendMsg}
+      setIsSendMsg={setIsSendMsg}
+      link={false}
+    />,
     <Detail
       data={data}
       setStep={setStep}
@@ -39,27 +64,29 @@ function Container({
 
   return (
     <>
-      {/* {step === 1 || step === 2 ? (
+      {step === 1 || step === 2 ? (
-        <RegisterPage>{elements[step]}</RegisterPage>
+        <LayoutRegister matchedCity={matchedCity}>
-      ) : ( */}
-      <Layout
-        title="رزرو"
-        name="booking"
-        disableFooter={step > 2}
-        matchedCity={matchedCity}
-        paddingBottom="pb-[80px]"
-      >
-        <Content
-          disableSide={step === 5 || step === 6}
-          isFirst={step === 0}
-          setStep={setStep}
-          doctor={doctor}
-          step={step}
-        >
           {elements[step]}
-        </Content>
+        </LayoutRegister>
-      </Layout>
+      ) : (
-      {/* )} */}
+        <Layout
+          title="رزرو"
+          name="booking"
+          disableFooter={step > 4}
+          matchedCity={matchedCity}
+          paddingBottom="pb-[80px]"
+        >
+          <Content
+            disableSide={step === 5 || step === 6}
+            isFirst={step === 0}
+            setStep={setStep}
+            doctor={doctor}
+            step={step}
+          >
+            {elements[step]}
+          </Content>
+        </Layout>
+      )}
     </>
   );
 }

components/appointment/index.js

@@ -19,6 +19,11 @@ function AppointmentPage({ doctor, disabledDates, matchedCity }) {
   const [prevData, setPrevData] = useState(defaultData);
   const [data, setData] = useState(defaultData);
 
+  // Login states
+  const [num, setNum] = useState("");
+  const [uuid, setUuid] = useState("");
+  const [isSendMsg, setIsSendMsg] = useState(false);
+
   useEffect(() => {
     const userInfo = Cookies.get("userInfo");
     const parsedData = userInfo && JSON.parse(userInfo);
@@ -62,7 +67,7 @@ function AppointmentPage({ doctor, disabledDates, matchedCity }) {
           //
         });
     }
-  }, []);
+  }, [step]); // وقتی step تغییر کرد، دوباره چک می‌کنه
 
   return (
     <Container
@@ -76,6 +81,12 @@ function AppointmentPage({ doctor, disabledDates, matchedCity }) {
       isForAnother={isForAnother}
       setIsForAnother={setIsForAnother}
       disabledDates={disabledDates}
+      num={num}
+      setNum={setNum}
+      uuid={uuid}
+      setUuid={setUuid}
+      isSendMsg={isSendMsg}
+      setIsSendMsg={setIsSendMsg}
     />
   );
 }

components/register/LogInPage.js

@@ -5,7 +5,7 @@ import { InputAdornment, Button } from "@mui/material";
 import Link from "next/link";
 import { useState } from "react";
 
-function LogInPage({ setIsSendMsg, num, setNum, setUuid, matchedCity }) {
+function LogInPage({ setIsSendMsg, num, setNum, setUuid, matchedCity, setStep }) {
   const [error, setError] = useState({ valid: true, text: "" });
   const [loading, setLoading] = useState(false);
 
@@ -23,6 +23,8 @@ function LogInPage({ setIsSendMsg, num, setNum, setUuid, matchedCity }) {
         if (response.uuid) {
           setIsSendMsg(true);
           setUuid(response.uuid);
+          // به مرحله بعد (VerificationPage) می‌رود
+          setStep && setStep(2);
         }
       })
       .catch(() => {

components/register/verificationPage/SendReq.js

@@ -82,7 +82,13 @@ function SendReq({
         setLoading(false);
         if (res && res.uuid) {
           Cookies.set("userInfo", JSON.stringify(res), cookieOptions);
-          window.location.pathname = "/";
+
+          // اگر در صفحه appointment هستیم، به مرحله 3 (Detail) می‌رویم
+          if (setStep) {
+            setStep(3);
+          } else {
+            window.location.pathname = "/";
+          }
         }
       })
       .catch(() => {
@@ -98,7 +104,6 @@ function SendReq({
       variant="contained"
       onClick={() => {
         setIsSendMsg && setIsSendMsg(true);
-        setStep && setStep((prev) => prev + 1);
         if (code.join("").length !== 5) {
           setIsError(true);
         } else {