fix(client): remove OAuth tab, show VK/Yandex always with separator, fix pill hover offset

This commit is contained in:
Kirill
2026-05-22 13:41:52 +05:00
parent e468625cfc
commit cf61a5c44f
3 changed files with 20 additions and 18 deletions
+1 -1
View File
@@ -17,7 +17,7 @@ export function MainLayout({ children }: PropsWithChildren) {
const year = new Date().getFullYear()
return (
<Box sx={{ display: 'flex', flexDirection: 'column', minHeight: '100vh' }}>
<Box sx={{ display: 'flex', flexDirection: 'column', minHeight: '100vh', minWidth: '500px' }}>
<ScrollOnNavigate />
<ScrollToTop />
<AppHeader />
@@ -22,11 +22,17 @@ function renderPage() {
}
describe('AuthPage', () => {
it('renders three tabs', () => {
it('renders two tabs', () => {
renderPage()
expect(screen.getByRole('button', { name: 'Пароль' })).toBeTruthy()
expect(screen.getByRole('button', { name: 'Код' })).toBeTruthy()
expect(screen.getByRole('button', { name: 'Другой способ' })).toBeTruthy()
})
it('shows OAuth buttons and separator always', () => {
renderPage()
expect(screen.getByText('или')).toBeTruthy()
expect(screen.getByText('Войти через VK ID')).toBeTruthy()
expect(screen.getByText('Войти через Яндекс ID')).toBeTruthy()
})
it('shows login form by default on tab 0', () => {
@@ -49,11 +55,4 @@ describe('AuthPage', () => {
fireEvent.click(screen.getByText('Код'))
expect(screen.getByText('Отправить код')).toBeTruthy()
})
it('switches to OAuth tab', () => {
renderPage()
fireEvent.click(screen.getByText('Другой способ'))
expect(screen.getByText('Войти через VK ID')).toBeTruthy()
expect(screen.getByText('Войти через Яндекс ID')).toBeTruthy()
})
})
+11 -8
View File
@@ -122,7 +122,7 @@ export function AuthPage() {
<Box
sx={{
display: 'flex',
alignItems: 'center',
alignItems: 'start',
justifyContent: 'center',
minHeight: 'calc(100vh - 64px)',
px: 2,
@@ -153,13 +153,12 @@ export function AuthPage() {
{[
{ label: 'Пароль', idx: 0 },
{ label: 'Код', idx: 1 },
{ label: 'Другой способ', idx: 2 },
].map(({ label, idx }) => (
<Button
key={idx}
variant={tab === idx ? 'contained' : 'outlined'}
size="small"
sx={{ borderRadius: '24px', flex: 1, textTransform: 'none' }}
sx={{ borderRadius: '24px', flex: 1, textTransform: 'none', '&:hover': { transform: 'none' } }}
onClick={() => {
setTab(idx)
setMessage(null)
@@ -341,11 +340,15 @@ export function AuthPage() {
</Stack>
)}
{tab === 2 && (
<Stack spacing={2}>
<OAuthButtons />
</Stack>
)}
<Box sx={{ mt: 3, mb: 1, display: 'flex', alignItems: 'center', gap: 1 }}>
<Box sx={{ flex: 1, borderBottom: `1px solid ${theme.palette.divider}` }} />
<Typography variant="body2" color="text.secondary" sx={{ px: 1, whiteSpace: 'nowrap' }}>
или
</Typography>
<Box sx={{ flex: 1, borderBottom: `1px solid ${theme.palette.divider}` }} />
</Box>
<OAuthButtons />
</Paper>
</Box>
</Box>