import { LoaderProp, PostItem } from '../../types';
import LatestPostsListSection from '../LatestPost/LatestPostsListSection';


import PostsList from './PostsList';
import { useTranslation } from 'next-i18next';



const PostsListSection = (props: any) => {

    const { posts } = props;
    const { postsListName } = props;
    const { latestNewsPost } =  props;
    const { pageCount } =  props;
    const { t } = useTranslation('common'); // Specify the namespace if you use one
    const LatestPostName = t('latestNews'); 

    const loaderProp = ({ src }: LoaderProp): string => {
        return src;
      };
      
 
     

    return (
        <>
    <section className="bg-gradient-to-t from-white/60 to-transparent pt-28  py-12 dark:bg-none lg:py-36">
        <div className="container">
            <div className="flex flex-col lg:items-start items-center gap-5 lg:flex-row" data-aos="fade-up" data-aos-duration="1000">

                <PostsList posts={posts} postsListName={postsListName} pageCount={pageCount} />
           
                <LatestPostsListSection postsByCategory={latestNewsPost} latestPostsName={LatestPostName} />
            </div>
        </div>
    </section>
        </>
    
     
    );
};

export default PostsListSection;