web-next: paginar /changelogs (10 por página + navegación)

getCommits ahora recibe page/limit y devuelve {commits, totalPages} (del
header X-PageCount de Gitea). La página lee ?page, muestra 10 commits y usa
el componente Pagination (Anterior/1 2 3…/Siguiente).

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>

web-next/app/[locale]/changelogs/page.tsx

@@ -1,6 +1,7 @@
 import type { Metadata } from 'next'
 import { setRequestLocale } from 'next-intl/server'
 import { getCommits } from '@/lib/changelog'
+import { Pagination } from '@/components/Pagination'
 
 export const metadata: Metadata = { title: 'Changelogs' }
 
@@ -17,10 +18,18 @@ function formatFecha(iso: string): string {
   })
 }
 
-export default async function ChangelogsPage({ params }: { params: Promise<{ locale: string }> }) {
+export default async function ChangelogsPage({
+  params,
+  searchParams,
+}: {
+  params: Promise<{ locale: string }>
+  searchParams: Promise<{ page?: string }>
+}) {
   const { locale } = await params
+  const sp = await searchParams
+  const page = Math.max(1, Number(sp.page) || 1)
   setRequestLocale(locale)
-  const commits = await getCommits(50)
+  const { commits, totalPages } = await getCommits(page, 10)
 
   return (
     <div className="main-page">
@@ -52,9 +61,11 @@ export default async function ChangelogsPage({ params }: { params: Promise<{ loc
                       <br />
                     </div>
                   ))}
-                  <p className="centered third-brown">
+                  <Pagination
-                    <i>* Mostrando los últimos 50 cambios</i>
+                    page={page}
-                  </p>
+                    totalPages={totalPages}
+                    hrefFor={(p) => (p === 1 ? '/changelogs' : `/changelogs?page=${p}`)}
+                  />
                   <br />
                 </>
               )}

web-next/lib/changelog.ts

@@ -20,16 +20,17 @@ interface GiteaCommit {
   author?: { login?: string } | null
 }
 
-export async function getCommits(limit = 50): Promise<Commit[]> {
+export async function getCommits(page = 1, limit = 10): Promise<{ commits: Commit[]; totalPages: number }> {
   try {
-    const res = await fetch(`${GITEA}/api/v1/repos/${REPO}/commits?limit=${limit}`, {
+    const res = await fetch(`${GITEA}/api/v1/repos/${REPO}/commits?page=${page}&limit=${limit}`, {
       headers: { Accept: 'application/json' },
       // Cache corto para no golpear Gitea en cada visita.
       next: { revalidate: 300 },
     })
-    if (!res.ok) return []
+    if (!res.ok) return { commits: [], totalPages: 1 }
+    const totalPages = Math.max(1, Number(res.headers.get('x-pagecount') || '1'))
     const data = (await res.json()) as GiteaCommit[]
-    return data.map((c) => {
+    const commits = data.map((c) => {
       const msg = c.commit?.message ?? ''
       const lines = msg.split('\n')
       const title = lines[0].trim()
@@ -49,7 +50,8 @@ export async function getCommits(limit = 50): Promise<Commit[]> {
         url: c.html_url,
       }
     })
+    return { commits, totalPages }
   } catch {
-    return []
+    return { commits: [], totalPages: 1 }
   }
 }