import { Post } from '../model/posts/posts.ts'
import PostItem from './PostItem'

interface PostsFeedProps {
  pages: Post[][]
}

export default function PostsList({ pages }: PostsFeedProps) {
  return <div className="flex flex-col gap-6 w-full">{pages.map(renderPage)}</div>
}

function renderPage(posts: Post[]) {
  return (
    <div className="flex flex-col gap-6 w-full">
      {posts.map((post, idx) => (
        <PostItem key={post.postId} post={post} index={idx} />
      ))}
    </div>
  )
}