made tracking component body navigate on click

src/components/Cards/TrackItemCard.jsx

@@ -1,14 +1,16 @@
 import React, { useState } from "react";
-import { Link } from "react-router-dom";
+import { Link, useNavigate } from "react-router-dom";
 // import { toast } from "react-toastify";
 import localImgLoad from "../../lib/localImgLoad";
 import CountDown from "../Helpers/CountDown";
 import Icons from "../Helpers/Icons";
 
 export default function TrackItemCard({ datas, hidden = false }) {
+  const navigate = useNavigate()
   const [addFavorite, setValue] = useState(false);
   const [options, setOption] = useState(false);
-  const favoriteHandler = () => {
+  const favoriteHandler = (e) => {
+    e.stopPropagation()
     if (!addFavorite) {
       setValue(true);
     } else {
@@ -16,7 +18,7 @@ export default function TrackItemCard({ datas, hidden = false }) {
     }
   };
   return (
-    <div className="card-style-one flex flex-col justify-between w-full h-[200px] bg-white dark:bg-dark-white   p-3 pb rounded-2xl">
+    <div className="card-style-one flex flex-col justify-between w-full h-[200px] bg-white dark:bg-dark-white p-3 pb rounded-2xl cursor-pointer" onClick={()=>{navigate(`/track-action/${datas.widget}`, { replace: true })}}>
       <div className="content">
         {/* thumbnail */}
         <div className="w-full h-40">