From b480d9507b17b90493cd17fcb66149acb16d9e97 Mon Sep 17 00:00:00 2001
From: moshyfawn <email@moshyfawn.dev>
Date: Thu, 15 Jan 2026 11:06:12 +0000
Subject: [PATCH] appview: add reusable pagination template

Extract pagination UI into a shared template for reuse across pages. Refactored issues listing to use it with no behavior change

Signed-off-by: moshyfawn <email@moshyfawn.dev>
Signed-off-by: Seongmin Lee <git@boltless.me>
---
 appview/pages/templates/fragments/pagination.html | 95 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
 appview/pages/templates/repo/issues/issues.html | 113 ++++++++++-------------------------------------------------------------------------------------------------------
 2 file(s) changed, 105 insertion(s)(+), 103 deletion(s)(-)

diff --git a/appview/pages/templates/fragments/pagination.html b/appview/pages/templates/fragments/pagination.html
new file mode 100644
--- /dev/null
+++ b/appview/pages/templates/fragments/pagination.html
@@ -0,0 +1,95 @@
+{{ define "fragments/pagination" }}
+  {{/* Params: Page (pagination.Page), TotalCount (int), BasePath (string), QueryParams (string) */}}
+  {{ $page := .Page }}
+  {{ $totalCount := .TotalCount }}
+  {{ $basePath := .BasePath }}
+  {{ $queryParams := .QueryParams }}
+
+  {{ $prev := $page.Previous.Offset }}
+  {{ $next := $page.Next.Offset }}
+  {{ $lastPage := sub $totalCount (mod $totalCount $page.Limit) }}
+
+  <div class="flex justify-center items-center mt-4 gap-2">
+    <a
+      class="
+        btn flex items-center gap-2 no-underline hover:no-underline 
+        dark:text-white dark:hover:bg-gray-700
+        {{ if le $page.Offset 0 }}
+          cursor-not-allowed opacity-50
+        {{ end }}
+      "
+      {{ if gt $page.Offset 0 }}
+        hx-boost="true"
+        href="{{ $basePath }}?{{ $queryParams }}&offset={{ $prev }}&limit={{ $page.Limit }}"
+      {{ end }}
+    >
+      {{ i "chevron-left" "w-4 h-4" }}
+      previous
+    </a>
+
+    {{ if gt $page.Offset 0 }}
+      <a
+        hx-boost="true"
+        href="{{ $basePath }}?{{ $queryParams }}&offset=0&limit={{ $page.Limit }}"
+      >
+        1
+      </a>
+    {{ end }}
+
+    {{ if gt $prev $page.Limit }}
+      <span>...</span>
+    {{ end }}
+
+    {{ if gt $prev 0 }}
+      <a
+        hx-boost="true"
+        href="{{ $basePath }}?{{ $queryParams }}&offset={{ $prev }}&limit={{ $page.Limit }}"
+      >
+        {{ add (div $prev $page.Limit) 1 }}
+      </a>
+    {{ end }}
+
+    <span class="font-bold">
+      {{ add (div $page.Offset $page.Limit) 1 }}
+    </span>
+
+    {{ if lt $next $lastPage }}
+      <a
+        hx-boost="true"
+        href="{{ $basePath }}?{{ $queryParams }}&offset={{ $next }}&limit={{ $page.Limit }}"
+      >
+        {{ add (div $next $page.Limit) 1 }}
+      </a>
+    {{ end }}
+
+    {{ if lt $next (sub $totalCount (mul 2 $page.Limit)) }}
+      <span>...</span>
+    {{ end }}
+
+    {{ if lt $page.Offset $lastPage }} 
+      <a
+        hx-boost="true"
+        href="{{ $basePath }}?{{ $queryParams }}&offset={{ $lastPage }}&limit={{ $page.Limit }}"
+      >
+        {{ add (div $lastPage $page.Limit) 1 }}
+      </a>
+    {{ end }}
+
+    <a
+      class="
+        btn flex items-center gap-2 no-underline hover:no-underline 
+        dark:text-white dark:hover:bg-gray-700
+        {{ if lt $next $totalCount | not }}
+            cursor-not-allowed opacity-50
+        {{ end }}
+      "
+      {{ if lt $next $totalCount }}
+        hx-boost="true"
+        href="{{ $basePath }}?{{ $queryParams }}&offset={{ $next }}&limit={{ $page.Limit }}"
+      {{ end }}
+    >
+      next
+      {{ i "chevron-right" "w-4 h-4" }}
+    </a>
+  </div>
+{{ end }}
diff --git a/appview/pages/templates/repo/issues/issues.html b/appview/pages/templates/repo/issues/issues.html
--- a/appview/pages/templates/repo/issues/issues.html
+++ b/appview/pages/templates/repo/issues/issues.html
@@ -71,109 +71,16 @@ {{ define "repoAfter" }}
   <div class="mt-2">
     {{ template "repo/issues/fragments/issueListing" (dict "Issues" .Issues "RepoPrefix" .RepoInfo.FullName "LabelDefs" .LabelDefs) }}
   </div>
