29 lines
816 B
TypeScript
29 lines
816 B
TypeScript
import { useRef } from 'react'
|
|
import { useIntersectionLoad } from '../../../hooks/useIntersectionLoad.ts'
|
|
import { Post } from '../posts/posts.ts'
|
|
import PostItem from './PostItem.tsx'
|
|
|
|
interface FeedViewProps {
|
|
pages: Post[][]
|
|
onLoadMore: () => Promise<void>
|
|
}
|
|
|
|
export default function FeedView({ pages, onLoadMore }: FeedViewProps) {
|
|
const sentinelRef = useRef<HTMLDivElement | null>(null)
|
|
const posts = pages.flat()
|
|
|
|
useIntersectionLoad(onLoadMore, sentinelRef)
|
|
|
|
return (
|
|
<div className="w-full">
|
|
<div className="flex flex-col gap-6 w-full">
|
|
<div className="flex flex-col gap-6 w-full">
|
|
{posts.map((post) => (
|
|
<PostItem key={post.postId} post={post} />
|
|
))}
|
|
</div>
|
|
</div>
|
|
<div ref={sentinelRef} className="h-1" />
|
|
</div>
|
|
)
|
|
}
|