import React from "react";
import style from "./whyus.module.css";
import NextImage from "@/other/NextImage";

const WhyUs = ({ siteText }) => {
  return (
    <React.Fragment>
      <div className={`${style.whyus} container`}>
        <div className={style.whyus_main}>
          {siteText &&
            siteText.content &&
            siteText.content.length > 0 &&
            siteText.content.map((item, index) => (
              <div className={style.whyus_item} key={index}>
                <NextImage
                  src={
                    item.includes("title[") &&
                    item.split("image[")[1].split("]")[0]
                  }
                />
                <div>
                  <div className={style.whyus_title}>
                    {item.includes("title[") &&
                      item.split("title[")[1].split("]")[0]}
                  </div>
                  <div className={style.whyus_subtitle}>
                    {item.includes("subtitle[") &&
                      item.split("subtitle[")[1].split("]")[0]}
                  </div>
                </div>
              </div>
            ))}
        </div>
      </div>
    </React.Fragment>
  );
};

export default WhyUs;
