Test Task: React + TypeScript

Список товаров:

• Главная страница должна содержать заголовок: "Fantastik Shop!"
• На главноей странице должен быть отображён список товаров;

Иммитация загрузки товаров с сервера:

• Необходимо иммитировать загрузку товаров с сервера c задержкой 1,5 секунды;
• Загрузка должна осуществляться из хранящегося в Local Storage браузера списка;
• Если списка товаров нет в LS, то первично загружать 5 товаров из заранее подготовленного файла db и после успешной загрузки сохранить их в LS (такое сохранение происходит один раз в случае, если товаров в LS нет).

Отображение списка товаров:

• Карточка одного товара должна содержать: title, description, price, кнопку "Удалить товар";
• Над списком товаров должно располагаться поле для ввода названия товара, поле для ввода описания товара, кнопка "Добавить товар";

Добавление нового товара:

• Поля обязательны для заполнения;
• Максимальное количество символов для названия товара: 30;
• Максимальное количество символов для описания товара товара: 150;
• При вводе невалидных данных под каждым полем должна отображаться соответствующая ошибка, поля с ошибкой должны подсвечиваться красным цветом;
• Валидация полей происходит при клике на кнопку "Добавить товар";
• После заполнения всех полей валидными значениями и клику на кнопку "Добавить товар" должно произойти добавление товара в список (после добавления товара/ров и последующей перезагрузки все товары должны загрузиться из LS);

Удаление товара:

• Должно происходить путём клика по соответствующей кнопке в карточке товара;
• После удаления товара/ров и последующей перезагрузки все оставшиеся товары должны загрузиться из LS;

Прочее:

• При отсутствии товаров должно отображаться сообщение - "Список товаров пуст";