LaLiga-FrontEnd/src/components/molecules/CardList.tsx

49 lines
1.5 KiB
TypeScript

import { usePostContext } from '@/context/PostContext'
import { Card } from './Card'
import Pagination from './Pagination'
export function CardList({ page, cat, count }: any) {
// const [dataCards, setDataCards] = useState<Post[]>([])
// const [countN, setCount] = useState<number>(count)
const { postData, updatePostData } = usePostContext()
// const getData = async (page: any, cat: any) => {
// console.log('funciona')
// try {
// const response = await fetch(`http://localhost:3000/api/posts?page=${page || 1}&cat=${cat || ''}`, {
// cache: 'no-store'
// })
// console.log(response)
// if (!response.ok) {
// throw new Error('Failed')
// }
// const result = await response.json()
// updatePostData(result.posts)
// // setCount(result.count)
// } catch (error) {
// console.error(error)
// }
// }
// useEffect(() => {
// getData(page, cat)
// }, [page, cat])
// NO LO TENGO MUY CLARO PERO CREO QUE ESTO NO ME HACE FALTA, TENGO QUE REVISARLO CON CALMA
const POST_PER_PAGE = 4
const hasPrev = POST_PER_PAGE * (page - 1) > 0
const hasNext = POST_PER_PAGE * (page - 1) + POST_PER_PAGE < count
return (
<>
<div className="flex flex-col ">
{Array.isArray(postData) && postData?.map((item) => <Card {...item} post={item} key={item.id} />)}
</div>
<div className="py-4">
<Pagination page={page} hasPrev={hasPrev} hasNext={hasNext} />
</div>
</>
)
}