From f7ac5765ea4318ea9bb2cddc41c6a4add06e8aae Mon Sep 17 00:00:00 2001
From: Anirudh Oppiliappan <anirudh@tangled.org>
Date: Tue, 17 Feb 2026 14:11:04 +0200
Subject: [PATCH] appview/pages: list webhook deliveries in repo settings

Signed-off-by: Anirudh Oppiliappan <anirudh@tangled.org>
---
 appview/pages/pages.go                        | 26 +++++--
 .../settings/fragments/webhookDeliveries.html | 74 +++++++++++++++++++
 .../pages/templates/repo/settings/hooks.html  | 72 +++++++++++++++++-
 3 files changed, 166 insertions(+), 6 deletions(-)
 create mode 100644 appview/pages/templates/repo/settings/fragments/webhookDeliveries.html

diff --git a/appview/pages/pages.go b/appview/pages/pages.go
index 82ad0b2a..4b77b34c 100644
--- a/appview/pages/pages.go
+++ b/appview/pages/pages.go
@@ -965,11 +965,12 @@ func (p *Pages) RepoPipelineSettings(w io.Writer, params RepoPipelineSettingsPar
 }
 
 type RepoWebhooksSettingsParams struct {
-	LoggedInUser *oauth.MultiAccountUser
-	RepoInfo     repoinfo.RepoInfo
-	Active       string
-	Tab          string
-	Webhooks     []models.Webhook
+	LoggedInUser      *oauth.MultiAccountUser
+	RepoInfo          repoinfo.RepoInfo
+	Active            string
+	Tab               string
+	Webhooks          []models.Webhook
+	WebhookDeliveries map[int64][]models.WebhookDelivery
 }
 
 func (p *Pages) RepoWebhooksSettings(w io.Writer, params RepoWebhooksSettingsParams) error {
@@ -978,6 +979,21 @@ func (p *Pages) RepoWebhooksSettings(w io.Writer, params RepoWebhooksSettingsPar
 	return p.executeRepo("repo/settings/hooks", w, params)
 }
 
+type WebhookDeliveriesListParams struct {
+	LoggedInUser *oauth.MultiAccountUser
+	RepoInfo     repoinfo.RepoInfo
+	Webhook      *models.Webhook
+	Deliveries   []models.WebhookDelivery
+}
+
+func (p *Pages) WebhookDeliveriesList(w io.Writer, params WebhookDeliveriesListParams) error {
+	tpl, err := p.parse("repo/settings/fragments/webhookDeliveries")
+	if err != nil {
+		return err
+	}
+	return tpl.ExecuteTemplate(w, "repo/settings/fragments/webhookDeliveries", params)
+}
+
 type RepoIssuesParams struct {
 	LoggedInUser *oauth.MultiAccountUser
 	RepoInfo     repoinfo.RepoInfo
diff --git a/appview/pages/templates/repo/settings/fragments/webhookDeliveries.html b/appview/pages/templates/repo/settings/fragments/webhookDeliveries.html
new file mode 100644
index 00000000..f097d651
--- /dev/null
+++ b/appview/pages/templates/repo/settings/fragments/webhookDeliveries.html
@@ -0,0 +1,74 @@
+{{define "repo/settings/fragments/webhookDeliveries"}}
+<div class="flex flex-col gap-4">
+  <div class="flex items-center justify-between">
+    <h3 class="text-lg font-bold uppercase text-sm">Recent Deliveries</h3>
+    <button
+      type="button"
+      onclick="this.closest('[popover]').hidePopover()"
+      class="btn text-sm flex items-center gap-1"
+    >
+      {{ i "x" "size-4" }} close
+    </button>
+  </div>
+
+  <div class="text-sm text-gray-600 dark:text-gray-400">
+    <span class="font-mono break-all">{{ .Webhook.Url }}</span>
+  </div>
+
+  {{ if .Deliveries }}
+    <div class="flex flex-col divide-y divide-gray-200 dark:divide-gray-700 border border-gray-200 dark:border-gray-700 rounded max-h-[60vh] overflow-y-auto">
+      {{ range .Deliveries }}
+        <details class="group">
+          <summary class="p-4 hover:bg-gray-50 dark:hover:bg-gray-800 cursor-pointer list-none">
+            <div class="flex items-center gap-2 mb-2">
+              {{ if .Success }}
+                <span class="inline-flex items-center gap-1 px-2 py-1 text-xs rounded bg-green-100 text-green-800 dark:bg-green-900 dark:text-green-200">
+                  {{ i "circle-check" "size-3" }}
+                  {{ .ResponseCode }}
+                </span>
+              {{ else }}
+                <span class="inline-flex items-center gap-1 px-2 py-1 text-xs rounded bg-red-100 text-red-800 dark:bg-red-900 dark:text-red-200">
+                  {{ i "circle-x" "size-3" }}
+                  {{ if .ResponseCode }}{{ .ResponseCode }}{{ else }}failed{{ end }}
+                </span>
+              {{ end }}
+              <span class="text-xs text-gray-500 dark:text-gray-400 font-mono">
+                {{ .DeliveryId }}
+              </span>
+              <span class="ml-auto text-xs text-gray-400 dark:text-gray-500 group-open:rotate-180 transition-transform">
+                {{ i "chevron-down" "size-4" }}
+              </span>
+            </div>
+            <div class="text-sm text-gray-700 dark:text-gray-300 mb-1">
+              <span class="font-semibold">Event:</span> {{ .Event }}
+            </div>
+            <div class="text-xs text-gray-500 dark:text-gray-400">
+              {{ .CreatedAt.Format "2006-01-02 15:04:05 MST" }}
+            </div>
+          </summary>
+
+          <div class="px-4 pb-4 pt-2 bg-gray-50 dark:bg-gray-800/50">
+            <div class="flex flex-col gap-3 text-sm">
+              <div class="flex flex-col gap-2">
+                <h5 class="font-semibold text-gray-700 dark:text-gray-300">Request Body</h5>
+                <pre class="bg-white dark:bg-gray-900 p-3 rounded text-xs overflow-x-auto border border-gray-200 dark:border-gray-700">{{ .RequestBody }}</pre>
+              </div>
+
+              {{ if .ResponseBody }}
+                <div class="flex flex-col gap-2">
+                  <h5 class="font-semibold text-gray-700 dark:text-gray-300">Response Body</h5>
+                  <pre class="bg-white dark:bg-gray-900 p-3 rounded text-xs overflow-x-auto border border-gray-200 dark:border-gray-700">{{ .ResponseBody }}</pre>
+                </div>
+              {{ end }}
+            </div>
+          </div>
+        </details>
+      {{ end }}
+    </div>
+  {{ else }}
+    <div class="flex items-center justify-center p-8 text-gray-500 dark:text-gray-400 border border-gray-200 dark:border-gray-700 rounded">
+      No deliveries yet
+    </div>
+  {{ end }}
+</div>
+{{end}}
diff --git a/appview/pages/templates/repo/settings/hooks.html b/appview/pages/templates/repo/settings/hooks.html
index c4e84604..c0446dde 100644
--- a/appview/pages/templates/repo/settings/hooks.html
+++ b/appview/pages/templates/repo/settings/hooks.html
@@ -82,8 +82,9 @@
             </div>
           {{ end }}
         </div>
+
         {{ if $.RepoInfo.Roles.IsOwner }}
-        <div class="flex items-center">
+        <div class="flex items-center mt-2">
           <label class="flex items-center gap-2 cursor-pointer">
             <input
               type="checkbox"
@@ -95,6 +96,75 @@
             <span class="text-sm">Active</span>
           </label>
         </div>
+        {{ end }}
+
+        <!-- Recent Deliveries -->
+        {{ $deliveries := index $.WebhookDeliveries .Id }}
+        {{ if $deliveries }}
+          <div class="mt-3 border-t border-gray-200 dark:border-gray-700 pt-3">
+            <div class="flex items-center justify-between mb-2">
+              <h4 class="text-sm font-semibold text-gray-700 dark:text-gray-300 uppercase">Recent Deliveries</h4>
+            </div>
+            <div class="flex flex-col gap-2">
+              {{ range $deliveries }}
+                <div class="flex items-center gap-3 text-xs p-2 bg-gray-50 dark:bg-gray-800 rounded">
+                  {{ if .Success }}
+                    <span class="inline-flex items-center gap-1 px-2 py-0.5 rounded bg-green-100 text-green-800 dark:bg-green-900 dark:text-green-200">
+                      {{ i "circle-check" "size-3" }}
+                      {{ .ResponseCode }}
+                    </span>
+                  {{ else }}
+                    <span class="inline-flex items-center gap-1 px-2 py-0.5 rounded bg-red-100 text-red-800 dark:bg-red-900 dark:text-red-200">
+                      {{ i "circle-x" "size-3" }}
+                      {{ if .ResponseCode }}{{ .ResponseCode }}{{ else }}failed{{ end }}
+                    </span>
+                  {{ end }}
+                  <span class="flex-1 font-mono text-gray-600 dark:text-gray-400 truncate">
+                    {{ .DeliveryId }}
+                  </span>
+                  <span class="text-gray-500 dark:text-gray-400">
+                    {{ .Event }}
+                  </span>
+                  <span class="text-gray-500 dark:text-gray-400 whitespace-nowrap">
+                    {{ .CreatedAt.Format "Jan 02, 15:04" }}
+                  </span>
+                </div>
+              {{ end }}
+            </div>
+            <div class="mt-2">
+              <button
+                class="btn text-xs flex items-center gap-1"
+                hx-get="/{{ $.RepoInfo.FullName }}/settings/hooks/{{ .Id }}/deliveries"
+                hx-target="#webhook-deliveries-modal-{{ .Id }}"
+                hx-swap="innerHTML"
+                popovertarget="webhook-deliveries-modal-{{ .Id }}"
+                popovertargetaction="toggle"
+              >
+                {{ i "list" "size-3" }}
+                show all
+              </button>
+            </div>
+          </div>
+        {{ else }}
+          <div class="mt-3 border-t border-gray-200 dark:border-gray-700 pt-3">
+            <div class="text-xs text-gray-500 dark:text-gray-400 text-center py-2">
+              No deliveries yet
+            </div>
+          </div>
+        {{ end }}
+
+        <!-- Deliveries Modal -->
+        <div
+          id="webhook-deliveries-modal-{{ .Id }}"
+          popover
+          class="bg-white w-full sm:w-[50rem] dark:bg-gray-800 p-6 max-h-dvh overflow-y-auto rounded border border-gray-200 dark:border-gray-700 drop-shadow dark:text-white backdrop:bg-gray-400/50 dark:backdrop:bg-gray-800/50"
+        >
+          <div class="flex items-center justify-center p-4">
+            {{ i "loader-circle" "size-6 animate-spin" }}
+          </div>
+        </div>
+
+        {{ if $.RepoInfo.Roles.IsOwner }}
         <div
           id="edit-webhook-modal-{{.Id}}"
           popover
-- 
2.51.2