Skip to content

Commit 18e4cff

Browse files
wxiaoguang6543
authored andcommitted
Use Vue to refactor pull merge UI (go-gitea#19650)
* Use Vue to refactor pull merge UI * add comments * fix comments * small fine tune * fix tests * adopt new pull default messages * clean up Co-authored-by: 6543 <[email protected]>
1 parent 2c6ce39 commit 18e4cff

File tree

7 files changed

+206
-218
lines changed

7 files changed

+206
-218
lines changed

integrations/pull_merge_test.go

Lines changed: 2 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -37,10 +37,8 @@ func testPullMerge(t *testing.T, session *TestSession, user, repo, pullnum strin
3737
req := NewRequest(t, "GET", path.Join(user, repo, "pulls", pullnum))
3838
resp := session.MakeRequest(t, req, http.StatusOK)
3939

40-
// Click the little green button to create a pull
4140
htmlDoc := NewHTMLParser(t, resp.Body)
42-
link, exists := htmlDoc.doc.Find(".ui.form." + string(mergeStyle) + "-fields > form").Attr("action")
43-
assert.True(t, exists, "The template has changed")
41+
link := path.Join(user, repo, "pulls", pullnum, "merge")
4442
req = NewRequestWithValues(t, "POST", link, map[string]string{
4543
"_csrf": htmlDoc.GetCSRF(),
4644
"do": string(mergeStyle),
@@ -57,7 +55,7 @@ func testPullCleanUp(t *testing.T, session *TestSession, user, repo, pullnum str
5755
// Click the little green button to create a pull
5856
htmlDoc := NewHTMLParser(t, resp.Body)
5957
link, exists := htmlDoc.doc.Find(".timeline-item .delete-button").Attr("data-url")
60-
assert.True(t, exists, "The template has changed")
58+
assert.True(t, exists, "The template has changed, can not find delete button url")
6159
req = NewRequestWithValues(t, "POST", link, map[string]string{
6260
"_csrf": htmlDoc.GetCSRF(),
6361
})

models/repo/repo_unit.go

Lines changed: 0 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -150,24 +150,6 @@ func (cfg *PullRequestsConfig) GetDefaultMergeStyle() MergeStyle {
150150
return MergeStyleMerge
151151
}
152152

153-
// AllowedMergeStyleCount returns the total count of allowed merge styles for the PullRequestsConfig
154-
func (cfg *PullRequestsConfig) AllowedMergeStyleCount() int {
155-
count := 0
156-
if cfg.AllowMerge {
157-
count++
158-
}
159-
if cfg.AllowRebase {
160-
count++
161-
}
162-
if cfg.AllowRebaseMerge {
163-
count++
164-
}
165-
if cfg.AllowSquash {
166-
count++
167-
}
168-
return count
169-
}
170-
171153
// BeforeSet is invoked from XORM before setting the value of a field of this object.
172154
func (r *RepoUnit) BeforeSet(colName string, val xorm.Cell) {
173155
switch colName {

templates/repo/issue/view_content/pull.tmpl

Lines changed: 61 additions & 168 deletions
Original file line numberDiff line numberDiff line change
@@ -322,176 +322,69 @@
322322
{{$prUnit := .Repository.MustGetUnit $.UnitTypePullRequests}}
323323
{{$approvers := .Issue.PullRequest.GetApprovers}}
324324
{{if or $prUnit.PullRequestsConfig.AllowMerge $prUnit.PullRequestsConfig.AllowRebase $prUnit.PullRequestsConfig.AllowRebaseMerge $prUnit.PullRequestsConfig.AllowSquash}}
325+
325326
<div class="ui divider"></div>
326-
{{if $prUnit.PullRequestsConfig.AllowMerge}}
327-
<div class="ui form merge-fields" style="display: none">
328-
<form action="{{.Link}}/merge" method="post">
329-
{{.CsrfTokenHtml}}
330-
<input type="hidden" name="head_commit_id" value="{{.PullHeadCommitID}}">
331-
<div class="field">
332-
<input type="text" name="merge_title_field" value="{{.DefaultMergeMessage}}">
333-
</div>
334-
<div class="field">
335-
<textarea name="merge_message_field" rows="5" placeholder="{{$.i18n.Tr "repo.editor.commit_message_desc"}}">Reviewed-on: {{$.Issue.HTMLURL}}&#13;&#10;{{$approvers}}</textarea>
336-
</div>
337-
<button class="ui green button" type="submit" name="do" value="merge">
338-
{{$.i18n.Tr "repo.pulls.merge_pull_request"}}
339-
</button>
340-
<button class="ui button merge-cancel">
341-
{{$.i18n.Tr "cancel"}}
342-
</button>
343-
{{if .IsPullBranchDeletable}}
344-
<div class="ui checkbox ml-2">
345-
<input name="delete_branch_after_merge" type="checkbox" {{if $prUnit.PullRequestsConfig.DefaultDeleteBranchAfterMerge}}checked{{end}}>
346-
<label>{{$.i18n.Tr "repo.branch.delete" .HeadTarget}}</label>
347-
</div>
348-
{{end}}
349-
</form>
350-
</div>
351-
{{end}}
352-
{{if $prUnit.PullRequestsConfig.AllowRebase}}
353-
<div class="ui form rebase-fields" style="display: none">
354-
<form action="{{.Link}}/merge" method="post">
355-
{{.CsrfTokenHtml}}
356-
<input type="hidden" name="head_commit_id" value="{{.PullHeadCommitID}}">
357-
<button class="ui green button" type="submit" name="do" value="rebase">
358-
{{$.i18n.Tr "repo.pulls.rebase_merge_pull_request"}}
359-
</button>
360-
<button class="ui button merge-cancel">
361-
{{$.i18n.Tr "cancel"}}
362-
</button>
363-
{{if .IsPullBranchDeletable}}
364-
<div class="ui checkbox ml-2">
365-
<input name="delete_branch_after_merge" type="checkbox" {{if $prUnit.PullRequestsConfig.DefaultDeleteBranchAfterMerge}}checked{{end}}>
366-
<label>{{$.i18n.Tr "repo.branch.delete" .HeadTarget}}</label>
367-
</div>
368-
{{end}}
369-
</form>
370-
</div>
371-
{{end}}
372-
{{if $prUnit.PullRequestsConfig.AllowRebaseMerge}}
373-
<div class="ui form rebase-merge-fields" style="display: none">
374-
<form action="{{.Link}}/merge" method="post">
375-
{{.CsrfTokenHtml}}
376-
<input type="hidden" name="head_commit_id" value="{{.PullHeadCommitID}}">
377-
<div class="field">
378-
<input type="text" name="merge_title_field" value="{{.DefaultMergeMessage}}">
379-
</div>
380-
<div class="field">
381-
<textarea name="merge_message_field" rows="5" placeholder="{{$.i18n.Tr "repo.editor.commit_message_desc"}}">Reviewed-on: {{$.Issue.HTMLURL}}&#13;&#10;{{$approvers}}</textarea>
382-
</div>
383-
<button class="ui green button" type="submit" name="do" value="rebase-merge">
384-
{{$.i18n.Tr "repo.pulls.rebase_merge_commit_pull_request"}}
385-
</button>
386-
<button class="ui button merge-cancel">
387-
{{$.i18n.Tr "cancel"}}
388-
</button>
389-
{{if .IsPullBranchDeletable}}
390-
<div class="ui checkbox ml-2">
391-
<input name="delete_branch_after_merge" type="checkbox" {{if $prUnit.PullRequestsConfig.DefaultDeleteBranchAfterMerge}}checked{{end}}>
392-
<label>{{$.i18n.Tr "repo.branch.delete" .HeadTarget}}</label>
393-
</div>
394-
{{end}}
395-
</form>
396-
</div>
397-
{{end}}
398-
{{if $prUnit.PullRequestsConfig.AllowSquash}}
399-
<div class="ui form squash-fields" style="display: none">
400-
<form action="{{.Link}}/merge" method="post">
401-
{{.CsrfTokenHtml}}
402-
<input type="hidden" name="head_commit_id" value="{{.PullHeadCommitID}}">
403-
<div class="field">
404-
<input type="text" name="merge_title_field" value="{{.DefaultSquashMergeMessage}}">
405-
</div>
406-
<div class="field">
407-
<textarea name="merge_message_field" rows="5" placeholder="{{$.i18n.Tr "repo.editor.commit_message_desc"}}">{{.GetCommitMessages}}Reviewed-on: {{$.Issue.HTMLURL}}&#13;&#10;{{$approvers}}</textarea>
408-
</div>
409-
<button class="ui green button" type="submit" name="do" value="squash">
410-
{{$.i18n.Tr "repo.pulls.squash_merge_pull_request"}}
411-
</button>
412-
<button class="ui button merge-cancel">
413-
{{$.i18n.Tr "cancel"}}
414-
</button>
415-
{{if .IsPullBranchDeletable}}
416-
<div class="ui checkbox ml-2">
417-
<input name="delete_branch_after_merge" type="checkbox" {{if $prUnit.PullRequestsConfig.DefaultDeleteBranchAfterMerge}}checked{{end}}>
418-
<label>{{$.i18n.Tr "repo.branch.delete" .HeadTarget}}</label>
419-
</div>
420-
{{end}}
421-
</form>
422-
</div>
423-
{{end}}
424-
{{if and $prUnit.PullRequestsConfig.AllowManualMerge $.IsRepoAdmin}}
425-
<div class="ui form manually-merged-fields" style="display: none">
426-
<form action="{{.Link}}/merge" method="post">
427-
{{.CsrfTokenHtml}}
428-
<input type="hidden" name="head_commit_id" value="{{.PullHeadCommitID}}">
429-
<div class="field">
430-
<input type="text" name="merge_commit_id" placeholder="{{$.i18n.Tr "repo.pulls.merge_commit_id"}}">
431-
</div>
432-
<button class="ui red button" type="submit" name="do" value="manually-merged">
433-
{{$.i18n.Tr "repo.pulls.merge_manually"}}
434-
</button>
435-
<button class="ui button merge-cancel">
436-
{{$.i18n.Tr "cancel"}}
437-
</button>
438-
{{if .IsPullBranchDeletable}}
439-
<div class="ui checkbox ml-2">
440-
<input name="delete_branch_after_merge" type="checkbox" {{if $prUnit.PullRequestsConfig.DefaultDeleteBranchAfterMerge}}checked{{end}}>
441-
<label>{{$.i18n.Tr "repo.branch.delete" .HeadTarget}}</label>
442-
</div>
443-
{{end}}
444-
</form>
445-
</div>
446-
{{end}}
447-
<div class="dib">
448-
<div class="ui {{if $notAllOverridableChecksOk}}red{{else}}green{{end}} buttons merge-button">
449-
<button class="ui button" data-do="{{.MergeStyle}}">
450-
{{svg "octicon-git-merge"}}
451-
<span class="button-text">
452-
{{if eq .MergeStyle "merge"}}
453-
{{$.i18n.Tr "repo.pulls.merge_pull_request"}}
454-
{{end}}
455-
{{if eq .MergeStyle "rebase"}}
456-
{{$.i18n.Tr "repo.pulls.rebase_merge_pull_request"}}
457-
{{end}}
458-
{{if eq .MergeStyle "rebase-merge"}}
459-
{{$.i18n.Tr "repo.pulls.rebase_merge_commit_pull_request"}}
460-
{{end}}
461-
{{if eq .MergeStyle "squash"}}
462-
{{$.i18n.Tr "repo.pulls.squash_merge_pull_request"}}
463-
{{end}}
464-
{{if eq .MergeStyle "manually-merged"}}
465-
{{$.i18n.Tr "repo.pulls.merge_manually"}}
466-
{{end}}
467-
</span>
468-
</button>
469-
{{if gt $prUnit.PullRequestsConfig.AllowedMergeStyleCount 1}}
470-
<div class="ui dropdown icon button no-text">
471-
{{svg "octicon-triangle-down" 14 "dropdown icon"}}
472-
<div class="menu">
473-
{{if $prUnit.PullRequestsConfig.AllowMerge}}
474-
<div class="item{{if eq .MergeStyle "merge"}} active selected{{end}}" data-do="merge">{{$.i18n.Tr "repo.pulls.merge_pull_request"}}</div>
475-
{{end}}
476-
{{if $prUnit.PullRequestsConfig.AllowRebase}}
477-
<div class="item{{if eq .MergeStyle "rebase"}} active selected{{end}}" data-do="rebase">{{$.i18n.Tr "repo.pulls.rebase_merge_pull_request"}}</div>
478-
{{end}}
479-
{{if $prUnit.PullRequestsConfig.AllowRebaseMerge}}
480-
<div class="item{{if eq .MergeStyle "rebase-merge"}} active selected{{end}}" data-do="rebase-merge">{{$.i18n.Tr "repo.pulls.rebase_merge_commit_pull_request"}}</div>
481-
{{end}}
482-
{{if $prUnit.PullRequestsConfig.AllowSquash}}
483-
<div class="item{{if eq .MergeStyle "squash"}} active selected{{end}}" data-do="squash">{{$.i18n.Tr "repo.pulls.squash_merge_pull_request"}}</div>
484-
{{end}}
485-
{{if and $prUnit.PullRequestsConfig.AllowManualMerge $.IsRepoAdmin}}
486-
<div class="item{{if eq .MergeStyle "manually-merged"}} active selected{{end}}" data-do="manually-merged">{{$.i18n.Tr "repo.pulls.merge_manually"}}</div>
487-
{{end}}
488-
</div>
489-
</div>
490-
{{end}}
491-
</div>
492-
</div>
327+
328+
<script>
329+
<!-- /* eslint-disable */ -->
330+
(() => {
331+
const defaultMergeTitle = {{.DefaultMergeMessage}};
332+
const defaultSquashMergeTitle = {{.DefaultSquashMergeMessage}};
333+
const defaultMergeMessage = 'Reviewed-on: ' + {{$.Issue.HTMLURL}} + '\n' + {{$approvers}};
334+
const mergeForm = {
335+
'baseLink': {{.Link}},
336+
'textCancel': {{$.i18n.Tr "cancel"}},
337+
'textDeleteBranch': {{$.i18n.Tr "repo.branch.delete" .HeadTarget}},
338+
339+
'allOverridableChecksOk': {{not $notAllOverridableChecksOk}},
340+
'pullHeadCommitID': {{.PullHeadCommitID}},
341+
'isPullBranchDeletable': {{.IsPullBranchDeletable}},
342+
'defaultDeleteBranchAfterMerge': {{$prUnit.PullRequestsConfig.DefaultDeleteBranchAfterMerge}},
343+
'mergeMessageFieldPlaceHolder': {{$.i18n.Tr "repo.editor.commit_message_desc"}},
344+
};
345+
mergeForm['mergeStyles'] = [
346+
{
347+
'name': 'merge',
348+
'allowed': {{$prUnit.PullRequestsConfig.AllowMerge}},
349+
'textDoMerge': {{$.i18n.Tr "repo.pulls.merge_pull_request"}},
350+
'mergeTitleFieldText': defaultMergeTitle,
351+
'mergeMessageFieldText': defaultMergeMessage,
352+
},
353+
{
354+
'name': 'rebase',
355+
'allowed': {{$prUnit.PullRequestsConfig.AllowRebase}},
356+
'textDoMerge': {{$.i18n.Tr "repo.pulls.rebase_merge_pull_request"}},
357+
'hideMergeMessageTexts': true,
358+
},
359+
{
360+
'name': 'rebase-merge',
361+
'allowed': {{$prUnit.PullRequestsConfig.AllowRebaseMerge}},
362+
'textDoMerge': {{$.i18n.Tr "repo.pulls.rebase_merge_commit_pull_request"}},
363+
'mergeTitleFieldText': defaultMergeTitle,
364+
'mergeMessageFieldText': defaultMergeMessage,
365+
},
366+
{
367+
'name': 'squash',
368+
'allowed': {{$prUnit.PullRequestsConfig.AllowSquash}},
369+
'textDoMerge': {{$.i18n.Tr "repo.pulls.squash_merge_pull_request"}},
370+
'mergeTitleFieldText': defaultSquashMergeTitle,
371+
'mergeMessageFieldText': defaultMergeMessage,
372+
},
373+
{
374+
'name': 'manually-merged',
375+
'allowed': {{and $prUnit.PullRequestsConfig.AllowManualMerge $.IsRepoAdmin}},
376+
'textDoMerge': {{$.i18n.Tr "repo.pulls.merge_manually"}},
377+
'hideMergeMessageTexts': true,
378+
}
379+
];
380+
window.config.pageData.pullRequestMergeForm = mergeForm;
381+
})();
382+
</script>
383+
384+
<div id="pull-request-merge-form"></div>
385+
493386
{{if .ShowMergeInstructions}}
494-
<div class="instruct-toggle ml-3"> {{$.i18n.Tr "repo.pulls.merge_instruction_hint" | Safe}} </div>
387+
<div class="instruct-toggle mt-3"> {{$.i18n.Tr "repo.pulls.merge_instruction_hint" | Safe}} </div>
495388
<div class="instruct-content" style="display:none">
496389
<div class="ui divider"></div>
497390
<div><h3 class="di">{{$.i18n.Tr "step1"}} </h3>{{$.i18n.Tr "repo.pulls.merge_instruction_step1_desc"}}</div>

0 commit comments

Comments
 (0)