39 lines
868 B
TypeScript
39 lines
868 B
TypeScript
'use client';
|
|
|
|
import { usePaginatedQuery } from 'convex/react';
|
|
import { api } from '../../convex/_generated/api';
|
|
import { Doc } from '../../convex/_generated/dataModel';
|
|
import Post from './Post';
|
|
|
|
export default function UserPosts({ user }: { user: Doc<'users'> }) {
|
|
const PAGE_SIZE = 10;
|
|
const pager = usePaginatedQuery(
|
|
api.posts.getUsersPostById,
|
|
{
|
|
userId: user._id,
|
|
},
|
|
{ initialNumItems: 10 }
|
|
);
|
|
|
|
return (
|
|
<div className='flex flex-col w-full h-full'>
|
|
{pager.results.map(post => (
|
|
<Post
|
|
key={post._id}
|
|
post={post}
|
|
/>
|
|
))}
|
|
{pager.isLoading ? (
|
|
<div>Loading...</div>
|
|
) : (
|
|
<button
|
|
onClick={() => pager.loadMore(10)}
|
|
disabled={pager.status !== 'CanLoadMore'}
|
|
>
|
|
Load More
|
|
</button>
|
|
)}
|
|
</div>
|
|
);
|
|
}
|