fix filter gender, req and set new data when delete all filters, show date time with timestamp in doctors list, fix send data in home page list specialty, change data of params for request to doctors in doctors page

components/doctors/head/FilterLocate.js

@@ -0,0 +1,34 @@
+import LocationD from "../../icons/LocationD";
+import { Button } from "@mui/material";
+import ModalSearchCity from "@/app/component/modalSearchCity";
+import { useState } from "react";
+
+function FilterLocate({ filter, sendReq, setFilter, setDataInURL }) {
+  const [open, setOpen] = useState(false);
+
+  return (
+    <ModalSearchCity
+      open={open}
+      filter={filter}
+      sendReq={sendReq}
+      setOpen={setOpen}
+      setFilter={setFilter}
+      setDataInURL={setDataInURL}
+    >
+      <Button
+        className="!flex !ml-auto !w-fit !px-3 !py-1 !items-center !justify-start !gap-2 !cursor-pointer"
+        onClick={() => setOpen(true)}
+      >
+        <LocationD />
+        <h1 className="text-[#525252] text-[16px] font-semibold">
+          {" "}
+          {filter?.state?.name || "استان"}
+          {" / "}
+          {filter?.city?.name || "شهر"}
+        </h1>
+      </Button>
+    </ModalSearchCity>
+  );
+}
+
+export default FilterLocate;

components/doctors/head/index.js

@@ -2,38 +2,26 @@ import { useState } from "react";
 
 import SearchBar from "../search";
 import SortList from "../sortlist";
-import { Button } from "@mui/material";
-import { useParams, useRouter, useSearchParams } from "next/navigation";
-import LocationD from "../../icons/LocationD";
+import { useRouter, useSearchParams } from "next/navigation";
 import specialties from "@/data/specialties.json";
-import ModalSearchCity from "@/app/component/modalSearchCity";
 
 // Data
 import states from "@/data/state.json";
 import cities from "@/data/city.json";
 import { QueryForDoctorsFilter, QueryForDoctorsReq } from "@/helper";
 import { request } from "@/services/response";
+import FilterLocate from "./FilterLocate";
 
 function Head({ matchedCity, matchedState, setDoctors }) {
-  const params = useParams();
   const searchParams = useSearchParams();
   const router = useRouter();
   const fieldName = searchParams.get("specialty");
-  const [open, setOpen] = useState(false);
 
   const findItem = (key, name) =>
     specialties.find((item) => item[key] === name);
   const isParent =
     findItem("name", fieldName) && findItem("name", fieldName).parent;
 
-  const defaultData = {
-    category: isParent ? findItem("id", isParent) : findItem("name", fieldName),
-    specialties: isParent && findItem("name", fieldName),
-    turn: params && params.hasOwnProperty("turn") ? JSON.parse(params.turn) : 1,
-    gender: params.gender || "هر دو",
-    degree: params.degree || "همه موارد",
-  };
-
   const selectedState = searchParams.get("state") || matchedState?.name;
   const selectedCity =
     searchParams.get("city") ||
@@ -51,7 +39,6 @@ function Head({ matchedCity, matchedState, setDoctors }) {
     name: searchParams.get("name") || "",
   };
 
-  const [data, setData] = useState(defaultData);
   const [filter, setFilter] = useState(defaultFilter);
 
   const setDataInURL = (newFilter) => {
@@ -83,27 +70,12 @@ function Head({ matchedCity, matchedState, setDoctors }) {
 
   return (
     <div className="flex justify-center gap-[16px] sm:gap-[19px] md:gap-[22px] lg:gap-[24px] flex-col items-center mt-0 md:mt-[40px] lg:mt-[90px]">
-      <ModalSearchCity
-        open={open}
+      <FilterLocate
         filter={filter}
         sendReq={sendReq}
-        setOpen={setOpen}
         setFilter={setFilter}
         setDataInURL={setDataInURL}
-      >
-        <Button
-          className="!flex !ml-auto !w-fit !px-3 !py-1 !items-center !justify-start !gap-2 !cursor-pointer"
-          onClick={() => setOpen(true)}
-        >
-          <LocationD />
-          <h1 className="text-[#525252] text-[16px] font-semibold">
-            {" "}
-            {filter?.state?.name || "استان"}
-            {" / "}
-            {filter?.city?.name || "شهر"}
-          </h1>
-        </Button>
-      </ModalSearchCity>
+      />
       <div className="flex flex-col lg:flex-row items-start lg:items-center justify-center gap-[24px] lg:gap-[32px] w-full">
         <SearchBar
           filter={filter}
@@ -113,10 +85,11 @@ function Head({ matchedCity, matchedState, setDoctors }) {
           setDataInURL={setDataInURL}
         />
         <SortList
-          data={data}
           filter={filter}
-          setData={setData}
+          sendReq={sendReq}
+          setFilter={setFilter}
           updateData={updateData}
+          setDataInURL={setDataInURL}
         />
       </div>
     </div>