From b71ca1c7fb36f168246f97c793990f55e897c894 Mon Sep 17 00:00:00 2001
From: Pramod Mahajan <pramodmahajan1411200@gmail.com>
Date: Mon, 9 Jun 2025 10:58:41 +0530
Subject: [PATCH]  resolve React key duplication warning in Breadcrumb
 component

---
 src/components/common/Breadcrumb.jsx | 18 ++++++++++--------
 1 file changed, 10 insertions(+), 8 deletions(-)

diff --git a/src/components/common/Breadcrumb.jsx b/src/components/common/Breadcrumb.jsx
index 4d593b3a..1fafbccb 100644
--- a/src/components/common/Breadcrumb.jsx
+++ b/src/components/common/Breadcrumb.jsx
@@ -3,30 +3,32 @@ import { useNavigate } from "react-router-dom";
 
 const Breadcrumb = ({ data }) => {
   const navigate = useNavigate();
+
   return (
     <nav aria-label="breadcrumb">
       <ol className="breadcrumb breadcrumb-custom-icon">
-        {data.map((item, index) =>
+        {data.map((item, index) => (
           item.link ? (
             <li className="breadcrumb-item cursor-pointer" key={index}>
               <a
-                aria-label="breadcrumb link link-underline-primary "
+                role="button"
+                tabIndex={0}
+                aria-label="breadcrumb link"
                 onClick={() => navigate(item.link)}
+                onKeyDown={(e) => {
+                  if (e.key === 'Enter') navigate(item.link);
+                }}
               >
                 {item.label}
               </a>
               <i className="breadcrumb-icon icon-base bx bx-chevron-right align-middle"></i>
             </li>
           ) : (
-            <li
-              className="breadcrumb-item active "
-              key={new Date().getMilliseconds()}
-            >
-              {" "}
+            <li className="breadcrumb-item active" key={index}>
               {item.label}
             </li>
           )
-        )}
+        ))}
       </ol>
     </nav>
   );