fix links are not crawable

wri · Nov 17, 2024 · b265af8 · b265af8
1 parent 86654a2
commit b265af8
Show file tree

Hide file tree

Showing 3 changed files with 15 additions and 11 deletions.
diff --git a/components/layout/header.js b/components/layout/header.js
@@ -31,9 +31,9 @@ const Header = ({ url }) => {
         <div className="header-container">
           <h1 className="header-logo">
             <Link href="/" prefetch={false}>
-              
+
                 Open Timber Portal
-              
+
             </Link>
             {process.env.ENV === 'staging' && (
               <span className="header-logo-staging">Staging</span>
@@ -47,7 +47,7 @@ const Header = ({ url }) => {
                 <Search theme={theme} />
               </li>
               <li>
-                <UserDropdown theme={theme} />
+                <UserDropdown theme={theme} className="header-nav-list-item" />
               </li>
               <li>
                 <LanguageDropdown className="header-nav-list-item" showSelectedCode />

diff --git a/components/ui/dropdown.js b/components/ui/dropdown.js
@@ -1,4 +1,4 @@
-import React, { useState, useEffect, useRef, useCallback } from 'react';
+import React, { useState, useRef } from 'react';
 import PropTypes from 'prop-types';
 import classNames from 'classnames';
 
@@ -14,12 +14,13 @@ const DropdownContent = (props) => {
 }
 
 const DropdownTrigger = (props) => {
-  const { children, className, ...dropdownTriggerProps } = props;
+  const { children, ...dropdownTriggerProps } = props;
+  const className = classNames('dropdown__trigger', props.className);
 
   return (
-    <a {...dropdownTriggerProps} className={`dropdown__trigger ${className}`}>
+    <div role="button" {...dropdownTriggerProps} className={className}>
       {children}
-    </a>
+    </div>
   );
 }
 

diff --git a/components/ui/user-dropdown.js b/components/ui/user-dropdown.js
@@ -1,5 +1,6 @@
 import React from 'react';
 import PropTypes from 'prop-types';
+import cx from 'classnames';
 
 import dynamic from 'next/dynamic';
 
@@ -16,10 +17,12 @@ import Icon from 'components/ui/icon';
 
 const Login = dynamic(() => import('components/ui/login'), { ssr: false });
 
-const UserDropdown = ({ intl, user, displayIcon, theme }) => {
+const UserDropdown = ({ intl, user, displayIcon, className, theme }) => {
   if (!user.token) {
     return (
-      <a
+      <div
+        className={className}
+        role="button"
         onClick={() => {
           modal.toggleModal(true, {
             children: Login
@@ -28,13 +31,13 @@ const UserDropdown = ({ intl, user, displayIcon, theme }) => {
       >
         {displayIcon && <Icon name="icon-user" />}
         <span>{intl.formatMessage({ id: 'signin' })}</span>
-      </a>
+      </div>
     )
   }
 
   return (
     <Dropdown
-      className={`c-account-dropdown ${theme}`}
+      className={cx('c-account-dropdown', theme, className)}
     >
       <DropdownTrigger>
         <div className="header-nav-list-item">