change date-picker & add page login-verify & account & new user & payment

app/component/date/datePicker/index.js

@@ -1,33 +1,44 @@
-'use client'
+'use client';
 
 import { useState } from 'react';
-import { DatePicker as DatePickerJalali, RangePicker } from "jalaali-react-date-picker";
+import { DatePicker as DatePickerJalali } from "jalaali-react-date-picker";
 
-function DatePicker({ type, date, updateDate, text, from }) {
+function DatePicker({ date, updateDate }) {
+    const [startDate, setStartDate] = useState(null);
+    const [endDate, setEndDate] = useState(null);
 
-    const [anchorEl, setAnchorEl] = useState(null);
-
-    const handleClick = (event) => {
-        setAnchorEl(event.currentTarget);
+    const handleStartDateChange = (date) => {
+        if (date) {
+            setStartDate(date);
+            setEndDate(null); // Clear end date if start date is selected
+            // updateDate(date); // Notify parent about the selected date
+        }
     };
 
-    const handleClose = () => setAnchorEl(null);
-
-    const open = true;
-    const id = open ? 'simple-popover' : undefined;
+    const handleEndDateChange = (date) => {
+        if (date) {
+            setEndDate(date);
+            setStartDate(null); // Clear start date if end date is selected
+            // updateDate(date); // Notify parent about the selected date
+        }
+    };
 
     return (
-        <div>
-            <RangePicker
-                onChange={(e) => {
-                    // if (e._d) {
-                    //     updateDate(e._d, type)
-                    // }
-                    // handleClose()
-                }}
+        <div className='flex items-start gap-[40px]'>
+            <DatePickerJalali
+                value={startDate}
+                className='w-1/2'
+                timePicker={false}
+                onChange={handleStartDateChange}
+            />
+            <DatePickerJalali
+                value={endDate}
+                className='w-1/2'
+                timePicker={false}
+                onChange={handleEndDateChange}
             />
         </div>
-    )
+    );
 }
 
-export default DatePicker
+export default DatePicker;

app/component/date/dateTime/index.js

@@ -5,6 +5,7 @@ import Tabs from "../../Tabs";
 import Hours from "./Hours";
 import { Button } from "@mui/material";
 import ArrowLeftB from "@/components/icons/ArrowLeftB";
+import Link from "next/link";
 
 const listTab = ['صبح', 'بعد از ظهر'];
 const nameHours = ['hours_morning', 'hours_afternoon']
@@ -32,13 +33,20 @@ function DateTime({ doctor }) {
         nameHours={nameHours}
       />
       <div className="w-full flex justify-end">
-        <Button
-          className="!gap-[4px] !px-[12px] !py-[8px] !min-w-[157px]"
-          variant="contained"
+        <Link
+          href='/login-verify'
         >
-          <p className="text-[#EFEFEF] text-[16px] font-medium">تایید نوبت</p>
-          <ArrowLeftB />
-        </Button>
+          <Button
+            className="!gap-[4px] !px-[12px] !py-[8px] !min-w-[157px]"
+            onClick={() =>
+              localStorage.setItem('doctor-id', doctor?.id)
+            }
+            variant="contained"
+          >
+            <p className="text-[#EFEFEF] text-[16px] font-medium">تایید نوبت</p>
+            <ArrowLeftB />
+          </Button>
+        </Link>
       </div>
     </div>
   )

app/component/element/AutoCompleteSelect.js

@@ -7,7 +7,7 @@ function AutoCompleteSelect({ list, updateData, name, label }) {
         <Autocomplete
             disablePortal
             options={list}
-            className="!w-full !rounded-lg md:!w-[344px]"
+            className="!w-full !rounded-lg"
             onChange={(event) =>
                 updateData &&
                 updateData(event, name)