Use fetch form action for lock/unlock/pin/unpin on sidebar (#25380)
Before: <img width="364" alt="Screen Shot 2023-06-20 at 11 59 11" src="https://github.com/go-gitea/gitea/assets/17645053/ad284b7e-8d21-43be-b178-bbcfd37cb5bd"> Might trigger many posts when keep clicking the buttons above. <img width="448" alt="Screen Shot 2023-06-20 at 11 52 28" src="https://github.com/go-gitea/gitea/assets/17645053/a60aa6ac-af74-45e4-b13a-512b436b81b0"> <img width="678" alt="Screen Shot 2023-06-20 at 11 52 37" src="https://github.com/go-gitea/gitea/assets/17645053/d6662700-3643-4cc7-a2ec-64e1c0f5fbdb"> After (PR sidebar, Same for issue): https://github.com/go-gitea/gitea/assets/17645053/9df3ad1f-e29c-439b-8bde-e6b917d63cc6 For delete, it is using `base/modal_actions_confirm` subtemplate, and we might need another general solution for this (maybe add another attribute to the subtemplate or something) --------- Co-authored-by: silverwind <me@silverwind.io> Co-authored-by: Giteabot <teabot@gitea.io> Co-authored-by: wxiaoguang <wxiaoguang@gmail.com>
This commit is contained in:
parent
f0b773e0ce
commit
c6f1fb1c6d
|
@ -20,14 +20,12 @@ func LockIssue(ctx *context.Context) {
|
||||||
}
|
}
|
||||||
|
|
||||||
if issue.IsLocked {
|
if issue.IsLocked {
|
||||||
ctx.Flash.Error(ctx.Tr("repo.issues.lock_duplicate"))
|
ctx.JSONError(ctx.Tr("repo.issues.lock_duplicate"))
|
||||||
ctx.Redirect(issue.Link())
|
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
|
|
||||||
if !form.HasValidReason() {
|
if !form.HasValidReason() {
|
||||||
ctx.Flash.Error(ctx.Tr("repo.issues.lock.unknown_reason"))
|
ctx.JSONError(ctx.Tr("repo.issues.lock.unknown_reason"))
|
||||||
ctx.Redirect(issue.Link())
|
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -40,7 +38,7 @@ func LockIssue(ctx *context.Context) {
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
|
|
||||||
ctx.Redirect(issue.Link())
|
ctx.JSONRedirect(issue.Link())
|
||||||
}
|
}
|
||||||
|
|
||||||
// UnlockIssue unlocks a previously locked issue.
|
// UnlockIssue unlocks a previously locked issue.
|
||||||
|
@ -51,8 +49,7 @@ func UnlockIssue(ctx *context.Context) {
|
||||||
}
|
}
|
||||||
|
|
||||||
if !issue.IsLocked {
|
if !issue.IsLocked {
|
||||||
ctx.Flash.Error(ctx.Tr("repo.issues.unlock_error"))
|
ctx.JSONError(ctx.Tr("repo.issues.unlock_error"))
|
||||||
ctx.Redirect(issue.Link())
|
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -64,5 +61,5 @@ func UnlockIssue(ctx *context.Context) {
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
|
|
||||||
ctx.Redirect(issue.Link())
|
ctx.JSONRedirect(issue.Link())
|
||||||
}
|
}
|
||||||
|
|
|
@ -31,7 +31,7 @@ func IssuePinOrUnpin(ctx *context.Context) {
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
|
|
||||||
ctx.Redirect(issue.Link())
|
ctx.JSONRedirect(issue.Link())
|
||||||
}
|
}
|
||||||
|
|
||||||
// IssueUnpin unpins a Issue
|
// IssueUnpin unpins a Issue
|
||||||
|
|
|
@ -556,7 +556,7 @@
|
||||||
<div class="ui divider"></div>
|
<div class="ui divider"></div>
|
||||||
|
|
||||||
{{if or .PinEnabled .Issue.IsPinned}}
|
{{if or .PinEnabled .Issue.IsPinned}}
|
||||||
<form class="gt-mt-2" method="post" {{if $.NewPinAllowed}}action="{{.Issue.Link}}/pin"{{else}}data-tooltip-content="{{.locale.Tr "repo.issues.max_pinned"}}"{{end}}>
|
<form class="gt-mt-2 form-fetch-action single-button-form" method="post" {{if $.NewPinAllowed}}action="{{.Issue.Link}}/pin"{{else}}data-tooltip-content="{{.locale.Tr "repo.issues.max_pinned"}}"{{end}}>
|
||||||
{{$.CsrfTokenHtml}}
|
{{$.CsrfTokenHtml}}
|
||||||
<button class="fluid ui button {{if not $.NewPinAllowed}}disabled{{end}}">
|
<button class="fluid ui button {{if not $.NewPinAllowed}}disabled{{end}}">
|
||||||
{{if not .Issue.IsPinned}}
|
{{if not .Issue.IsPinned}}
|
||||||
|
@ -599,7 +599,7 @@
|
||||||
{{end}}
|
{{end}}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<form class="ui form" action="{{.Issue.Link}}{{if .Issue.IsLocked}}/unlock{{else}}/lock{{end}}"
|
<form class="ui form form-fetch-action" action="{{.Issue.Link}}{{if .Issue.IsLocked}}/unlock{{else}}/lock{{end}}"
|
||||||
method="post">
|
method="post">
|
||||||
{{.CsrfTokenHtml}}
|
{{.CsrfTokenHtml}}
|
||||||
|
|
||||||
|
|
|
@ -17,12 +17,10 @@
|
||||||
content: "";
|
content: "";
|
||||||
position: absolute;
|
position: absolute;
|
||||||
display: block;
|
display: block;
|
||||||
height: 4rem;
|
|
||||||
aspect-ratio: 1 / 1;
|
|
||||||
left: 50%;
|
left: 50%;
|
||||||
top: 50%;
|
top: 50%;
|
||||||
max-height: 100%;
|
height: min(4em, 66.6%);
|
||||||
max-width: 100%;
|
aspect-ratio: 1;
|
||||||
transform: translate(-50%, -50%);
|
transform: translate(-50%, -50%);
|
||||||
animation: isloadingspin 500ms infinite linear;
|
animation: isloadingspin 500ms infinite linear;
|
||||||
border-width: 4px;
|
border-width: 4px;
|
||||||
|
@ -35,6 +33,15 @@
|
||||||
border-width: 2px;
|
border-width: 2px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* for single form button, the loading state should be on the button, but not go semi-transparent, just replace the text on the button with the loader. */
|
||||||
|
form.single-button-form.is-loading > * {
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
form.single-button-form.is-loading .button {
|
||||||
|
color: transparent;
|
||||||
|
}
|
||||||
|
|
||||||
.markup pre.is-loading,
|
.markup pre.is-loading,
|
||||||
.editor-loading.is-loading,
|
.editor-loading.is-loading,
|
||||||
.pdf-content.is-loading {
|
.pdf-content.is-loading {
|
||||||
|
|
Loading…
Reference in a new issue