Написать приложение, которое может выводить алерты на странице. Требования:
- На странице должен быть инпут и кнопка «Add alert»
- В инпут вводится текст, который добавится в алерт по нажатию кнопки
- Кнопка находится в состоянии disabled, если в ней нет текста
- После инициализации приложения и после нажатия на кнопку ставить фокус на инпуте (использовать refs!)
- Все алерты должны находится за пределами root’ового элемента, куда рендерится React
Подсказка: рендерить алерты нужно через портал в какой-нибудь
, но нужно написать HOC withPortal, c помощью которого можно будет любой компонент рендерить в любой dom элемент. Интерфейс этого HOC’а должен быть вот таким:withPortal(domElem)(Component)
Прилагаю демо видео, как оно должно работать: https://monosnap.com/file/91VkWwzMwWYB1gTQnLxDQVytVCIq66
Заливать решение нужно на Github + куда-то залить приложение для демо (github pages, heroku или что вам больше по душе. Важно, чтобы можно было запустить приложение)
Бонус задание: написать HOC для алерта, благодаря которому по истечение заданного в миллисекундах времени алерт будет исчезать Уточнение по поводу бонус задания: вам надо сделать HOC так, чтобы сам компонент алерта ничего не знал про то, что он может исчезнуть