feat(specialties): enhance specialties components to include city and state names in metadata and links

components/specialties/list/ItemSpecialties.js

@@ -1,13 +1,15 @@
 import Link from "next/link";
 
-function ItemSpecialties({ data }) {
+function ItemSpecialties({ data, cityName, stateName }) {
   return (
     <li>
       <Link
         href={{
           pathname: "/doctors",
           query: {
-            specialties: data.id,
+            specialty: data.name,
+            ...(cityName && { city: cityName }),
+            ...(stateName && { state: stateName }),
           },
         }}
         className="py-[17.5px] px-[12px] flex flex-col justify-center items-center gap-[16px] 

components/specialties/list/index.js

@@ -1,7 +1,7 @@
 import MenuS from "@/components/icons/MenuS";
 import ItemSpecialties from "./ItemSpecialties";
 
-function List({ specialties = [] }) {
+function List({ specialties = [], cityName, stateName }) {
   return (
     <div className="bg-[#FAFAFA]">
       <div className="flex items-center justify-center gap-[12px] pt-[24px] mb-[40px]">
@@ -21,7 +21,12 @@ function List({ specialties = [] }) {
               gap-y-[16px] sm:gap-y-[24px] md:gap-y-[32px] lg:gap-y-[40px]"
         >
           {specialties.map((speciality) => (
-            <ItemSpecialties data={speciality} key={speciality.id} />
+            <ItemSpecialties
+              data={speciality}
+              key={speciality.id}
+              cityName={cityName}
+              stateName={stateName}
+            />
           ))}
         </ul>
       )}