Zimin A.N.
71432e9ae7
Глобальные правки через @theme в styles.css вместо 200+ точечных правок: - text-sm: 14px -> 13px (handoff workhorse — body, buttons, tabs) - text-2xs: undefined -> 11px (handoff IDs, mono meta — было невидимо) - @utility text-cap: 10.5px Tektur uppercase 0.10em (handoff caps) Codemod (30 sites): text-2xs + uppercase + tracking-[0.10em] -> text-cap. Sidebar section labels consolidated с explicit text-[10.5px] на text-cap. Покрывает 64 text-sm + 148 text-2xs автоматически. Table cells (12.5px) и page/modal titles (17px/22px) остаются explicit text-[Npx] arbitrary values по месту — нет slots в Tailwind scale.
79 lines
2.0 KiB
TypeScript
79 lines
2.0 KiB
TypeScript
import { useAuth } from 'react-oidc-context'
|
|
import { useTranslation } from 'react-i18next'
|
|
import { Button, IconButton } from '@/ui'
|
|
import { SignInIcon, SignOutIcon, UserIcon } from '@phosphor-icons/react'
|
|
|
|
/**
|
|
* Бейдж в header'е: «Войти» если anonymous; имя + logout если залогинен.
|
|
*
|
|
* <p>Logout жмёт {@code signoutRedirect} — Keycloak инвалидирует SSO-сессию и
|
|
* вернёт на post-logout-uri (корень).
|
|
*/
|
|
export function AuthBadge() {
|
|
const { t } = useTranslation()
|
|
const auth = useAuth()
|
|
|
|
if (auth.isLoading) {
|
|
return (
|
|
<span className="text-cap text-mute">
|
|
{t('loading')}
|
|
</span>
|
|
)
|
|
}
|
|
|
|
if (auth.error) {
|
|
// Не валим UI — просто кнопка для повтора login.
|
|
return (
|
|
<Button
|
|
type="button"
|
|
variant="secondary"
|
|
leftIcon={<SignInIcon size={16} />}
|
|
onClick={() => auth.signinRedirect()}
|
|
>
|
|
{t('auth.login')}
|
|
</Button>
|
|
)
|
|
}
|
|
|
|
if (!auth.isAuthenticated) {
|
|
return (
|
|
<Button
|
|
type="button"
|
|
variant="primary"
|
|
leftIcon={<SignInIcon size={16} />}
|
|
onClick={() => auth.signinRedirect()}
|
|
>
|
|
{t('auth.login')}
|
|
</Button>
|
|
)
|
|
}
|
|
|
|
const profile = auth.user?.profile
|
|
const display =
|
|
profile?.preferred_username ||
|
|
profile?.name ||
|
|
profile?.email ||
|
|
profile?.sub ||
|
|
'user'
|
|
|
|
return (
|
|
<div className="flex items-center gap-2">
|
|
<span className="inline-flex items-center gap-1 text-sm text-ink">
|
|
<UserIcon size={14} weight="duotone" />
|
|
<span className="hidden sm:inline">{display}</span>
|
|
</span>
|
|
<IconButton
|
|
type="button"
|
|
icon={<SignOutIcon weight="bold" />}
|
|
label={t('auth.logout')}
|
|
onClick={() =>
|
|
auth.signoutRedirect().catch(() => {
|
|
// Если Keycloak недоступен — просто очищаем локальный state.
|
|
auth.removeUser()
|
|
})
|
|
}
|
|
/>
|
|
</div>
|
|
)
|
|
}
|