save state selected in modal filter, filter list with location selected, save data sort, filter list with sort point, real all url from .env file, change name of value category and specialties to persian and change functional find data with field

components/home/search/Fields.js

@@ -2,12 +2,10 @@
 
 import { useState } from "react";
 
-import { Button, TextField } from "@mui/material";
 import ModalSearchCity from "@/app/component/modalSearchCity";
-import Search from "@/components/icons/Search";
 import ButtonFilter from "@/app/component/modalSearchCity/ButtonFilter";
-import Link from "next/link";
-import SearchD from "@/components/icons/SearchD";
+import FilterText from "./FilterText";
+import RedirectLink from "./RedirectLink";
 
 function Fields({ city, state }) {
   const [open, setOpen] = useState(false);
@@ -28,66 +26,8 @@ function Fields({ city, state }) {
         <ButtonFilter setOpen={setOpen} selected={data} />
       </ModalSearchCity>
       <span className="black w-px bg-[#EFEFEF]"></span>
-      <TextField
-        variant="standard"
-        onChange={(e) => setData({ ...data, search: e.target.value })}
-        InputProps={{
-          disableUnderline: true,
-        }}
-        sx={{
-          display: "flex",
-          flexDirection: "column",
-          justifyContent: "center",
-          "& .MuiInput-root": {
-            padding: "0",
-            borderBottom: "none",
-          },
-          "& .MuiInputBase-input": {
-            color: "#6C757D",
-          },
-          "& .MuiInputBase-input": {
-            color: "#6C757D",
-            fontSize: {
-              xs: "10px !important",
-              sm: "12px !important",
-              md: "14px !important",
-              lg: "16px !important",
-            },
-          },
-        }}
-        placeholder="جستجوی نام پزشک، تخصص، بیماری ..."
-        dir="rtl"
-        className={`!shadow-none !w-full lg:!w-[524px] bg-[#FAFAFA] !text-[14px] md:!text-[16px] !rounded-0 !font-normal !text-[#6C757D]`}
-      />
-      <Link
-        href={{
-          pathname: "/doctors",
-          query: {
-            province: data.province,
-            city: data.city,
-            search: data.search,
-          },
-        }}
-      >
-        <Button className="!hidden lg:!flex !rounded-[4px] !h-[40px] sm:!h-[42px] md:!h-[45px] lg:!h-[48px] !gap-2.5 !min-w-[114px]">
-          <div className="min-w-[20px] min-h-[20px]">
-            <Search />
-          </div>
-          <p>جستجو</p>
-        </Button>
-        <Button
-          className="!flex lg:!hidden !rounded-[4px] 
-                !w-[40px] sm:!w-[42px] md:!w-[45px] lg:!w-[48px]
-                !h-[40px] sm:!h-[42px] md:!h-[45px] lg:!h-[48px] 
-                !min-w-[40px] sm:!min-w-[42px] md:!min-w-[45px] lg:!min-w-[48px]
-                !min-h-[40px] sm:!min-h-[42px] md:!min-h-[45px] lg:!min-h-[48px] 
-                !gap-2.5 !p-2.5"
-        >
-          <div className="w-[24px] h-[24px] min-w-[24px] min-h-[24px]">
-            <SearchD />
-          </div>
-        </Button>
-      </Link>
+      <FilterText data={data} setData={setData} />
+      <RedirectLink data={data} />
     </>
   );
 }