Reply button is not removed when deleting a code review comment (#13824)

Backport #13774

2 files changed, 96 insertions, 90 deletions

diff --git a/templates/repo/diff/box.tmpl b/templates/repo/diff/box.tmpl
index 8301dbb05d..f6e49126bf 100644
--- a/templates/repo/diff/box.tmpl
+++ b/templates/repo/diff/box.tmpl
@@ -166,74 +166,78 @@
 																<td class="lines-num"></td>
 																<td class="lines-type-marker"></td>
 																<td class="add-comment-left">
-																	{{if and $resolved  (eq $line.GetCommentSide "previous")}}
-																		<div class="ui top attached header">
-																			<span class="ui grey text left"><b>{{$resolveDoer.Name}}</b> {{$.i18n.Tr "repo.issues.review.resolved_by"}}</span>
-																			<button id="show-outdated-{{(index $line.Comments 0).ID}}" data-comment="{{(index $line.Comments 0).ID}}" class="ui compact right labeled button show-outdated">
-																				{{svg "octicon-unfold"}}
-																				{{$.i18n.Tr "repo.issues.review.show_resolved"}}
-																			</button>
-																			<button id="hide-outdated-{{(index $line.Comments 0).ID}}" data-comment="{{(index $line.Comments 0).ID}}" class="hide ui compact right labeled button hide-outdated">
-																				{{svg "octicon-fold"}}
-																				{{$.i18n.Tr "repo.issues.review.hide_resolved"}}
-																			</button>
-																		</div>
-																	{{end}}
-																	{{if eq $line.GetCommentSide "previous"}}
-																		<div id="code-comments-{{(index  $line.Comments 0).ID}}" class="field comment-code-cloud {{if $resolved}}hide{{end}}">
-																			<div class="comment-list">
-																				<ui class="ui comments">
-																				{{ template "repo/diff/comments" dict "root" $ "comments" $line.Comments}}
-																				</ui>
-																			</div>
-																		{{template "repo/diff/comment_form_datahandler" dict "reply" (index $line.Comments 0).ReviewID "hidden" true "root" $ "comment" (index $line.Comments 0)}}
-																			{{if and $.CanMarkConversation $isNotPending}}
-																				<button class="ui icon tiny button resolve-conversation" data-action="{{if not $resolved}}Resolve{{else}}UnResolve{{end}}" data-comment-id="{{(index $line.Comments 0).ID}}" data-update-url="{{$.RepoLink}}/issues/resolve_conversation" >
-																					{{if $resolved}}
-																						{{$.i18n.Tr "repo.issues.review.un_resolve_conversation"}}
-																					{{else}}
-																						{{$.i18n.Tr "repo.issues.review.resolve_conversation"}}
-																					{{end}}
+																	<div class="conversation-holder">
+																		{{if and $resolved  (eq $line.GetCommentSide "previous")}}
+																			<div class="ui top attached header">
+																				<span class="ui grey text left"><b>{{$resolveDoer.Name}}</b> {{$.i18n.Tr "repo.issues.review.resolved_by"}}</span>
+																				<button id="show-outdated-{{(index $line.Comments 0).ID}}" data-comment="{{(index $line.Comments 0).ID}}" class="ui compact right labeled button show-outdated">
+																					{{svg "octicon-unfold"}}
+																					{{$.i18n.Tr "repo.issues.review.show_resolved"}}
 																				</button>
-																			{{end}}
-																		</div>
-																	{{end}}
+																				<button id="hide-outdated-{{(index $line.Comments 0).ID}}" data-comment="{{(index $line.Comments 0).ID}}" class="hide ui compact right labeled button hide-outdated">
+																					{{svg "octicon-fold"}}
+																					{{$.i18n.Tr "repo.issues.review.hide_resolved"}}
+																				</button>
+																			</div>
+																		{{end}}
+																		{{if eq $line.GetCommentSide "previous"}}
+																			<div id="code-comments-{{(index  $line.Comments 0).ID}}" class="field comment-code-cloud {{if $resolved}}hide{{end}}">
+																				<div class="comment-list">
+																					<ui class="ui comments">
+																					{{ template "repo/diff/comments" dict "root" $ "comments" $line.Comments}}
+																					</ui>
+																				</div>
+																			{{template "repo/diff/comment_form_datahandler" dict "reply" (index $line.Comments 0).ReviewID "hidden" true "root" $ "comment" (index $line.Comments 0)}}
+																				{{if and $.CanMarkConversation $isNotPending}}
+																					<button class="ui icon tiny button resolve-conversation" data-action="{{if not $resolved}}Resolve{{else}}UnResolve{{end}}" data-comment-id="{{(index $line.Comments 0).ID}}" data-update-url="{{$.RepoLink}}/issues/resolve_conversation" >
+																						{{if $resolved}}
+																							{{$.i18n.Tr "repo.issues.review.un_resolve_conversation"}}
+																						{{else}}
+																							{{$.i18n.Tr "repo.issues.review.resolve_conversation"}}
+																						{{end}}
+																					</button>
+																				{{end}}
+																			</div>
+																		{{end}}
+																	</div>
 																</td>
 																<td class="lines-num"></td>
 																<td class="lines-type-marker"></td>
 																<td class="add-comment-right">
-																	{{if and $resolved (eq $line.GetCommentSide "proposed")}}
-																		<div class="ui top attached header">
-																			<span class="ui grey text left"><b>{{$resolveDoer.Name}}</b> {{$.i18n.Tr "repo.issues.review.resolved_by"}}</span>
-																			<button id="show-outdated-{{(index $line.Comments 0).ID}}" data-comment="{{(index $line.Comments 0).ID}}" class="ui compact right labeled button show-outdated">
-																				{{svg "octicon-unfold"}}
-																				{{$.i18n.Tr "repo.issues.review.show_resolved"}}
-																			</button>
-																			<button id="hide-outdated-{{(index $line.Comments 0).ID}}" data-comment="{{(index $line.Comments 0).ID}}" class="hide ui compact right labeled button hide-outdated">
-																				{{svg "octicon-fold"}}
-																				{{$.i18n.Tr "repo.issues.review.hide_resolved"}}
-																			</button>
-																		</div>
-																	{{end}}
-																	{{if eq $line.GetCommentSide "proposed"}}
-																		<div id="code-comments-{{(index  $line.Comments 0).ID}}" class="field comment-code-cloud {{if $resolved}}hide{{end}}">
-																			<div class="comment-list">
-																				<ui class="ui comments">
-																				{{ template "repo/diff/comments" dict "root" $ "comments" $line.Comments}}
-																				</ui>
-																			</div>
-																			{{template "repo/diff/comment_form_datahandler" dict "reply" (index $line.Comments 0).ReviewID "hidden" true "root" $ "comment" (index $line.Comments 0)}}
-																			{{if and $.CanMarkConversation $isNotPending}}
-																				<button class="ui icon tiny button resolve-conversation" data-action="{{if not $resolved}}Resolve{{else}}UnResolve{{end}}" data-comment-id="{{(index $line.Comments 0).ID}}" data-update-url="{{$.RepoLink}}/issues/resolve_conversation" >
-																					{{if $resolved}}
-																						{{$.i18n.Tr "repo.issues.review.un_resolve_conversation"}}
-																					{{else}}
-																						{{$.i18n.Tr "repo.issues.review.resolve_conversation"}}
-																					{{end}}
+																	<div class="conversation-holder">
+																		{{if and $resolved (eq $line.GetCommentSide "proposed")}}
+																			<div class="ui top attached header">
+																				<span class="ui grey text left"><b>{{$resolveDoer.Name}}</b> {{$.i18n.Tr "repo.issues.review.resolved_by"}}</span>
+																				<button id="show-outdated-{{(index $line.Comments 0).ID}}" data-comment="{{(index $line.Comments 0).ID}}" class="ui compact right labeled button show-outdated">
+																					{{svg "octicon-unfold"}}
+																					{{$.i18n.Tr "repo.issues.review.show_resolved"}}
 																				</button>
-																			{{end}}
-																		</div>
-																	{{end}}
+																				<button id="hide-outdated-{{(index $line.Comments 0).ID}}" data-comment="{{(index $line.Comments 0).ID}}" class="hide ui compact right labeled button hide-outdated">
+																					{{svg "octicon-fold"}}
+																					{{$.i18n.Tr "repo.issues.review.hide_resolved"}}
+																				</button>
+																			</div>
+																		{{end}}
+																		{{if eq $line.GetCommentSide "proposed"}}
+																			<div id="code-comments-{{(index  $line.Comments 0).ID}}" class="field comment-code-cloud {{if $resolved}}hide{{end}}">
+																				<div class="comment-list">
+																					<ui class="ui comments">
+																					{{ template "repo/diff/comments" dict "root" $ "comments" $line.Comments}}
+																					</ui>
+																				</div>
+																				{{template "repo/diff/comment_form_datahandler" dict "reply" (index $line.Comments 0).ReviewID "hidden" true "root" $ "comment" (index $line.Comments 0)}}
+																				{{if and $.CanMarkConversation $isNotPending}}
+																					<button class="ui icon tiny button resolve-conversation" data-action="{{if not $resolved}}Resolve{{else}}UnResolve{{end}}" data-comment-id="{{(index $line.Comments 0).ID}}" data-update-url="{{$.RepoLink}}/issues/resolve_conversation" >
+																						{{if $resolved}}
+																							{{$.i18n.Tr "repo.issues.review.un_resolve_conversation"}}
+																						{{else}}
+																							{{$.i18n.Tr "repo.issues.review.resolve_conversation"}}
+																						{{end}}
+																					</button>
+																				{{end}}
+																			</div>
+																		{{end}}
+																	</div>
 																</td>
 															</tr>
 														{{end}}
diff --git a/templates/repo/diff/section_unified.tmpl b/templates/repo/diff/section_unified.tmpl
index 1a461c7ad7..d606a1d74b 100644
--- a/templates/repo/diff/section_unified.tmpl
+++ b/templates/repo/diff/section_unified.tmpl
@@ -39,35 +39,37 @@
 				<tr>
 					<td colspan="2" class="lines-num"></td>
 					<td class="add-comment-left add-comment-right" colspan="2">
-						{{if $resolved}}
-							<div class = "ui attached header">
-								<span class="ui grey text left"><b>{{$resolveDoer.Name}}</b> {{$.root.i18n.Tr "repo.issues.review.resolved_by"}}</span>
-								<button id="show-outdated-{{(index $line.Comments 0).ID}}" data-comment="{{(index $line.Comments 0).ID}}" class="ui compact right labeled button show-outdated">
-									{{svg "octicon-unfold"}}
-									{{$.root.i18n.Tr "repo.issues.review.show_resolved"}}
-								</button>
-								<button id="hide-outdated-{{(index $line.Comments 0).ID}}" data-comment="{{(index $line.Comments 0).ID}}" class="hide ui compact right labeled button hide-outdated">
-									{{svg "octicon-fold"}}
-									{{$.root.i18n.Tr "repo.issues.review.hide_resolved"}}
-								</button>
-							</div>
-						{{end}}
-						<div id="code-comments-{{(index  $line.Comments 0).ID}}" class="field comment-code-cloud {{if $resolved}}hide{{end}}">
-							<div class="comment-list">
-								<ui class="ui comments">
-									{{ template "repo/diff/comments" dict "root" $.root "comments" $line.Comments}}
-								</ui>
-							</div>
-							{{template "repo/diff/comment_form_datahandler" dict "hidden" true "reply" (index $line.Comments 0).ReviewID "root" $.root "comment" (index $line.Comments 0)}}
-							{{if and $.root.CanMarkConversation $isNotPending}}
-								<button class="ui icon tiny button resolve-conversation" data-action="{{if not $resolved}}Resolve{{else}}UnResolve{{end}}" data-comment-id="{{(index $line.Comments 0).ID}}" data-update-url="{{$.root.RepoLink}}/issues/resolve_conversation" >
-									{{if $resolved}}
-										{{$.root.i18n.Tr "repo.issues.review.un_resolve_conversation"}}
-									{{else}}
-										{{$.root.i18n.Tr "repo.issues.review.resolve_conversation"}}
-									{{end}}
-								</button>
+						<div class="conversation-holder">
+							{{if $resolved}}
+								<div class = "ui attached header">
+									<span class="ui grey text left"><b>{{$resolveDoer.Name}}</b> {{$.root.i18n.Tr "repo.issues.review.resolved_by"}}</span>
+									<button id="show-outdated-{{(index $line.Comments 0).ID}}" data-comment="{{(index $line.Comments 0).ID}}" class="ui compact right labeled button show-outdated">
+										{{svg "octicon-unfold"}}
+										{{$.root.i18n.Tr "repo.issues.review.show_resolved"}}
+									</button>
+									<button id="hide-outdated-{{(index $line.Comments 0).ID}}" data-comment="{{(index $line.Comments 0).ID}}" class="hide ui compact right labeled button hide-outdated">
+										{{svg "octicon-fold"}}
+										{{$.root.i18n.Tr "repo.issues.review.hide_resolved"}}
+									</button>
+								</div>
 							{{end}}
+							<div id="code-comments-{{(index  $line.Comments 0).ID}}" class="field comment-code-cloud {{if $resolved}}hide{{end}}">
+								<div class="comment-list">
+									<ui class="ui comments">
+										{{ template "repo/diff/comments" dict "root" $.root "comments" $line.Comments}}
+									</ui>
+								</div>
+								{{template "repo/diff/comment_form_datahandler" dict "hidden" true "reply" (index $line.Comments 0).ReviewID "root" $.root "comment" (index $line.Comments 0)}}
+								{{if and $.root.CanMarkConversation $isNotPending}}
+									<button class="ui icon tiny button resolve-conversation" data-action="{{if not $resolved}}Resolve{{else}}UnResolve{{end}}" data-comment-id="{{(index $line.Comments 0).ID}}" data-update-url="{{$.root.RepoLink}}/issues/resolve_conversation" >
+										{{if $resolved}}
+											{{$.root.i18n.Tr "repo.issues.review.un_resolve_conversation"}}
+										{{else}}
+											{{$.root.i18n.Tr "repo.issues.review.resolve_conversation"}}
+										{{end}}
+									</button>
+								{{end}}
+							</div>
 						</div>
 					</td>
 				</tr>