"use client";
import React, { FC, ReactNode } from "react";
import styles from "@/styles/Component/AboutCarBaba/AboutCarBabaInfo.module.scss";
import { Figure, Image } from "react-bootstrap";

interface AboutCarBabaInfoProps {
  heading?: string;
  paragraph?: ReactNode;
  image?: string;
}

const AboutCarBabaInfo: FC<AboutCarBabaInfoProps> = ({
  heading,
  paragraph,
  image
}) => {
  return (
    <div className={`${styles.AboutCarBabaInfoCard} d-flex`}>
      {image && (
        <Figure>
          <Image
            src={image}
            alt={heading || "Development Service Image"}
            fluid
          />
        </Figure>
      )}
      <div className={styles.AboutCarBabaInfoCardRight}>
        {heading && <span>{heading}</span>}
        {paragraph && <p>{paragraph}</p>}
      </div>
    </div>
  );
};

export default AboutCarBabaInfo;