.

components/home/BrowseExperiences.js

@@ -16,6 +16,7 @@ import { useRouter } from "next/router.js";
 import WishlistComponent from "../detail/WIshlistComponent.js";
 import { useSelector } from "react-redux";
 import Link from "next/link.js";
+import ActiveLink from "../common/ActiveLink.js";
 const BrowseExperiences = ({ allActivitiesData }) => {
   const { endUser } = useSelector(state => state.endUser);
 
@@ -35,7 +36,7 @@ const BrowseExperiences = ({ allActivitiesData }) => {
                   </div>
                 </motion.div>
                 <div className="view-all-btn">
-                                    <Link href={"/listing"} prefetch>
+                  <ActiveLink href={"/listing"} prefetch>
                     <Button
                       variant="primary"
                       // onClick={() => {
@@ -44,7 +45,7 @@ const BrowseExperiences = ({ allActivitiesData }) => {
                     >
                       View All
                     </Button>
-                                    </Link>
+                  </ActiveLink>
                 </div>
               </div>
             </div>
@@ -120,7 +121,7 @@ const BrowseExperiences = ({ allActivitiesData }) => {
                                   <div className="">Includes taxes & Fees</div>
                                 </div>
                                 <div className="explore-now">
-                                                                    <Link href={`/activities/${data.id}`} prefetch>
+                                  <ActiveLink href={`/activities/${data.id}`} prefetch>
                                     <Button
                                       // onClick={() => {
                                       //   router.push(`/activities/${data.id}`);
@@ -129,7 +130,7 @@ const BrowseExperiences = ({ allActivitiesData }) => {
                                     >
                                       Explore Now
                                     </Button>
-                                                                    </Link>
+                                  </ActiveLink>
                                 </div>
                               </div>
                             </div>

components/home/LetDiscover.js

@@ -14,6 +14,7 @@ import "swiper/css/navigation";
 import { cleanImage } from "../../services/imageHandling.js";
 import { useRouter } from "next/router.js";
 import Link from "next/link.js";
+import ActiveLink from "../common/ActiveLink.js";
 const LetDiscover = ({ categories }) => {
   const router = useRouter();
   return (
@@ -33,7 +34,7 @@ const LetDiscover = ({ categories }) => {
                   </div>
                 </motion.div>
                 <div className="view-all-btn">
-                  <Link href={"/listing"} prefetch>
+                  <ActiveLink href={"/listing"} prefetch>
                   <Button
                     // onClick={() => {
                     //   router.push("/listing");
@@ -42,7 +43,7 @@ const LetDiscover = ({ categories }) => {
                   >
                     View All
                   </Button>
-                  </Link>
+                  </ActiveLink>
                 </div>
               </div>
             </div>