"use client";
import React from "react";
import data from "../../util/blog.json";
import BlogCard2 from "@/components/blog/BlogCard2";
export default function BlogPost2() {
    const getAllBlogFunction = data.slice(0, 3);

    return (
        <>
            <section
                className="blog__post-area-two blog__post-bg-two"
                data-background="/assets/img/bg/blog_post_bg.jpg"
            >
                <div className="container">
                    <div className="row justify-content-center">
                        <div className="col-lg-6">
                            <div className="section-title text-center mb-50 tg-heading-subheading animation-style3">
                                <span className="sub-title">
                                    BLOG <span className="title-color">POSTS</span>
                                </span>
                                <h2 className="title tg-element-title">Helpful articles from Our Team</h2>
                            </div>
                        </div>
                    </div>
                    <div className="row justify-content-center blog-gap">
                        {getAllBlogFunction.map((item) => (
                            <React.Fragment key={item.id}>{<BlogCard2 item={item} />}</React.Fragment>
                        ))}
                    </div>
                </div>
                <div className="blog-shape-wrap">
                    <img src="/assets/img/images/blog_shape01.png" alt="" data-aos="fade-right" data-aos-delay={400} />
                    <img src="/assets/img/images/blog_shape02.png" alt="" data-aos="fade-left" data-aos-delay={400} />
                </div>
            </section>
        </>
    );
}