se supone que debe establecer texto en negrita en la etiqueta de anclaje pero no configurarlo, no solo que también elimina la primera cadena. ¿alguien puede ayudar y explicar?
<a className={'mr-5 hover:text-gray-900 '+ router.pathname == '/' ? 'font-bold':''} WebSite </a>
En la comparación lo que está pasando es: primero una concat con el texto mr-5 hover:text-gray-900 con el router.pathname y luego comparando con el / , que devolverá siempre false .
Para solucionar el problema, debe envolver el ternario entre paréntesis:
<a className={'mr-5 hover:text-gray-900 '+ (router.pathname == '/' ? 'font-bold' : '')}> WebSite </a>