64 lines
1.9 KiB
JavaScript
64 lines
1.9 KiB
JavaScript
'use client'
|
|
import Link from "next/link";
|
|
import Blogs from "@/utils/constant.utils";
|
|
|
|
const truncateWords = (text, limit) => {
|
|
const words = text.split(" ");
|
|
return words.length > limit ? words.slice(0, limit).join(" ") + " ..." : text;
|
|
};
|
|
|
|
const stripHtml = (html) => {
|
|
if (!html) return "";
|
|
return html.replace(/<[^>]*>/g, "");
|
|
};
|
|
|
|
export default function Blog() {
|
|
return (
|
|
<div className="sidebar-page-container">
|
|
<div className="auto-container">
|
|
<div className="row clearfix">
|
|
{Blogs.map((blog) => (
|
|
<div
|
|
key={blog.id}
|
|
className="col-lg-4 col-md-6 col-sm-12 mb-4"
|
|
>
|
|
<div className="blog-card rounded shadow-sm overflow-hidden">
|
|
{/* Blog Image */}
|
|
<div className="blog-image">
|
|
<img
|
|
src={blog.imageDetail}
|
|
alt={blog.title}
|
|
className="img-fluid w-100"
|
|
/>
|
|
</div>
|
|
|
|
{/* Blog Title */}
|
|
<div className="blog-content p-3">
|
|
<h3 className="mb-2 text-lg font-semibold blog-title-hover">
|
|
<Link href={`/blog/${blog.slug}`} className="blog-title-link">
|
|
{stripHtml(blog.title)}
|
|
</Link>
|
|
</h3>
|
|
|
|
{/* Blog Excerpt */}
|
|
<p className="text-gray-700 mb-3">
|
|
{truncateWords(stripHtml(blog.para))}
|
|
</p>
|
|
|
|
{/* Read More Button */}
|
|
<Link
|
|
href={`/blog/${blog.slug}`}
|
|
className="font-medium blog-title-link"
|
|
>
|
|
Read More
|
|
</Link>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
))}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|