At-Work

Задача

Разработать интерфейс двухстраничного приложения на React

Описание главной страницы

Отображает список пользователей, которых можно получить с https://jsonplaceholder.typicode.com/ по роуту /users
Достаточно вывести первые 6 пользователей

Каждая карточка содержит:

1. Username
2. City
3. Company name
4. Аватарка (любая картинка, можно свою)

Действия с карточкой:

1. Редактировать (переносит на страницу изменения данных пользователя)
2. Архивировать (переносит карточку в секцию Архив)
3. Скрыть (Убирает карточку из списка)

Данные могут сбрасываться после перезагрузки
Во время загрузки данных отобразить сообщение об этом, либо loader
Карточку из архива можно сделать активной, карточка возвращается в секцию активные

Описание страницы редактирования

Должна содержать:

1. Name
2. Username
3. Email
4. City
5. Phone
6. Company Name
7. Аватарка (любая картинка, можно свою)

Во время загрузки данных отобразить сообщение об этом, либо loader
На странице можно менять данные и сохранять изменения
Валидация: поля не должны быть пустыми
При нажатии на кнопку сохранить и успешной валидации появляется попап с сообщением, попап закрывается при нажатии на крестик, либо через 4 секунды
Изменения могут не сохраняться после перезагрузки и переходе на главную страницу

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

Использовать React и Redux Toolkit
Для роутинга использовать React Router v6
Код решения прислать ссылкой на репозиторий Github

Установка проекта

1. npm i
   
2. npm run start