From 0caf7af45b5601e07ee6509169ffea1f8533a899 Mon Sep 17 00:00:00 2001
From: pradeepkumar <kongupradeep@live.com>
Date: Thu, 19 Mar 2026 18:29:18 +0530
Subject: [PATCH] fix: Update 'show more/less' tag button to prevent event
 propagation and improve event handling.

---
 src/components/home/TopProfessionals.tsx | 10 ++++++----
 1 file changed, 6 insertions(+), 4 deletions(-)

diff --git a/src/components/home/TopProfessionals.tsx b/src/components/home/TopProfessionals.tsx
index 33ae876..da63b56 100644
--- a/src/components/home/TopProfessionals.tsx
+++ b/src/components/home/TopProfessionals.tsx
@@ -118,12 +118,14 @@ function ProfessionalCard({
                   </span>
                 ))}
                 {expertise.length > INITIAL_TAG_COUNT && (
-                  <button
-                    onClick={(e) => { e.preventDefault(); e.stopPropagation(); setShowAllTags(!showAllTags); }}
-                    className="border-[0.7px] border-[#e58625] rounded-[15px] px-[5px] h-[24px] flex items-center justify-center font-serif font-normal text-[13px] leading-[100%] text-[#e58625] hover:bg-[#e58625]/10 transition-colors"
+                  <span
+                    role="button"
+                    onClick={(e) => { e.preventDefault(); e.stopPropagation(); e.nativeEvent.stopImmediatePropagation(); setShowAllTags(prev => !prev); }}
+                    onMouseDown={(e) => { e.preventDefault(); e.stopPropagation(); }}
+                    className="border-[0.7px] border-[#e58625] rounded-[15px] px-[5px] h-[24px] flex items-center justify-center font-serif font-normal text-[13px] leading-[100%] text-[#e58625] hover:bg-[#e58625]/10 transition-colors cursor-pointer"
                   >
                     {showAllTags ? 'Show Less' : `+${expertise.length - INITIAL_TAG_COUNT} more`}
-                  </button>
+                  </span>
                 )}
               </div>
             </div>