Pager.tsx 800 B

12345678910111213141516171819202122232425262728
  1. 'use client';
  2. import { useRouter } from 'next/navigation';
  3. import Pagination from '@/app/component/Pagination';
  4. type Props = {
  5. total: number;
  6. page: number;
  7. perPage: number;
  8. // 이동 대상 경로 + 유지할 쿼리 (page 는 자동 갱신)
  9. basePath: string;
  10. query?: Record<string, string>;
  11. };
  12. // SSR 목록 페이지용 페이저 — 기존 Pagination(onChange 콜백형)을 router.push 로 연결
  13. export default function Pager({ total, page, perPage, basePath, query }: Props) {
  14. const router = useRouter();
  15. const handleChange = (next: number) => {
  16. const params = new URLSearchParams(query);
  17. params.set('page', String(next));
  18. router.push(`${basePath}?${params.toString()}`);
  19. };
  20. return (
  21. <Pagination total={total} page={page} perPage={perPage} onChange={handleChange} />
  22. );
  23. }