Merge pull request #20237 from overleaf/td-bs5-contact-nav-item-button

Implement contact form nav item as a button rather than link

GitOrigin-RevId: 00690f70d343077b7884005f2e4ab8f8cc651b23

services/web/frontend/js/features/ui/components/bootstrap-5/navbar/contact-us-item.tsx

@@ -1,6 +1,7 @@
-import NavDropdownLinkItem from '@/features/ui/components/bootstrap-5/navbar/nav-dropdown-link-item'
 import { sendMB } from '@/infrastructure/event-tracking'
 import { useTranslation } from 'react-i18next'
+import { DropdownItem } from 'react-bootstrap-5'
+import NavDropdownItem from '@/features/ui/components/bootstrap-5/navbar/nav-dropdown-item'
 
 export default function ContactUsItem({
   showModal,
@@ -10,14 +11,17 @@ export default function ContactUsItem({
   const { t } = useTranslation()
 
   return (
-    <NavDropdownLinkItem
-      href="#"
-      onClick={() => {
-        sendMB('menu-clicked-contact')
-        showModal()
-      }}
-    >
-      {t('contact_us')}
-    </NavDropdownLinkItem>
+    <NavDropdownItem>
+      <DropdownItem
+        as="button"
+        role="menuitem"
+        onClick={() => {
+          sendMB('menu-clicked-contact')
+          showModal()
+        }}
+      >
+        {t('contact_us')}
+      </DropdownItem>
+    </NavDropdownItem>
   )
 }