items[id] is not a function TypeError: items[id] is not a function

[Pedro-Goncal]

Hi guys, I am getting this error.

items[id] is not a function TypeError: items[id] is not a function at http://localhost:3000/static/js/src_pages_BooksPage_BookPage_BookPage_js.chunk.js:1301:26 at NodeList.forEach (<anonymous>) at HTMLDivElement.showAccordion

I have a few nested Accordion Items, and this behavior only happens when I go to the 4th item, and then try and click on the Second item (second item only) it pops this error.
It does not happen with any-other item , and only when I go to the third item or fourth item.

[NathGtle]

Hi !

Have you found a solution to this problem? I have exactly the same problem but no matter the element I can't open two of them

[onesine]

Hi @Pedro-Goncal, @NathGtle 👋

Sorry for the delay @Pedro-Goncal

Thank you for your feedback.

Can you please show me your code. I want to be able to reproduce the bug to fix it.

[NathGtle]

        <Accordion transition={{duration: "300ms", timingFunction: "cubic-bezier(0, 0, 0.2, 1)"}}>
          {data.sort((a, b) => a.order - b.order).map((routine) => (
            <AccordionItem key={routine.id}>
              {({ open }) => (
                <>
                  <AccordionHeader className={styles.accordionHeader}>
                    <i className="fa-solid fa-chevron-right chevron-color fa-xl" style={open ? {transform: 'rotate(90deg)'} : null}></i>
                    <p className={styles.Routines_routine_description}>
                      {routine.description_actual}
                    </p>
                  </AccordionHeader>
                  <AccordionBody>
                    <div className={styles.Exercices_container}>
                      {routine.exercices_data.map((exercice) => (
                        <p key={exercice.id}>{exercice.name}</p>
                      ))}
                    </div>
                  </AccordionBody>
                </>
              )}
            </AccordionItem>
          ))}
        </Accordion>    

Hi,

Here it is

[NathGtle]

@onesine I followed you on twitter it may be easier to communicate and we will post the solution here

[onesine]

OK @NathGtle, we do it like this

[Pedro-Goncal]

Hi @onesine thank you for getting back.

No worries. I ended up just implementing my own Accordion, I could not figure out why the issue was happening.