1
1
mirror of https://github.com/go-gitea/gitea synced 2024-11-15 22:54:24 +00:00
gitea/templates/repo/issue/view_content.tmpl
Giteabot 0352b99221
Rewrite and restyle reaction selector and enable no-sizzle eslint rule (#30453) (#30473)
Backport #30453 by @silverwind

Enable `no-sizzle` lint rule, there was only one use in
`initCompReactionSelector` which I have rewritten as follows:

- Remove all jQuery except the necessary fomantic dropdown init
- Remove the recursion, instead bind event listeners to common parent
container nodes

Did various tests, works with our without attachments, in diff view and
in diff comments inside comment list.

Additionally the style of reactions now matches between code comments
and issue comments:

<img width="275" alt="Screenshot 2024-04-13 at 14 58 10"
src="https://github.com/go-gitea/gitea/assets/115237/9d08f188-8661-4dd9-bff4-cad6d6d09cab">

Co-authored-by: silverwind <me@silverwind.io>
Co-authored-by: wxiaoguang <wxiaoguang@gmail.com>
2024-04-14 11:58:48 +00:00

189 lines
7.9 KiB
Handlebars

<div class="issue-content">
<!-- I know, there is probably a better way to do this (moved from sidebar.tmpl, original author: 6543 @ 2021-02-28) -->
<!-- Agree, there should be a better way, eg: introduce window.config.pageData (original author: wxiaoguang @ 2021-09-05) -->
<input type="hidden" id="repolink" value="{{$.RepoRelPath}}">
<input type="hidden" id="repoId" value="{{.Repository.ID}}">
<input type="hidden" id="issueIndex" value="{{.Issue.Index}}">
<input type="hidden" id="type" value="{{.IssueType}}">
{{$createdStr:= TimeSinceUnix .Issue.CreatedUnix ctx.Locale}}
<div class="issue-content-left comment-list prevent-before-timeline">
<div class="ui timeline">
<div id="{{.Issue.HashTag}}" class="timeline-item comment first">
{{if .Issue.OriginalAuthor}}
<span class="timeline-avatar">
{{ctx.AvatarUtils.Avatar nil 40}}
</span>
{{else}}
<a class="timeline-avatar" {{if gt .Issue.Poster.ID 0}}href="{{.Issue.Poster.HomeLink}}"{{end}}>
{{ctx.AvatarUtils.Avatar .Issue.Poster 40}}
</a>
{{end}}
<div class="content comment-container">
<div class="ui top attached header comment-header tw-flex tw-items-center tw-justify-between" role="heading" aria-level="3">
<div class="comment-header-left tw-flex tw-items-center">
{{if .Issue.OriginalAuthor}}
<span class="text black tw-font-semibold">
{{svg (MigrationIcon .Repository.GetOriginalURLHostname)}}
{{.Issue.OriginalAuthor}}
</span>
<span class="text grey muted-links">
{{ctx.Locale.Tr "repo.issues.commented_at" .Issue.HashTag $createdStr}}
</span>
<span class="text migrate">
{{if .Repository.OriginalURL}} ({{ctx.Locale.Tr "repo.migrated_from" .Repository.OriginalURL .Repository.GetOriginalURLHostname}}){{end}}
</span>
{{else}}
<a class="inline-timeline-avatar" href="{{.Issue.Poster.HomeLink}}">
{{ctx.AvatarUtils.Avatar .Issue.Poster 24}}
</a>
<span class="text grey muted-links">
{{template "shared/user/authorlink" .Issue.Poster}}
{{ctx.Locale.Tr "repo.issues.commented_at" .Issue.HashTag $createdStr}}
</span>
{{end}}
</div>
<div class="comment-header-right actions tw-flex tw-items-center">
{{template "repo/issue/view_content/show_role" dict "ShowRole" .Issue.ShowRole "IgnorePoster" true}}
{{if not $.Repository.IsArchived}}
{{template "repo/issue/view_content/add_reaction" dict "ActionURL" (printf "%s/issues/%d/reactions" $.RepoLink .Issue.Index)}}
{{end}}
{{template "repo/issue/view_content/context_menu" dict "ctxData" $ "item" .Issue "delete" false "issue" true "diff" false "IsCommentPoster" $.IsIssuePoster}}
</div>
</div>
<div class="ui attached segment comment-body" role="article">
<div class="render-content markup" {{if or $.Permission.IsAdmin $.HasIssuesOrPullsWritePermission $.IsIssuePoster}}data-can-edit="true"{{end}}>
{{if .Issue.RenderedContent}}
{{.Issue.RenderedContent}}
{{else}}
<span class="no-content">{{ctx.Locale.Tr "repo.issues.no_content"}}</span>
{{end}}
</div>
<div id="issue-{{.Issue.ID}}-raw" class="raw-content tw-hidden">{{.Issue.Content}}</div>
<div class="edit-content-zone tw-hidden" data-update-url="{{$.RepoLink}}/issues/{{.Issue.Index}}/content" data-context="{{.RepoLink}}" data-attachment-url="{{$.RepoLink}}/issues/{{.Issue.Index}}/attachments" data-view-attachment-url="{{$.RepoLink}}/issues/{{.Issue.Index}}/view-attachments"></div>
{{if .Issue.Attachments}}
{{template "repo/issue/view_content/attachments" dict "Attachments" .Issue.Attachments "RenderedContent" .Issue.RenderedContent}}
{{end}}
</div>
{{$reactions := .Issue.Reactions.GroupByType}}
{{if $reactions}}
{{template "repo/issue/view_content/reactions" dict "ActionURL" (printf "%s/issues/%d/reactions" $.RepoLink .Issue.Index) "Reactions" $reactions}}
{{end}}
</div>
</div>
{{template "repo/issue/view_content/comments" .}}
{{if and .Issue.IsPull (not $.Repository.IsArchived)}}
{{template "repo/issue/view_content/pull".}}
{{end}}
{{if .IsSigned}}
{{if and (or .IsRepoAdmin .HasIssuesOrPullsWritePermission (not .Issue.IsLocked)) (not .Repository.IsArchived)}}
<div class="timeline-item comment form">
<a class="timeline-avatar" href="{{.SignedUser.HomeLink}}">
{{ctx.AvatarUtils.Avatar .SignedUser 40}}
</a>
<div class="content">
<form class="ui segment form form-fetch-action" id="comment-form" action="{{$.RepoLink}}/issues/{{.Issue.Index}}/comments" method="post">
{{template "repo/issue/comment_tab" .}}
{{.CsrfTokenHtml}}
<div class="field footer">
<div class="text right">
{{if and (or .HasIssuesOrPullsWritePermission .IsIssuePoster) (not .DisableStatusChange)}}
{{if .Issue.IsClosed}}
<button id="status-button" class="ui primary basic button" data-status="{{ctx.Locale.Tr "repo.issues.reopen_issue"}}" data-status-and-comment="{{ctx.Locale.Tr "repo.issues.reopen_comment_issue"}}" name="status" value="reopen">
{{ctx.Locale.Tr "repo.issues.reopen_issue"}}
</button>
{{else}}
{{$closeTranslationKey := "repo.issues.close"}}
{{if .Issue.IsPull}}
{{$closeTranslationKey = "repo.pulls.close"}}
{{end}}
<button id="status-button" class="ui red basic button" data-status="{{ctx.Locale.Tr $closeTranslationKey}}" data-status-and-comment="{{ctx.Locale.Tr "repo.issues.close_comment_issue"}}" name="status" value="close">
{{ctx.Locale.Tr $closeTranslationKey}}
</button>
{{end}}
{{end}}
<button class="ui primary button">
{{ctx.Locale.Tr "repo.issues.create_comment"}}
</button>
</div>
</div>
</form>
</div>
</div>
{{else if .Repository.IsArchived}}
<div class="ui warning message tw-text-center">
{{if .Issue.IsPull}}
{{ctx.Locale.Tr "repo.archive.pull.nocomment"}}
{{else}}
{{ctx.Locale.Tr "repo.archive.issue.nocomment"}}
{{end}}
</div>
{{end}}
{{else}} {{/* not .IsSigned */}}
{{if .Repository.IsArchived}}
<div class="ui warning message tw-text-center">
{{if .Issue.IsPull}}
{{ctx.Locale.Tr "repo.archive.pull.nocomment"}}
{{else}}
{{ctx.Locale.Tr "repo.archive.issue.nocomment"}}
{{end}}
</div>
{{else}}
<div class="ui warning message">
{{ctx.Locale.Tr "repo.issues.sign_in_require_desc" .SignInLink}}
</div>
{{end}}
{{end}}{{/* end if: .IsSigned */}}
</div>
</div>
{{template "repo/issue/view_content/sidebar" .}}
</div>
<template id="issue-comment-editor-template">
<div class="ui comment form">
<div class="field">
{{template "shared/combomarkdowneditor" (dict
"MarkdownPreviewUrl" (print .Repository.Link "/markup")
"MarkdownPreviewContext" .RepoLink
"TextareaName" "content"
"DropzoneParentContainer" ".ui.form"
)}}
</div>
{{if .IsAttachmentEnabled}}
<div class="field">
{{template "repo/upload" .}}
</div>
{{end}}
<div class="field">
<div class="text right edit">
<button class="ui basic cancel button">{{ctx.Locale.Tr "repo.issues.cancel"}}</button>
<button class="ui primary save button">{{ctx.Locale.Tr "repo.issues.save"}}</button>
</div>
</div>
</div>
</template>
{{template "repo/issue/view_content/reference_issue_dialog" .}}
{{template "shared/user/block_user_dialog" .}}
<div class="tw-hidden" id="no-content">
<span class="no-content">{{ctx.Locale.Tr "repo.issues.no_content"}}</span>
</div>
<div class="ui g-modal-confirm delete modal">
<div class="header">
{{svg "octicon-trash"}}
{{ctx.Locale.Tr "repo.branch.delete" .HeadTarget}}
</div>
<div class="content">
<p>{{ctx.Locale.Tr "repo.branch.delete_desc"}}</p>
</div>
{{template "base/modal_actions_confirm" .}}
</div>