первая реализация компонента всплывающих окон. Потом я отказался от хука и реализовал через контекст вроде бы. оставляю на случай если увидите упоминание по коду этого скрипта, но самого его не найдете и будете думать - ну что за мудак, не закоммитил скрипт

2026-04-11 21:08:37 +03:00
parent 4bacf61bf8
commit da6d13eab3
1 changed files with 32 additions and 0 deletions
@@ -0,0 +1,32 @@
 import { useState } from 'react';
 import { MagicPopupType } from '../../components/MagicPopupContainer';
 export const MagicPopupHook = () => {
  // //Стейт с набором попапов для отрисовки
  // const [popupArr, setPopupArr] = useState<MagicPopupType[] | []>( [] );
  // //ИСПОЛЬЗОВАНИЕ 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,
  // }
 }