react active map 아코디언

faq 아코디언 기능 구현하는데 하나씩만 펼쳐지게 하고 싶었다.

const handleToggle = (index: number) => {
  set_faq_active((prevIndex:any) => (prevIndex === index ? -1 : index));
};
{faqData .map((faq, index) => (
            <li key={index}   className={`faq ${faq_active === index ? "active" : ""}`}>
              <h2
                  className={'faq_question'}
                  onClick={() => handleToggle(index)}
              >
                {faq.question}
              </h2>
              <div className={'faq_answer'}>
                <p>{faq.answer}</p>
              </div>
            </li>
        ))}