-  {{if gt .IssueCount .Page.Limit }} 
-    {{ block "pagination" . }} {{ end }} 
-  {{ end }}
-{{ end }}
-
-{{ define "pagination" }}
-<div class="flex justify-center items-center mt-4 gap-2">
-  {{ $currentState := "closed" }}
-  {{ if .FilteringByOpen }}
-    {{ $currentState = "open" }}
-  {{ end }}
-
-  {{ $prev := .Page.Previous.Offset }}
-  {{ $next := .Page.Next.Offset }}
-  {{ $lastPage := sub .IssueCount (mod .IssueCount .Page.Limit) }}
-
-  <a
-    class="
-      btn flex items-center gap-2 no-underline hover:no-underline 
-      dark:text-white dark:hover:bg-gray-700
-      {{ if le .Page.Offset 0 }}
-        cursor-not-allowed opacity-50
-      {{ end }}
-    "
-    {{ if gt .Page.Offset 0 }}
-      hx-boost="true"
-      href = "/{{ $.RepoInfo.FullName }}/issues?state={{ $currentState }}&q={{ .FilterQuery }}&offset={{ $prev }}&limit={{ .Page.Limit }}"
+  {{if gt .IssueCount .Page.Limit }}
+    {{ $state := "closed" }}
+    {{ if .FilteringByOpen }}
+      {{ $state = "open" }}
     {{ end }}
-  >
-    {{ i "chevron-left" "w-4 h-4" }}
-    previous
-  </a>
-
-  <!-- dont show first page if current page is first page -->
-  {{ if gt .Page.Offset 0 }}
-    <a
-      hx-boost="true"
-      href = "/{{ $.RepoInfo.FullName }}/issues?state={{ $currentState }}&q={{ .FilterQuery }}&offset=0&limit={{ .Page.Limit }}"
-    >
-      1
-    </a>
-  {{ end }}
-
-  <!-- if previous page is not first or second page (prev > limit) -->
-  {{ if gt $prev .Page.Limit }}
-    <span>...</span>
+    {{ template "fragments/pagination" (dict 
+        "Page" .Page 
+        "TotalCount" .IssueCount 
+        "BasePath" (printf "/%s/issues" .RepoInfo.FullName)
+        "QueryParams" (printf "state=%s&q=%s" $state .FilterQuery)
+    ) }}
   {{ end }}
-
-  <!-- if previous page is not the first page -->
-  {{ if gt $prev 0 }}
-    <a
-      hx-boost="true"
-      href = "/{{ $.RepoInfo.FullName }}/issues?state={{ $currentState }}&q={{ .FilterQuery }}&offset={{ $prev }}&limit={{ .Page.Limit }}"
-    >
-      {{ add (div $prev .Page.Limit) 1 }}
-    </a>
-  {{ end }}
-
-  <!-- current page. this is always visible -->
-  <span class="font-bold">
-    {{ add (div .Page.Offset .Page.Limit) 1 }}
-  </span>
-
-  <!-- if next page is not last page -->
-  {{ if lt $next $lastPage }}
-    <a
-      hx-boost="true"
-      href = "/{{ $.RepoInfo.FullName }}/issues?state={{ $currentState }}&q={{ .FilterQuery }}&offset={{ $next }}&limit={{ .Page.Limit }}"
-    >
-      {{ add (div $next .Page.Limit) 1 }}
-    </a>
-  {{ end }}
-
-  <!-- if next page is not second last or last page (next < issues - 2 * limit) -->
-  {{ if lt ($next) (sub .IssueCount (mul (2) .Page.Limit)) }}
-    <span>...</span>
-  {{ end }}
-
-  <!-- if its not the last page -->
-  {{ if lt .Page.Offset $lastPage }} 
-    <a
-      hx-boost="true"
-      href = "/{{ $.RepoInfo.FullName }}/issues?state={{ $currentState }}&q={{ .FilterQuery }}&offset={{ $lastPage }}&limit={{ .Page.Limit }}"
-    >
-      {{ add (div $lastPage .Page.Limit) 1 }}
-    </a>
-  {{ end }}
-
-  <a
-    class="
-      btn flex items-center gap-2 no-underline hover:no-underline 
-      dark:text-white dark:hover:bg-gray-700
-      {{ if ne (len .Issues) .Page.Limit }}
-          cursor-not-allowed opacity-50
-      {{ end }}
-    "
-    {{ if eq (len .Issues) .Page.Limit }}
-      hx-boost="true"
-      href="/{{ $.RepoInfo.FullName }}/issues?state={{ $currentState }}&q={{ .FilterQuery }}&offset={{ $next }}&limit={{ .Page.Limit }}"
-    {{ end }}
-  >
-    next
-    {{ i "chevron-right" "w-4 h-4" }}
-  </a>
-</div>
 {{ end }}

--
tangled.sh