the test task
https://sergiioz.github.io/birthday-list-of-employees/
Реалізувати:
- Завантажити список співробітників з сервера, при потраплянні на сторінку employees (сторінка /employees буде відкриватися відразу, навігації робити не потрібно).
- Відобразити англійський алфавіт.
- Співробітник = FirstName + LastName. Відобразити співробітників, за алфавітом, сортуємо за firstName. Якщо у літери немає співробітників, ставимо «No Employees». Біля кожного співробітника є по 2 RadioButton. По дефолту ‘not active’ (не активний), значення цього radio item буде = false
- Якщо хочемо вибирати співробітника, натискаємо на ‘active’, зі значенням = true. Обраний співробітник повинен бути виділений синім кольором.
- У правій частині сторінки є блок Employees birthday, в якому відображаються обрані співробітники, згруповані за назвою місяця їх дня народження та відсортовані по їх lastName (від А до Я).
- Місяці повинні починатися з місяця виконання цього завдання і далі по черзі.
- Якщо в місяці немає обраних співробітників/співробітника - виводимо назву місяця з текстом «No Employees».
- Якщо ви не обрали нікого зі співробітників, то в блоці Employees birthday пишемо Employees List is empty
- Якщо сторінку перезавантажено - обрані співробітники в правому блоку повинні бути збережені. А в лівому блоку Employees, у даних співробітників повинен бути активним radio item ‘active’ та виділено синім кольором їх Fisrst Name + Last Name.
Вимоги до коду:
- Використання Prettier.
- Використання функціональних компонентів та хуків, ES6 features.
- Мінімальний розподіл проекту на логічні частини / папки.
Вимоги до проекту:
- Розгорнути додаток, використовуючи create-react-app.
- Створити публічний репозиторій на Github для проекту.
- Використовувати UI ліби в проекті заборонено.
- UI частина додатку залишається на ваш розсуд.
- Задеплоїти виконане завдання за допомогою Github page
Буде плюсом:
- Використання Redux (redux-toolkit, redux-thunk/saga) та/або React Context в проекті.
- Використання TypeScript або опис типізація за допомогою PropTypes.
- Мінімально покрити unit-тестами логічні частини в проекті.