Refactor user settings access in navigation: replace direct settings link with username display for logged-in users, enhancing mobile and desktop menu experiences. Update logout button placement and styling for improved usability.
build / backend (push) Successful in 1m14s
build / frontend (push) Successful in 45s
tests / backend-tests (push) Successful in 1m29s

This commit is contained in:
Leonid Pershin
2026-07-26 15:25:18 +03:00
parent b602d099ca
commit 74bca20a3c
+19 -6
View File
@@ -48,9 +48,6 @@ function RootLayout() {
<Link to="/dashboard" className="hover:text-primary" activeProps={{ className: 'text-primary' }}> <Link to="/dashboard" className="hover:text-primary" activeProps={{ className: 'text-primary' }}>
{t('nav.dashboard')} {t('nav.dashboard')}
</Link> </Link>
<Link to="/settings" className="hover:text-primary" activeProps={{ className: 'text-primary' }}>
{t('nav.settings')}
</Link>
{user.role === 'admin' && ( {user.role === 'admin' && (
<Link to="/admin" className="hover:text-primary" activeProps={{ className: 'text-primary' }}> <Link to="/admin" className="hover:text-primary" activeProps={{ className: 'text-primary' }}>
{t('nav.admin')} {t('nav.admin')}
@@ -80,12 +77,23 @@ function RootLayout() {
</select> </select>
{user ? ( {user ? (
<>
{/* Имя пользователя — вход в настройки аккаунта: отдельный пункт меню под это не нужен. */}
<Link
to="/settings"
title={t('nav.settings')}
className="hidden max-w-40 truncate rounded-sm border border-border px-3 py-1 text-xs uppercase tracking-wide hover:bg-muted md:block"
activeProps={{ className: 'border-primary text-primary' }}
>
{user.userName}
</Link>
<button <button
className="hidden rounded-sm border border-border px-3 py-1 text-xs uppercase tracking-wide hover:bg-muted md:block" className="hidden rounded-sm border border-border px-3 py-1 text-xs uppercase tracking-wide hover:bg-muted md:block"
onClick={() => void handleLogout()} onClick={() => void handleLogout()}
> >
{t('nav.logout')} {t('nav.logout')}
</button> </button>
</>
) : ( ) : (
<Link <Link
to="/login" to="/login"
@@ -112,14 +120,19 @@ function RootLayout() {
<Link to="/dashboard" onClick={() => setMenuOpen(false)}> <Link to="/dashboard" onClick={() => setMenuOpen(false)}>
{t('nav.dashboard')} {t('nav.dashboard')}
</Link> </Link>
<Link to="/settings" onClick={() => setMenuOpen(false)}>
{t('nav.settings')}
</Link>
{user.role === 'admin' && ( {user.role === 'admin' && (
<Link to="/admin" onClick={() => setMenuOpen(false)}> <Link to="/admin" onClick={() => setMenuOpen(false)}>
{t('nav.admin')} {t('nav.admin')}
</Link> </Link>
)} )}
{/* В мобильном меню тот же принцип: настройки открываются по имени пользователя. */}
<Link
to="/settings"
className="truncate border-t border-border pt-2"
onClick={() => setMenuOpen(false)}
>
{user.userName}
</Link>
<button className="py-1 text-left" onClick={() => void handleLogout()}> <button className="py-1 text-left" onClick={() => void handleLogout()}>
{t('nav.logout')} {t('nav.logout')}
</button> </button>