Skip to content

Commit 60fa2a5

Browse files
GiteaBotwxiaoguang
andauthored
Fix issue/PR title edit (#30858) (#30865)
Backport #30858 by wxiaoguang 1. "enter" doesn't work (I think it is the last enter support for #14843) 2. if a branch name contains something like `&`, then the branch selector doesn't update Co-authored-by: wxiaoguang <[email protected]>
1 parent 0546029 commit 60fa2a5

File tree

7 files changed

+139
-137
lines changed

7 files changed

+139
-137
lines changed

templates/repo/issue/view_title.tmpl

+25-18
Original file line numberDiff line numberDiff line change
@@ -4,29 +4,36 @@
44
</div>
55
{{end}}
66
<div class="issue-title-header">
7-
<div class="issue-title" id="issue-title-wrapper">
7+
{{$canEditIssueTitle := and (or .HasIssuesOrPullsWritePermission .IsIssuePoster) (not .Repository.IsArchived)}}
8+
<div class="issue-title" id="issue-title-display">
89
<h1 class="gt-word-break">
9-
<span id="issue-title">{{RenderIssueTitle $.Context .Issue.Title ($.Repository.ComposeMetas ctx) | RenderCodeBlock}} <span class="index">#{{.Issue.Index}}</span>
10-
</span>
11-
<div id="edit-title-input" class="ui input tw-flex-1 tw-hidden">
12-
<input value="{{.Issue.Title}}" maxlength="255" autocomplete="off">
13-
</div>
10+
{{RenderIssueTitle $.Context .Issue.Title ($.Repository.ComposeMetas ctx) | RenderCodeBlock}}
11+
<span class="index">#{{.Issue.Index}}</span>
1412
</h1>
1513
<div class="issue-title-buttons">
16-
{{if and (or .HasIssuesOrPullsWritePermission .IsIssuePoster) (not .Repository.IsArchived)}}
17-
<button id="edit-title" class="ui small basic button edit-button not-in-edit{{if .Issue.IsPull}} tw-mr-0{{end}}">{{ctx.Locale.Tr "repo.issues.edit"}}</button>
14+
{{if $canEditIssueTitle}}
15+
<button id="issue-title-edit-show" class="ui small basic button">{{ctx.Locale.Tr "repo.issues.edit"}}</button>
1816
{{end}}
1917
{{if not .Issue.IsPull}}
20-
<a role="button" class="ui small primary button new-issue-button tw-mr-0" href="{{.RepoLink}}/issues/new{{if .NewIssueChooseTemplate}}/choose{{end}}">{{ctx.Locale.Tr "repo.issues.new"}}</a>
18+
<a role="button" class="ui small primary button" href="{{.RepoLink}}/issues/new{{if .NewIssueChooseTemplate}}/choose{{end}}">{{ctx.Locale.Tr "repo.issues.new"}}</a>
2119
{{end}}
2220
</div>
23-
{{if and (or .HasIssuesOrPullsWritePermission .IsIssuePoster) (not .Repository.IsArchived)}}
24-
<div class="edit-buttons">
25-
<button id="cancel-edit-title" class="ui small basic button in-edit tw-hidden">{{ctx.Locale.Tr "repo.issues.cancel"}}</button>
26-
<button id="save-edit-title" class="ui small primary button in-edit tw-hidden tw-mr-0" data-update-url="{{$.RepoLink}}/issues/{{.Issue.Index}}/title" {{if .Issue.IsPull}}data-target-update-url="{{$.RepoLink}}/pull/{{.Issue.Index}}/target_branch"{{end}}>{{ctx.Locale.Tr "repo.issues.save"}}</button>
27-
</div>
28-
{{end}}
2921
</div>
22+
{{if $canEditIssueTitle}}
23+
<div class="ui form issue-title tw-hidden" id="issue-title-editor">
24+
<div class="ui input tw-flex-1">
25+
<input value="{{.Issue.Title}}" data-old-title="{{.Issue.Title}}" maxlength="255" autocomplete="off">
26+
</div>
27+
<div class="issue-title-buttons">
28+
<button class="ui small basic cancel button">{{ctx.Locale.Tr "repo.issues.cancel"}}</button>
29+
<button class="ui small primary button"
30+
data-update-url="{{$.RepoLink}}/issues/{{.Issue.Index}}/title"
31+
{{if .Issue.IsPull}}data-target-update-url="{{$.RepoLink}}/pull/{{.Issue.Index}}/target_branch"{{end}}>
32+
{{ctx.Locale.Tr "repo.issues.save"}}
33+
</button>
34+
</div>
35+
</div>
36+
{{end}}
3037
<div class="issue-title-meta">
3138
{{if .HasMerged}}
3239
<div class="ui purple label issue-state-label">{{svg "octicon-git-merge" 16 "tw-mr-1"}} {{if eq .Issue.PullRequest.Status 3}}{{ctx.Locale.Tr "repo.pulls.manually_merged"}}{{else}}{{ctx.Locale.Tr "repo.pulls.merged"}}{{end}}</div>
@@ -63,14 +70,14 @@
6370
{{end}}
6471
{{else}}
6572
{{if .Issue.OriginalAuthor}}
66-
<span id="pull-desc" class="pull-desc">{{.Issue.OriginalAuthor}} {{ctx.Locale.Tr "repo.pulls.title_desc" .NumCommits $headHref $baseHref}}</span>
73+
<span id="pull-desc-display" class="pull-desc">{{.Issue.OriginalAuthor}} {{ctx.Locale.Tr "repo.pulls.title_desc" .NumCommits $headHref $baseHref}}</span>
6774
{{else}}
68-
<span id="pull-desc" class="pull-desc">
75+
<span id="pull-desc-display" class="pull-desc">
6976
<a {{if gt .Issue.Poster.ID 0}}href="{{.Issue.Poster.HomeLink}}"{{end}}>{{.Issue.Poster.GetDisplayName}}</a>
7077
{{ctx.Locale.Tr "repo.pulls.title_desc" .NumCommits $headHref $baseHref}}
7178
</span>
7279
{{end}}
73-
<span id="pull-desc-edit" class="tw-hidden flex-text-block">
80+
<span id="pull-desc-editor" class="tw-hidden flex-text-block">
7481
<div class="ui floating filter dropdown">
7582
<div class="ui basic small button tw-mr-0">
7683
<span class="text">{{ctx.Locale.Tr "repo.pulls.compare_compare"}}: {{$.HeadTarget}}</span>

tests/integration/issue_test.go

+1-1
Original file line numberDiff line numberDiff line change
@@ -144,7 +144,7 @@ func testNewIssue(t *testing.T, session *TestSession, user, repo, title, content
144144
resp = session.MakeRequest(t, req, http.StatusOK)
145145

146146
htmlDoc = NewHTMLParser(t, resp.Body)
147-
val := htmlDoc.doc.Find("#issue-title").Text()
147+
val := htmlDoc.doc.Find("#issue-title-display").Text()
148148
assert.Contains(t, val, title)
149149
val = htmlDoc.doc.Find(".comment .render-content p").First().Text()
150150
assert.Equal(t, content, val)

tests/integration/pull_create_test.go

+1-1
Original file line numberDiff line numberDiff line change
@@ -125,7 +125,7 @@ func TestPullCreate_TitleEscape(t *testing.T) {
125125
req := NewRequest(t, "GET", url)
126126
resp = session.MakeRequest(t, req, http.StatusOK)
127127
htmlDoc := NewHTMLParser(t, resp.Body)
128-
editTestTitleURL, exists := htmlDoc.doc.Find("#save-edit-title").First().Attr("data-update-url")
128+
editTestTitleURL, exists := htmlDoc.doc.Find(".issue-title-buttons button[data-update-url]").First().Attr("data-update-url")
129129
assert.True(t, exists, "The template has changed")
130130

131131
req = NewRequestWithValues(t, "POST", editTestTitleURL, map[string]string{

web_src/css/repo.css

+37-36
Original file line numberDiff line numberDiff line change
@@ -575,6 +575,22 @@ td .commit-summary {
575575
display: inline-block;
576576
}
577577

578+
@media (max-width: 767.98px) {
579+
.comment.form .issue-content-left .avatar {
580+
display: none;
581+
}
582+
.comment.form .issue-content-left .content {
583+
margin-left: 0 !important;
584+
}
585+
.comment.form .issue-content-left .content::before,
586+
.comment.form .issue-content-left .content::after,
587+
.comment.form .content .form::before,
588+
.comment.form .content .form::after {
589+
display: none;
590+
}
591+
}
592+
593+
/* issue title & meta & edit */
578594
.issue-title-header {
579595
width: 100%;
580596
padding-bottom: 4px;
@@ -586,61 +602,50 @@ td .commit-summary {
586602
align-items: center;
587603
}
588604

589-
.repository.view.issue .issue-title-buttons,
590-
.repository.view.issue .edit-buttons {
605+
.repository.view.issue .issue-title-buttons {
591606
display: flex;
607+
gap: 0.5em;
592608
}
593609

594-
@media (max-width: 767.98px) {
595-
.repository.view.issue .issue-title {
596-
flex-direction: column;
597-
}
598-
.repository.view.issue .issue-title-buttons,
599-
.repository.view.issue .edit-buttons {
600-
width: 100%;
601-
justify-content: space-between;
602-
}
603-
.repository.view.issue .edit-buttons {
604-
margin-top: .5rem;
605-
}
606-
.comment.form .issue-content-left .avatar {
607-
display: none;
608-
}
609-
.comment.form .issue-content-left .content {
610-
margin-left: 0 !important;
611-
}
612-
.comment.form .issue-content-left .content::before,
613-
.comment.form .issue-content-left .content::after,
614-
.comment.form .content .form::before,
615-
.comment.form .content .form::after {
616-
display: none;
617-
}
610+
.repository.view.issue .issue-title-buttons > .ui.button {
611+
margin: 0;
612+
height: 35px;
618613
}
619614

620615
.repository.view.issue .issue-title {
621616
display: flex;
622617
align-items: center;
618+
gap: 0.5em;
623619
margin-bottom: 8px;
620+
min-height: 40px; /* avoid layout shift on edit */
624621
}
625622

626623
.repository.view.issue .issue-title h1 {
627-
display: flex;
628-
align-items: center;
629624
flex: 1;
630625
width: 100%;
631626
font-weight: var(--font-weight-normal);
632627
font-size: 32px;
633628
line-height: 40px;
634629
margin: 0;
635630
padding-right: 0.25rem;
636-
min-height: 41px; /* avoid layout shift on edit */
637631
}
638632

639-
.repository.view.issue .issue-title h1 .ui.input {
640-
font-size: 0.5em;
633+
@media (max-width: 767.98px) {
634+
.repository.view.issue .issue-title {
635+
flex-direction: column;
636+
}
637+
.repository.view.issue .issue-title-buttons {
638+
width: 100%;
639+
justify-content: space-between;
640+
}
641641
}
642642

643-
.repository.view.issue .issue-title h1 .ui.input input {
643+
.repository.view.issue .issue-title .ui.input {
644+
width: 100%;
645+
height: 35px;
646+
}
647+
648+
.repository.view.issue .issue-title .ui.input input {
644649
font-size: 1.5em;
645650
padding: 2px .5rem;
646651
}
@@ -653,10 +658,6 @@ td .commit-summary {
653658
margin-right: 10px;
654659
}
655660

656-
.issue-title .edit-zone {
657-
margin-top: 10px;
658-
}
659-
660661
.issue-state-label {
661662
display: flex !important;
662663
align-items: center !important;

web_src/js/features/common-global.js

+12-4
Original file line numberDiff line numberDiff line change
@@ -47,10 +47,18 @@ export function initFootLanguageMenu() {
4747

4848
export function initGlobalEnterQuickSubmit() {
4949
document.addEventListener('keydown', (e) => {
50-
const isQuickSubmitEnter = ((e.ctrlKey && !e.altKey) || e.metaKey) && (e.key === 'Enter');
51-
if (isQuickSubmitEnter && e.target.matches('textarea')) {
52-
e.preventDefault();
53-
handleGlobalEnterQuickSubmit(e.target);
50+
if (e.key !== 'Enter') return;
51+
const hasCtrlOrMeta = ((e.ctrlKey || e.metaKey) && !e.altKey);
52+
if (hasCtrlOrMeta && e.target.matches('textarea')) {
53+
if (handleGlobalEnterQuickSubmit(e.target)) {
54+
e.preventDefault();
55+
}
56+
} else if (e.target.matches('input') && !e.target.closest('form')) {
57+
// input in a normal form could handle Enter key by default, so we only handle the input outside a form
58+
// eslint-disable-next-line unicorn/no-lonely-if
59+
if (handleGlobalEnterQuickSubmit(e.target)) {
60+
e.preventDefault();
61+
}
5462
}
5563
});
5664
}

web_src/js/features/comp/QuickSubmit.js

+7-6
Original file line numberDiff line numberDiff line change
@@ -3,16 +3,17 @@ export function handleGlobalEnterQuickSubmit(target) {
33
if (form) {
44
if (!form.checkValidity()) {
55
form.reportValidity();
6-
return;
6+
} else {
7+
// here use the event to trigger the submit event (instead of calling `submit()` method directly)
8+
// otherwise the `areYouSure` handler won't be executed, then there will be an annoying "confirm to leave" dialog
9+
form.dispatchEvent(new SubmitEvent('submit', {bubbles: true, cancelable: true}));
710
}
8-
9-
// here use the event to trigger the submit event (instead of calling `submit()` method directly)
10-
// otherwise the `areYouSure` handler won't be executed, then there will be an annoying "confirm to leave" dialog
11-
form.dispatchEvent(new SubmitEvent('submit', {bubbles: true, cancelable: true}));
12-
return;
11+
return true;
1312
}
1413
form = target.closest('.ui.form');
1514
if (form) {
1615
form.querySelector('.ui.primary.button')?.click();
16+
return true;
1717
}
18+
return false;
1819
}

0 commit comments

Comments
 (0)