diff --git a/CONTEXT.md b/CONTEXT.md index 71fbb6d..37015c4 100644 --- a/CONTEXT.md +++ b/CONTEXT.md @@ -44,6 +44,8 @@ | 2026-01-14 | E2E тесты переписаны с Selenium на Playwright (tests/e2e/*.spec.ts) | | 2026-01-14 | **Фаза 2:** Улучшен Drag & Drop — добавлен @dnd-kit/modifiers, исправлен race condition с drag handle, restrictToVerticalAxis | | 2026-01-14 | **Production:** Настроен Keycloak для production (team-planner.vigdorov.ru), обновлён Dockerfile с Keycloak переменными | +| 2026-01-14 | **UI:** Страница логина (LoginPage) — кнопка "Войти", описание приложения, контакт для получения доступа | +| 2026-01-14 | **UI:** Кнопка выхода на главной странице (IconButton с Logout) | --- @@ -92,6 +94,7 @@ team-planner/ ├── src/ │ ├── components/ │ │ ├── AuthProvider/ # Keycloak авторизация ✅ + │ │ ├── LoginPage/ # Страница логина ✅ │ │ ├── IdeasTable/ │ │ │ ├── IdeasTable.tsx # Таблица с DndContext │ │ │ ├── DraggableRow.tsx # Сортируемая строка (useSortable) diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx index cf793f1..fb996d8 100644 --- a/frontend/src/App.tsx +++ b/frontend/src/App.tsx @@ -1,13 +1,25 @@ -import { Container, Typography, Box, Button } from '@mui/material'; -import { Add } from '@mui/icons-material'; +import { + Container, + Typography, + Box, + Button, + IconButton, + Tooltip, +} from '@mui/material'; +import { Add, Logout } from '@mui/icons-material'; import { IdeasTable } from './components/IdeasTable'; import { IdeasFilters } from './components/IdeasFilters'; import { CreateIdeaModal } from './components/CreateIdeaModal'; import { useIdeasStore } from './store/ideas'; +import keycloak from './services/keycloak'; function App() { const { setCreateModalOpen } = useIdeasStore(); + const handleLogout = () => { + void keycloak.logout(); + }; + return ( - + + + + + + + + diff --git a/frontend/src/components/AuthProvider/AuthProvider.tsx b/frontend/src/components/AuthProvider/AuthProvider.tsx index 34c883d..907f85b 100644 --- a/frontend/src/components/AuthProvider/AuthProvider.tsx +++ b/frontend/src/components/AuthProvider/AuthProvider.tsx @@ -1,6 +1,7 @@ import { type ReactNode, useEffect, useRef, useState } from 'react'; import { Box, CircularProgress, Typography } from '@mui/material'; import keycloak from '../../services/keycloak'; +import { LoginPage } from '../LoginPage'; interface AuthProviderProps { children: ReactNode; @@ -23,7 +24,7 @@ export function AuthProvider({ children }: AuthProviderProps) { const initKeycloak = async () => { try { const authenticated = await keycloak.init({ - onLoad: 'login-required', + onLoad: 'check-sso', checkLoginIframe: false, pkceMethod: 'S256', }); @@ -75,18 +76,7 @@ export function AuthProvider({ children }: AuthProviderProps) { } if (!isAuthenticated) { - return ( - - Ошибка авторизации. Перенаправление... - - ); + return ; } return <>{children}; diff --git a/frontend/src/components/LoginPage/LoginPage.tsx b/frontend/src/components/LoginPage/LoginPage.tsx new file mode 100644 index 0000000..548988d --- /dev/null +++ b/frontend/src/components/LoginPage/LoginPage.tsx @@ -0,0 +1,54 @@ +import { Box, Button, Typography, Paper } from '@mui/material'; +import { Login } from '@mui/icons-material'; +import keycloak from '../../services/keycloak'; + +export function LoginPage() { + const handleLogin = () => { + void keycloak.login(); + }; + + return ( + + + + Team Planner + + + Приложение для управления бэклогом идей команды + + + + + + Для получения доступа обратитесь к Николаю Вигдорову + + + + ); +} diff --git a/frontend/src/components/LoginPage/index.ts b/frontend/src/components/LoginPage/index.ts new file mode 100644 index 0000000..2c983e3 --- /dev/null +++ b/frontend/src/components/LoginPage/index.ts @@ -0,0 +1 @@ +export { LoginPage } from './LoginPage'; diff --git a/package.json b/package.json index e3910e6..b4b714b 100644 --- a/package.json +++ b/package.json @@ -10,6 +10,7 @@ "dev": "concurrently -n be,fe -c blue,green \"npm run dev:backend\" \"npm run dev:frontend\"", "dev:backend": "npm run dev -w backend", "dev:frontend": "npm run dev -w frontend", + "lint": "npm run -w backend lint && npm run -w frontend lint", "build": "npm run build:backend && npm run build:frontend", "build:backend": "npm run build -w backend", "build:frontend": "npm run build -w frontend",