import { Image } from "antd";
import React from "react";
import { NavLink } from "react-router-dom";

/**
 * Represents the NewsCard component
 * @param newsData
 * @module NewsCard
 * @returns {JSX.Element}
 */
const NewsCard = ({ newsData }) => {
  return (
    <div className="news-card relative ">
      <NavLink to={`../news/newspage/${newsData?.id}`}>
        <div className=" news_card_wrapper "></div>
      </NavLink>
      {/* Left side with thumbnail image */}
      <div className="thumbnail relative z-10">
        <Image
          src={newsData.image}
          height={100}
          width={100}
          alt="News Thumbnail"
        />
      </div>

      {/* Right side with news title and content */}
      <div className="news-content">
        <h3 className="news-title">{newsData?.title || ""}</h3>
        {/* <p className="news-description clamped-text">Lorem ipsum dolor sit amet consectetur adipisicing elit. Perspiciatis voluptas itaque ullam excepturi iste?</p> */}
        <p>{newsData.created_at}</p>
      </div>
    </div>
  );
};

export default NewsCard;