feat: Add search by name and specialty card navigation

- Implemented search functionality to filter specialties by name
- Added navigation to /doctors page with specialty ID as query parameter when clicking on a specialty card
- Enhanced user experience by providing real-time search results and clear navigation path

components/specialties/index.js

@@ -4,9 +4,12 @@ import { useEffect, useState } from "react";
 import List from "./list";
 import SmSearch from "../searchHead/SmSearch";
 import HeadPageList from "@/app/component/head";
+import specialtiesData from "@/data/specialties.json";
 
 function SpecialtiesPage() {
   const [loading, setLoading] = useState(true);
+  const [searchQuery, setSearchQuery] = useState("");
+  const [filteredSpecialties, setFilteredSpecialties] = useState(specialtiesData);
 
   useEffect(() => {
     setTimeout(() => {
@@ -14,15 +17,32 @@ function SpecialtiesPage() {
     }, 2000);
   }, []);
 
+  // Filter specialties when search query changes
+  useEffect(() => {
+    if (searchQuery.trim() === "") {
+      setFilteredSpecialties(specialtiesData);
+    } else {
+      const query = searchQuery.toLowerCase().trim();
+      const filtered = specialtiesData.filter((specialty) =>
+        specialty.name.toLowerCase().includes(query)
+      );
+      setFilteredSpecialties(filtered);
+    }
+  }, [searchQuery]);
+
+  const handleSearch = (query) => {
+    setSearchQuery(query);
+  };
+
   return (
     <div className="">
       <HeadPageList
         title="تخصص مورد نظر شما چیست؟"
         detail="تخصص مورد نظرتان را جستجو کرده و یا از لیست زیر انتخاب نمایید:"
       >
-        <SmSearch placeholder="جستجوی تخصص" />
+        <SmSearch placeholder="جستجوی تخصص" onSearch={handleSearch} />
       </HeadPageList>
-      <List loading={loading} />
+      <List loading={loading} specialties={filteredSpecialties} />
     </div>
   );
 }