import Title from "@/components/Title";
import styles from "./styles.module.css";
import Question from "./Question";
import { questionsMike } from "@/data/oftenAsk";
import { ReactNode } from "react";

interface IOftenAsk {
  title?: ReactNode | string;
}
function OftenAsk({ title }: IOftenAsk) {
  return (
    <>
      {typeof title === "string" ? (
        <Title variant="h2" className={styles.title}>
          {title}
        </Title>
      ) : (
        title
      )}
      <ul className={styles.questions}>
        {questionsMike.map((question, index) => (
          <li key={index}>
            <Question {...question} />
          </li>
        ))}
      </ul>
    </>
  );
}

export default OftenAsk;
