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/list/ItemSpecialties.js

@@ -1,9 +1,17 @@
 import TextLoading from "@/app/component/loading/Text";
 import React from "react";
+import { useRouter } from "next/navigation";
 
 function ItemSpecialties({ data, loading }) {
+  const router = useRouter();
+  
+  const handleClick = () => {
+    router.push(`/doctors?specialties=${data.id}`);
+  };
+
   return (
     <li
+      onClick={handleClick}
       className="py-[17.5px] px-[12px] flex flex-col justify-center items-center gap-[16px] 
       rounded-lg bg-[#FFF] shadow-[0px_1px_24.8px_0px_rgba(204,_204,_204,_0.18)]
       hover:bg-[#5559CE] transition-all duration-500 cursor-pointer hover-mode-item-speciality"

components/specialties/list/index.js

@@ -1,9 +1,8 @@
-import specialties from "@/data/specialties.json";
-import ItemSpecialties from "./ItemSpecialties";
 import MenuS from "@/components/icons/MenuS";
 import Pagination from "@/app/component/Pagination";
+import ItemSpecialties from "./ItemSpecialties";
 
-function List({ loading }) {
+function List({ loading, specialties = [] }) {
   return (
     <div className="bg-[#FAFAFA]">
       <div className="flex items-center justify-center gap-[12px] pt-[24px] mb-[40px]">
@@ -12,19 +11,25 @@ function List({ loading }) {
           لیست تخصص ها
         </p>
       </div>
-      <ul
-        className="padding-responsive grid grid-cols-2 sm:grid-cols-3 mg:grid-cols-4 lg:grid-cols-6 
-            gap-x-[16px] md:gap-x-[20px] lg:gap-x-[24px] 
-            gap-y-[16px] sm:gap-y-[24px] md:gap-y-[32px] lg:gap-y-[40px]"
-      >
-        {specialties.map((speciality) => (
-          <ItemSpecialties
-            loading={loading}
-            data={speciality}
-            key={speciality.id}
-          />
-        ))}
-      </ul>
+      {specialties.length === 0 ? (
+        <div className="text-center py-10 text-gray-500">
+          تخصصی با این عنوان یافت نشد!
+        </div>
+      ) : (
+        <ul
+          className="padding-responsive grid grid-cols-2 sm:grid-cols-3 mg:grid-cols-4 lg:grid-cols-6 
+              gap-x-[16px] md:gap-x-[20px] lg:gap-x-[24px] 
+              gap-y-[16px] sm:gap-y-[24px] md:gap-y-[32px] lg:gap-y-[40px]"
+        >
+          {specialties.map((speciality) => (
+            <ItemSpecialties
+              loading={loading}
+              data={speciality}
+              key={speciality.id}
+            />
+          ))}
+        </ul>
+      )}
       <div className="mt-[48px] flex justify-center">
         <Pagination />
       </div>