From f1fefc308fc6c9bcf6ace373f9fde0e2df73d57c Mon Sep 17 00:00:00 2001
From: eti <eti@eti.tf>
Date: Tue, 18 Aug 2026 18:53:28 +0200
Subject: [PATCH] appview/comments: show react button at the end of long
 comments

show the reaction button after the body of long comments.
also, show the reaction button without hover on mobile devices.

Signed-off-by: eti <eti@eti.tf>
---
 appview/pages/funcmap.go                                   | 7 +++++++
 appview/pages/templates/fragments/comment/commentBody.html | 2 +-
 appview/pages/templates/repo/fragments/reaction.html       | 2 +-
 appview/pages/templates/repo/fragments/reactions.html      | 7 ++++---
 appview/pages/templates/repo/issues/issue.html             | 3 ++-
 .../pages/templates/repo/pulls/fragments/pullHeader.html   | 3 ++-
 6 files changed, 17 insertions(+), 7 deletions(-)

diff --git a/appview/pages/funcmap.go b/appview/pages/funcmap.go
index 0b5fd231..0feb7e15 100644
--- a/appview/pages/funcmap.go
+++ b/appview/pages/funcmap.go
@@ -18,6 +18,7 @@ import (
 	"reflect"
 	"strings"
 	"time"
+	"unicode/utf8"
 
 	"github.com/alecthomas/chroma/v2"
 	chromahtml "github.com/alecthomas/chroma/v2/formatters/html"
@@ -333,6 +334,12 @@ func (p *Pages) funcMap() template.FuncMap {
 		"nl2br": func(text string) template.HTML {
 			return template.HTML(strings.ReplaceAll(template.HTMLEscapeString(text), "\n", "<br>"))
 		},
+		"isLongBody": func(text string) bool {
+			return utf8.RuneCountInString(text) > 800 ||
+				len(strings.Split(text, "\n\n")) > 4 ||
+				strings.Contains(text, "```") ||
+				strings.Contains(text, "![")
+		},
 		"unwrapText": func(text string) string {
 			paragraphs := strings.Split(text, "\n\n")
 
diff --git a/appview/pages/templates/fragments/comment/commentBody.html b/appview/pages/templates/fragments/comment/commentBody.html
index 3bd7b8c1..a551ffcf 100644
--- a/appview/pages/templates/fragments/comment/commentBody.html
+++ b/appview/pages/templates/fragments/comment/commentBody.html
@@ -6,7 +6,7 @@
       (dict "Reactions"   .Reactions
             "UserReacted" .UserReacted
             "ThreadAt"    .Comment.FeedCommentAtUri
-            "HideIfEmpty" true) }}
+            "ShowPicker"  (isLongBody .Comment.Body.Text)) }}
   {{ else }}
     <div class="prose dark:prose-invert italic text-gray-500 dark:text-gray-400">[deleted by author]</div>
   {{ end }}
diff --git a/appview/pages/templates/repo/fragments/reaction.html b/appview/pages/templates/repo/fragments/reaction.html
index cb1f8b48..f85f3081 100644
--- a/appview/pages/templates/repo/fragments/reaction.html
+++ b/appview/pages/templates/repo/fragments/reaction.html
@@ -1,6 +1,6 @@
 {{ define "repo/fragments/reaction" }}
     <button
-        class="flex justify-center items-center min-h-8 rounded border
+        class="reaction-chip flex justify-center items-center min-h-8 rounded border
             leading-4 px-2 gap-1.5 text-sm relative group
             {{ if eq .Count 0 }}
                 hidden
diff --git a/appview/pages/templates/repo/fragments/reactions.html b/appview/pages/templates/repo/fragments/reactions.html
index 99c0fa39..4b3f0b33 100644
--- a/appview/pages/templates/repo/fragments/reactions.html
+++ b/appview/pages/templates/repo/fragments/reactions.html
@@ -1,5 +1,5 @@
 {{ define "repo/fragments/reactions" }}
-  <div class="reactions flex flex-wrap items-center gap-2" hx-include="this">
+  <div class="reactions group/reactions flex flex-wrap items-center gap-2" hx-include="this">
     {{- $reactions   := .Reactions -}}
     {{- $userReacted := .UserReacted -}}
     {{- $threadAt    := .ThreadAt -}}
@@ -20,9 +20,10 @@
           "SubjectUri"  $threadAt) }}
     {{ end }}
 
-    {{ if or (not .HideIfEmpty) (gt (len $reactions) 0) }}
+    <div class="min-h-8 flex items-center opacity-100 [@media(hover:hover)]:opacity-0 group-hover/comment:opacity-100
+      {{ if not .ShowPicker }}[@media(hover:hover)]:hidden group-has-[.reaction-chip:not(.hidden)]/reactions:flex{{ end }}">
       {{ template "repo/fragments/reactionsPopup" (dict "CommentRkey" $commentRkey "Scope" "body") }}
-    {{ end }}
+    </div>
 
   </div>
 {{ end }}
diff --git a/appview/pages/templates/repo/issues/issue.html b/appview/pages/templates/repo/issues/issue.html
index 0801cf2e..b666fac3 100644
--- a/appview/pages/templates/repo/issues/issue.html
+++ b/appview/pages/templates/repo/issues/issue.html
@@ -46,7 +46,8 @@
     {{ template "repo/fragments/reactions"
       (dict "Reactions"   (index .Reactions $aturi)
             "UserReacted" (index .UserReacted $aturi)
-            "ThreadAt"    $aturi) }}
+            "ThreadAt"    $aturi
+            "ShowPicker"  (isLongBody .Issue.Body)) }}
   </div>
 </section>
 {{ end }}
diff --git a/appview/pages/templates/repo/pulls/fragments/pullHeader.html b/appview/pages/templates/repo/pulls/fragments/pullHeader.html
index c1b0fc89..4564c58f 100644
--- a/appview/pages/templates/repo/pulls/fragments/pullHeader.html
+++ b/appview/pages/templates/repo/pulls/fragments/pullHeader.html
@@ -63,7 +63,8 @@
       {{ template "repo/fragments/reactions"
         (dict "Reactions"   (index .Reactions $aturi)
               "UserReacted" (index .UserReacted $aturi)
-              "ThreadAt"    $aturi) }}
+              "ThreadAt"    $aturi
+              "ShowPicker"  (isLongBody .Pull.Body)) }}
     </div>
 </section>
 
-- 
2.51.2