Меню аккордеон закрывает остальные вкладки. Как измменить логику и закрывать их при повторном нажатии?

Реализовал логику для Menu Accordeon при котором открывается только одна вкладка при нажатии, а остальные закрыты. Не могли бы подсказать, какая логика должна быть, если мне надо закрывать вкладки только при повторном нажатии вкладки. Чтобы можно было открыть все меню?

Сделал логику функции toggleItem, как мне показалось рабочая, но результат не изменился - открывается по одному.

вот код который я написал для Одиночный вкладок:

const AccordionMultiMenu = ({ accordionConData }) => {
    const [openIndex, setOpenIndex] = useState(true)

    const contentRefs = useRef([])

    useEffect(() => { //
        contentRefs.current = contentRefs.current.slice(0, accordionConData.length)
    }, [accordionConData])

    const toggleItem = (index) => {
         setOpenIndex(openIndex === index ? null : index)
        // setOpenIndex(false)
    }

    return (
        <>
            <div className={styles.accordionMulti}>
                {accordionConData.map((elem, i) => (
                    <div key={i}>

                        <div className={styles.listHead} onClick={() => toggleItem(i)}>
                            <h2>{elem.categoryName}</h2>
                            <span>a</span>
                        </div>

                        <ul
                            className={ openIndex === i ? styles.listItemOpen : styles.listItemClose }
                            style={{ height: openIndex  ? `${contentRefs.current.scrollHeight}px` : '0px', }}
                            ref={contentRefs.current.scrollHeight}
                        >

                            {elem.products.map((item, j) => (
                                <li key={j} className={styles.itemList}>
                                    {item.brandName}
                                </li>
                            ))}

                        </ul>
                    </div>
                ))}
            </div>
        </>
    )
}

export default AccordionMultiMenu

Благодарю за подсказки/помощь


Ответы (0 шт):