fix(client): remove OAuth tab, show VK/Yandex always with separator, fix pill hover offset
This commit is contained in:
@@ -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()
|
||||
})
|
||||
})
|
||||
|
||||
@@ -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}>
|
||||
<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 />
|
||||
</Stack>
|
||||
)}
|
||||
</Paper>
|
||||
</Box>
|
||||
</Box>
|
||||
|
||||
Reference in New Issue
Block a user