Add reactions to issues/PR and comments (#2856)

4 files changed, 47 insertions, 0 deletions

diff --git a/templates/repo/issue/view_content.tmpl b/templates/repo/issue/view_content.tmpl
index 7de9502242..795844d5d3 100644
--- a/templates/repo/issue/view_content.tmpl
+++ b/templates/repo/issue/view_content.tmpl
@@ -19,6 +19,7 @@
 					<div class="ui top attached header">
 						<span class="text grey"><a {{if gt .Issue.Poster.ID 0}}href="{{.Issue.Poster.HomeLink}}"{{end}}>{{.Issue.Poster.Name}}</a> {{.i18n.Tr "repo.issues.commented_at" .Issue.HashTag $createdStr | Safe}}</span>
 						<div class="ui right actions">
+							{{template "repo/issue/view_content/add_reaction" Dict "ctx" $ "ActionURL" (Printf "%s/issues/%d/reactions" $.RepoLink .Issue.Index) }}
 							{{if .IsIssueOwner}}
 								<div class="item action">
 									<a class="edit-content" href="#"><i class="octicon octicon-pencil"></i></a>
@@ -37,6 +38,12 @@
 						<div class="raw-content hide">{{.Issue.Content}}</div>
 						<div class="edit-content-zone hide" data-write="issue-{{.Issue.ID}}-write" data-preview="issue-{{.Issue.ID}}-preview" data-update-url="{{$.RepoLink}}/issues/{{.Issue.Index}}/content" data-context="{{.RepoLink}}"></div>
 					</div>
+					{{$reactions := .Issue.Reactions.GroupByType}}
+					{{if $reactions}}
+						<div class="ui attached segment reactions">
+							{{template "repo/issue/view_content/reactions" Dict "ctx" $ "ActionURL" (Printf "%s/issues/%d/reactions" $.RepoLink .Issue.Index) "Reactions" $reactions }}
+						</div>
+					{{end}}
 					{{if .Issue.Attachments}}
 						<div class="ui bottom attached segment">
 							<div class="ui small images">
diff --git a/templates/repo/issue/view_content/add_reaction.tmpl b/templates/repo/issue/view_content/add_reaction.tmpl
new file mode 100644
index 0000000000..626db5c261
--- /dev/null
+++ b/templates/repo/issue/view_content/add_reaction.tmpl
@@ -0,0 +1,18 @@
+{{if .ctx.IsSigned}}
+<div class="item action ui pointing top right select-reaction dropdown" data-action-url="{{ .ActionURL }}">
+	<a class="add-reaction">
+		<i class="octicon octicon-plus-small" style="width: 10px"></i>
+		<i class="octicon octicon-smiley"></i>
+	</a>
+	<div class="menu has-emoji">
+		<div class="header">{{ .ctx.i18n.Tr "repo.pick_reaction"}}</div>
+		<div class="divider"></div>
+		<div class="item" data-content="+1">:+1:</div>
+		<div class="item" data-content="-1">:-1:</div>
+		<div class="item" data-content="laugh">:laughing:</div>
+		<div class="item" data-content="confused">:confused:</div>
+		<div class="item" data-content="heart">:heart:</div>
+		<div class="item" data-content="hooray">:tada:</div>
+	</div>
+</div>
+{{end}}
diff --git a/templates/repo/issue/view_content/comments.tmpl b/templates/repo/issue/view_content/comments.tmpl
index 34609ceb31..f073fe8108 100644
--- a/templates/repo/issue/view_content/comments.tmpl
+++ b/templates/repo/issue/view_content/comments.tmpl
@@ -22,6 +22,7 @@
 								{{end}}
 							</div>
 						{{end}}
+						{{template "repo/issue/view_content/add_reaction" Dict "ctx" $ "ActionURL" (Printf "%s/comments/%d/reactions" $.RepoLink .ID) }}
 						{{if or $.IsRepositoryAdmin (eq .Poster.ID $.SignedUserID)}}
 							<div class="item action">
 								<a class="edit-content" href="#"><i class="octicon octicon-pencil"></i></a>
@@ -41,6 +42,12 @@
 					<div class="raw-content hide">{{.Content}}</div>
 					<div class="edit-content-zone hide" data-write="issuecomment-{{.ID}}-write" data-preview="issuecomment-{{.ID}}-preview" data-update-url="{{$.RepoLink}}/comments/{{.ID}}" data-context="{{$.RepoLink}}"></div>
 				</div>
+				{{$reactions := .Reactions.GroupByType}}
+				{{if $reactions}}
+					<div class="ui attached segment reactions">
+						{{template "repo/issue/view_content/reactions" Dict "ctx" $ "ActionURL" (Printf "%s/comments/%d/reactions" $.RepoLink .ID) "Reactions" $reactions }}
+					</div>
+				{{end}}
 				{{if .Attachments}}
 					<div class="ui bottom attached segment">
 						<div class="ui small images">
diff --git a/templates/repo/issue/view_content/reactions.tmpl b/templates/repo/issue/view_content/reactions.tmpl
new file mode 100644
index 0000000000..f4810f4849
--- /dev/null
+++ b/templates/repo/issue/view_content/reactions.tmpl
@@ -0,0 +1,15 @@
+{{range $key, $value := .Reactions}}
+	<a class="ui label basic{{if $value.HasUser $.ctx.SignedUserID}} blue{{end}}{{if not $.ctx.IsSigned}} disabled{{end}} has-emoji" data-title="{{$value.GetFirstUsers}}{{if gt ($value.GetMoreUserCount) 0}} {{ $.ctx.i18n.Tr "repo.reactions_more" $value.GetMoreUserCount}}{{end}}" data-content="{{ $key }}" data-action-url="{{ $.ActionURL }}">
+		{{if eq $key "hooray"}}
+			:tada:
+		{{else}}
+			{{if eq $key "laugh"}}
+				:laughing:
+			{{else}}
+				:{{$key}}:
+			{{end}}
+		{{end}}
+		{{len $value}}
+	</a>
+{{end}}
+{{template "repo/issue/view_content/add_reaction" Dict "ctx" $.ctx "ActionURL" .ActionURL }}