abaranchugov / bp-test-react

Тестовое приложение на реакте

Приложение написано на основании тестового задания компании breakpoint

Задание

1. Адаптивная форма входа с валидацией в модальном окне
2. Счётчики успешной / неуспешной авторизации

Требования

Требования к модальному окну:

• Без использования плагинов создать собственное модальное окно.
• При нажатии на кнопку “Login”, должно открыться модальное окно с формой входа.
• Модальное окно всегда центрируется на экране.
• При нажатии на 'Х' или мимо модального окна, оно закрывается.
• Модальное окно адаптивное. Требования к форме:
• Поля E-mail и Password валидируются.
• Создать файл users.json с несколькими записями (E-mail, Password), для авторизации.
• После успешной авторизации модальное окно выводит сообщение “success” и само закрывается через 3с.

Требования к счетчикам:

• Считать успешные и неуспешные авторизации формы.
• При обновлении страницы значения счетчиков не должны пропадать.

Для запуска проекта в дев-режме используется команда

npm run start:dev

Учетные записи

Для проверки успешной акутентификации стоит использовать учетные записи из файла ./src/server/user.json

email: [email protected] password: 1Aaaaaaa

email: [email protected] password: 2Aaaaaaa

email: [email protected] password: 3Aaaaaaa

P.S.

Для обработки события закрытия формы (изменения роута), когда в поля формы введены значения, используется unstable usePrompt библиотеки react-router-dom v 6.10.0, т.к. разработчики библиотеки при переходе с 5 версии на 6 версию исключили из библиотеки компонент , а адекватно работающих решений совместимых с версией 6.10.0 на просторах интернета не нашлось