Add webhook name field to improve webhook identification (#37025) (#37040)

Add an optional Name field to webhooks so users can give them
human-readable labels instead of relying only on URLs. The webhook
overview page now displays names when available, or falls back to the
URL for unnamed webhooks.

Fixes #37025

---------

Co-authored-by: wxiaoguang <wxiaoguang@gmail.com>

templates/repo/settings/webhook/base_list.tmpl

@@ -14,7 +14,8 @@
 			<div class="item">
 				<span class="{{if eq .LastStatus 1}}tw-text-green{{else if eq .LastStatus 2}}tw-text-red{{else}}tw-text-text-light{{end}}">{{svg "octicon-dot-fill" 22}}</span>
 				<div class="gt-ellipsis tw-flex-1">
-					<a title="{{.URL}}" href="{{$.BaseLink}}/{{.ID}}">{{.URL}}</a>
+					<a title="{{.URL}}" href="{{$.BaseLink}}/{{.ID}}">{{or .Name (ctx.Locale.Tr "repo.settings.webhook.name_empty")}}</a>
+					<span class="tw-ml-2 tw-text-grey-light">{{.URL}}</span>
 				</div>
 				<a class="muted tw-p-2" href="{{$.BaseLink}}/{{.ID}}">{{svg "octicon-pencil"}}</a>
 				<a class="tw-text-red tw-p-2 link-action"

templates/repo/settings/webhook/settings.tmpl

@@ -6,6 +6,12 @@
 */}}
 {{$isNew := not .Webhook.ID}}
 
+<div class="field">
+	<label>{{ctx.Locale.Tr "repo.settings.webhook.name"}}</label>
+	<input name="name" type="text" value="{{.Webhook.Name}}" maxlength="255">
+	<p class="help">{{ctx.Locale.Tr "repo.settings.webhook.name_helper"}}</p>
+</div>
+
 <div class="inline field">
 	<div class="ui checkbox">
 		<input name="active" type="checkbox" {{if or $isNew .Webhook.IsActive}}checked{{end}}>