38 lines
1.0 KiB
TypeScript
38 lines
1.0 KiB
TypeScript
"use client";
|
|
|
|
import { useState } from "react";
|
|
import { faqs } from "@/data/pages";
|
|
import styles from "@/app/contact/contact.module.css";
|
|
|
|
export default function ContactFaq() {
|
|
const [open, setOpen] = useState(0);
|
|
|
|
return (
|
|
<div className={styles.faqList}>
|
|
{faqs.map((item, index) => {
|
|
const active = open === index;
|
|
return (
|
|
<div className={styles.faqItem} key={`${item.question}-${index}`}>
|
|
<button
|
|
type="button"
|
|
className={styles.faqTrigger}
|
|
aria-expanded={active}
|
|
onClick={() => setOpen(active ? -1 : index)}
|
|
>
|
|
<span>{item.question}</span>
|
|
<img
|
|
className={active ? styles.faqOpen : styles.faqClosed}
|
|
src="/images/icons/chevron.svg"
|
|
alt=""
|
|
width={10}
|
|
height={18}
|
|
/>
|
|
</button>
|
|
{active ? <p className={styles.faqAnswer}>{item.answer}</p> : null}
|
|
</div>
|
|
);
|
|
})}
|
|
</div>
|
|
);
|
|
}
|