export const MobileFAQ = ({ faqs = [], defaultOpen = false }) => { const { isOn: open, toggle } = useToggle(defaultOpen); const ToggleIcon = open ? MinusIcon24Gray : PlusIcon24Gray; return ( <div className="p16"> <h4 className="section-text-5 mb16">Frequently asked questions</h4> {faqs.map((u, index) => ( <> <div className="faq-item" onClick={toggle}> <span className="c-black-3 text-medium">{u.question}</span> <div className="faq-toggle-icon-mobile"></div> </div> <Collapse in={open}> <div className="faq-answer c-black-3 text-4">{u.ans}</div> </Collapse> {index !== faqs.length - 1 && ( <div style={{ height: 1, width: '100%', backgroundColor: '#e6e6e6' }} className="mt12 mb16" /> )} </> ))} </div> ); };

Creé una matriz de preguntas frecuentes que muestra preguntas y respuestas al alternar, pero abre todos los índices que deberían aparecer como índices