import { useState } from 'react'; import { MagicPopupType } from '../../components/MagicPopupContainer'; export const MagicPopupHook = () => { // //Стейт с набором попапов для отрисовки // const [popupArr, setPopupArr] = useState( [] ); // //ИСПОЛЬЗОВАНИЕ USECALLBACK? я не использую его для функций удаления и добавления новых попапов в этом хуке, что должно приводить к созданию новых экземпляров функций каждый вызов хука (удаление, добавления попапа). Функция добавления попапа является пропсом для TaxiForm, значит, содание нового экземпляра функции добавления попапа в хуке должно вызывать перерендер TaxiForm? Но я его не замечаю (нет мигания в дом дереве элемента где рендерится TaxiForm ни при создании, не при удалении попапа) // //Колбэк для добавление нового попапа. Его нужно передавать в каждый компонент, где планируется вызывать попапы. В аргументы этого колбэка передаются объекты с информацией для каждого попапа (текст, таймер и т.д.) // function addPopup (newPopupArrData: MagicPopupType[]) { // setPopupArr(prev => { // //Конкатенируем предыдущее состояние набора попапов и новые попапы, присваивая новому попапу параметр id с уникальным рандомным значением // return [...prev, ...newPopupArrData].map(popup => popup.id ? popup : {...popup, id: getRandomId()}) // }); // }; // //Колбэк для удаления попапа из набора // function delPopup (popupDelKey: number) { // setPopupArr(prev => { // return prev.filter(popup => popup.id !== popupDelKey); // }); // }; // //Функция генерации случайного числа для формирования на его основе уникального идентификатора для каждого компонента попаппа // function getRandomId(): number { return Date.now() - Math.random() }; // return { // popupArr, // addPopup, // delPopup, // } }