feat: display labels on bugs list page

Amolith and Crush created 2 weeks ago

Add label rendering to bug list items matching the
individual bug page styling. Include 'Labels:' prefix on
bug detail page for clarity.

Implements: bug-4a60415
Co-authored-by: Crush <[e-mail]>

Change summary

pkg/web/static/overrides.css | 1 +
pkg/web/templates/base.html  | 2 +-
pkg/web/templates/bug.html   | 2 +-
pkg/web/templates/bugs.html  | 1 +
pkg/web/webui_bugs.go        | 7 +++++++
5 files changed, 11 insertions(+), 2 deletions(-)

Detailed changes

pkg/web/static/overrides.css

@@ -180,6 +180,7 @@ article > p:only-child {
 	font-weight: 600;
 	line-height: 1;
 	border-radius: 0.25rem;
+	vertical-align: middle;
 	background-color: color-mix(in srgb, var(--label-color) 20%, var(--pico-card-background-color));
 	border: 2px solid color-mix(in srgb, var(--label-color) 40%, var(--pico-card-background-color));
 	color: var(--pico-color);

pkg/web/templates/base.html

@@ -16,7 +16,7 @@
   <link rel="preload" href="/static/overrides.css?v=2" as="style">
 
   <link rel="stylesheet" href="/static/pico-2.1.1-pink.min.css">
-  <link rel="stylesheet" href="/static/overrides.css?v=2">
+  <link rel="stylesheet" href="/static/overrides.css?v=3">
   <link rel="stylesheet" href="/static/syntax.css?v=1">
 
   {{block "page-styles" .}}{{end}}

pkg/web/templates/bug.html

@@ -23,7 +23,7 @@
   </h2>
   {{if .Labels}}
   <p>
-    {{range $i, $label := .Labels}}{{if $i}} {{end}}<span class="bug-label" style="--label-color: {{$label.Color}}">{{$label.Name}}</span>{{end}}
+    Labels: {{range $i, $label := .Labels}}{{if $i}} {{end}}<span class="bug-label" style="--label-color: {{$label.Color}}">{{$label.Name}}</span>{{end}}
   </p>
   {{end}}
 </header>

pkg/web/templates/bugs.html

@@ -28,6 +28,7 @@
       {{end}}
       <code><a href="/{{$.Repo.Name}}/bug/{{.FullID}}">{{.ID}}</a></code>
       {{.Title}}
+      {{if .Labels}}{{range $i, $label := .Labels}}{{if $i}} {{end}}<span class="bug-label" style="--label-color: {{$label.Color}}">{{$label.Name}}</span>{{end}}{{end}}
     </h3>
      <footer>
        {{if .AuthorAvatar}}<img src="{{.AuthorAvatar}}" alt="" class="avatar" loading="lazy" referrerpolicy="no-referrer">{{end}}<strong>{{.Author}}</strong> opened <time datetime="{{.CreatedAt | rfc3339}}" data-tooltip="{{.CreatedAt | formatDate}}">{{.CreatedAt | relativeTime}}</time>

pkg/web/webui_bugs.go

@@ -42,6 +42,7 @@ type BugListItem struct {
 	LastActivity time.Time
 	HasActivity  bool
 	CommentCount int
+	Labels       []Label
 }
 
 type BugData struct {
@@ -123,6 +124,11 @@ func getBugsList(rc *cache.RepoCache, status string) ([]BugListItem, error) {
 			continue
 		}
 
+		labels := make([]Label, len(snap.Labels))
+		for i, label := range snap.Labels {
+			labels[i] = labelToWebLabel(label)
+		}
+
 		bugs = append(bugs, BugListItem{
 			ID:           snap.Id().Human(),
 			FullID:       snap.Id().String(),
@@ -134,6 +140,7 @@ func getBugsList(rc *cache.RepoCache, status string) ([]BugListItem, error) {
 			LastActivity: getLastActivity(snap),
 			HasActivity:  len(snap.Timeline) > 1,
 			CommentCount: countComments(snap),
+			Labels:       labels,
 		})
 	}