Refactor repo-issue.ts (#33784)

And remove jQuery
pull/33779/head^2
wxiaoguang 1 week ago committed by GitHub
parent ca0ce003ab
commit 75e85c25c1
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194

@ -202,12 +202,10 @@ jobs:
test-mssql:
if: needs.files-changed.outputs.backend == 'true' || needs.files-changed.outputs.actions == 'true'
needs: files-changed
# specifying the version of ubuntu in use as mssql fails on newer kernels
# pending resolution from vendor
runs-on: ubuntu-20.04
runs-on: ubuntu-latest
services:
mssql:
image: mcr.microsoft.com/mssql/server:2017-latest
image: mcr.microsoft.com/mssql/server:2019-latest
env:
ACCEPT_EULA: Y
MSSQL_PID: Standard

@ -1938,7 +1938,7 @@ pulls.outdated_with_base_branch = This branch is out-of-date with the base branc
pulls.close = Close Pull Request
pulls.closed_at = `closed this pull request <a id="%[1]s" href="#%[1]s">%[2]s</a>`
pulls.reopened_at = `reopened this pull request <a id="%[1]s" href="#%[1]s">%[2]s</a>`
pulls.cmd_instruction_hint = `View <a class="show-instruction">command line instructions</a>.`
pulls.cmd_instruction_hint = View command line instructions
pulls.cmd_instruction_checkout_title = Checkout
pulls.cmd_instruction_checkout_desc = From your project repository, check out a new branch and test the changes.
pulls.cmd_instruction_merge_title = Merge

@ -31,7 +31,9 @@
</div>
<div class="item-right tw-flex tw-items-center tw-m-1">
{{if and $.CanCreateIssueDependencies (not $.Repository.IsArchived)}}
<a class="delete-dependency-button ci muted" data-id="{{.Issue.ID}}" data-type="blocking" data-tooltip-content="{{ctx.Locale.Tr "repo.issues.dependency.remove_info"}}">
<a class="muted show-modal" data-modal="#issue-remove-dependency-confirm"
data-modal-remove-dependency-id="{{.Issue.ID}}" data-modal-dependency-type="blocking"
data-tooltip-content="{{ctx.Locale.Tr "repo.issues.dependency.remove_info"}}">
{{svg "octicon-trash" 16}}
</a>
{{end}}
@ -63,7 +65,9 @@
</div>
<div class="item-right tw-flex tw-items-center tw-m-1">
{{if and $.CanCreateIssueDependencies (not $.Repository.IsArchived)}}
<a class="delete-dependency-button ci muted" data-id="{{.Issue.ID}}" data-type="blockedBy" data-tooltip-content="{{ctx.Locale.Tr "repo.issues.dependency.remove_info"}}">
<a class="muted show-modal" data-modal="#issue-remove-dependency-confirm"
data-modal-remove-dependency-id="{{.Issue.ID}}" data-modal-dependency-type="blockedBy"
data-tooltip-content="{{ctx.Locale.Tr "repo.issues.dependency.remove_info"}}">
{{svg "octicon-trash" 16}}
</a>
{{end}}
@ -86,7 +90,9 @@
</div>
<div class="item-right tw-flex tw-items-center tw-m-1">
{{if and $.CanCreateIssueDependencies (not $.Repository.IsArchived)}}
<a class="delete-dependency-button ci muted" data-id="{{.Issue.ID}}" data-type="blocking" data-tooltip-content="{{ctx.Locale.Tr "repo.issues.dependency.remove_info"}}">
<a class="muted show-modal" data-modal="#issue-remove-dependency-confirm"
data-modal-remove-dependency-id="{{.Issue.ID}}" data-modal-dependency-type="blocking"
data-tooltip-content="{{ctx.Locale.Tr "repo.issues.dependency.remove_info"}}">
{{svg "octicon-trash" 16}}
</a>
{{end}}
@ -106,7 +112,7 @@
<form method="post" action="{{.Issue.Link}}/dependency/add" id="addDependencyForm">
{{$.CsrfTokenHtml}}
<div class="ui fluid action input">
<div class="ui search selection dropdown" id="new-dependency-drop-list" data-issue-id="{{.Issue.ID}}">
<div class="ui search selection dropdown" id="new-dependency-drop-list" data-issue-id="{{.Issue.ID}}" data-issue-cross-repo-search="{{.AllowCrossRepositoryDependencies}}">
<input name="newDependency" type="hidden">
{{svg "octicon-triangle-down" 14 "dropdown icon"}}
<input type="text" class="search">
@ -122,28 +128,19 @@
</div>
{{if and .CanCreateIssueDependencies (not .Repository.IsArchived)}}
<input type="hidden" id="crossRepoSearch" value="{{.AllowCrossRepositoryDependencies}}">
<div class="ui g-modal-confirm modal remove-dependency">
<div class="header">
{{svg "octicon-trash"}}
{{ctx.Locale.Tr "repo.issues.dependency.remove_header"}}
</div>
<form id="issue-remove-dependency-confirm" class="ui g-modal-confirm modal" method="post" action="{{.Issue.Link}}/dependency/delete">
<div class="header">{{svg "octicon-trash"}} {{ctx.Locale.Tr "repo.issues.dependency.remove_header"}}</div>
<div class="content">
<form method="post" action="{{.Issue.Link}}/dependency/delete" id="removeDependencyForm">
{{$.CsrfTokenHtml}}
<input type="hidden" value="" name="removeDependencyID" id="removeDependencyID">
<input type="hidden" value="" name="dependencyType" id="dependencyType">
</form>
<p>{{if .Issue.IsPull}}
{{ctx.Locale.Tr "repo.issues.dependency.pr_remove_text"}}
{{else}}
{{ctx.Locale.Tr "repo.issues.dependency.issue_remove_text"}}
{{end}}</p>
{{$.CsrfTokenHtml}}
<input type="hidden" value="" name="removeDependencyID" class="remove-dependency-id">
<input type="hidden" value="" name="dependencyType" class="dependency-type">
<p>
{{ctx.Locale.Tr (Iif .Issue.IsPull "repo.issues.dependency.pr_remove_text" "repo.issues.dependency.issue_remove_text")}}
</p>
{{$ModalButtonCancelText := ctx.Locale.Tr "repo.issues.dependency.cancel"}}
{{$ModalButtonOkText := ctx.Locale.Tr "repo.issues.dependency.remove"}}
{{template "base/modal_actions_confirm" (dict "." . "ModalButtonCancelText" $ModalButtonCancelText "ModalButtonOkText" $ModalButtonOkText)}}
</div>
{{$ModalButtonCancelText := ctx.Locale.Tr "repo.issues.dependency.cancel"}}
{{$ModalButtonOkText := ctx.Locale.Tr "repo.issues.dependency.remove"}}
{{template "base/modal_actions_confirm" (dict "." . "ModalButtonCancelText" $ModalButtonCancelText "ModalButtonOkText" $ModalButtonOkText)}}
</div>
</form>
{{end}}
{{end}}

@ -1,7 +1,5 @@
{{if and (or .HasIssuesOrPullsWritePermission .IsIssuePoster) (not .HasMerged) (not .Issue.IsClosed) (not .IsPullWorkInProgress)}}
<div class="toggle-wip tw-mt-2" data-title="{{.Issue.Title}}" data-wip-prefix="{{index .PullRequestWorkInProgressPrefixes 0}}" data-update-url="{{.Issue.Link}}/title">
<a class="muted">
{{ctx.Locale.Tr "repo.pulls.still_in_progress"}} {{ctx.Locale.Tr "repo.pulls.add_prefix" (index .PullRequestWorkInProgressPrefixes 0)}}
</a>
</div>
<a class="toggle-wip tw-block tw-mt-2" data-title="{{.Issue.Title}}" data-wip-prefix="{{index .PullRequestWorkInProgressPrefixes 0}}" data-update-url="{{.Issue.Link}}/title">
{{ctx.Locale.Tr "repo.pulls.still_in_progress"}} {{ctx.Locale.Tr "repo.pulls.add_prefix" (index .PullRequestWorkInProgressPrefixes 0)}}
</a>
{{end}}

@ -83,13 +83,13 @@
{{ctx.Locale.Tr "repo.pulls.data_broken"}}
</div>
{{else if .IsPullWorkInProgress}}
<div class="item toggle-wip" data-title="{{.Issue.Title}}" data-wip-prefix="{{.WorkInProgressPrefix}}" data-update-url="{{.Issue.Link}}/title">
<div class="item">
<div class="item-section-left flex-text-inline tw-flex-1">
{{svg "octicon-x"}}
{{ctx.Locale.Tr "repo.pulls.cannot_merge_work_in_progress"}}
</div>
{{if or .HasIssuesOrPullsWritePermission .IsIssuePoster}}
<button class="ui compact button">
<button class="ui compact button toggle-wip" data-title="{{.Issue.Title}}" data-wip-prefix="{{.WorkInProgressPrefix}}" data-update-url="{{.Issue.Link}}/title">
{{ctx.Locale.Tr "repo.pulls.remove_prefix" .WorkInProgressPrefix}}
</button>
{{end}}

@ -1,55 +1,57 @@
<div class="divider"></div>
<div class="instruct-toggle"> {{ctx.Locale.Tr "repo.pulls.cmd_instruction_hint"}} </div>
<div class="instruct-content tw-mt-2 tw-hidden">
<div><h3>{{ctx.Locale.Tr "repo.pulls.cmd_instruction_checkout_title"}}</h3>{{ctx.Locale.Tr "repo.pulls.cmd_instruction_checkout_desc"}}</div>
{{$localBranch := .PullRequest.HeadBranch}}
{{if ne .PullRequest.HeadRepo.ID .PullRequest.BaseRepo.ID}}
{{$localBranch = print .PullRequest.HeadRepo.OwnerName "-" .PullRequest.HeadBranch}}
{{end}}
<div class="ui secondary segment">
{{if eq .PullRequest.Flow 0}}
<div>git fetch -u {{if ne .PullRequest.HeadRepo.ID .PullRequest.BaseRepo.ID}}<origin-url data-url="{{.PullRequest.HeadRepo.Link}}"></origin-url>{{else}}origin{{end}} {{.PullRequest.HeadBranch}}:{{$localBranch}}</div>
{{else}}
<div>git fetch -u origin {{.PullRequest.GetGitRefName}}:{{$localBranch}}</div>
<details>
<summary>{{ctx.Locale.Tr "repo.pulls.cmd_instruction_hint"}}</summary>
<div class="tw-mt-2">
<div><h3>{{ctx.Locale.Tr "repo.pulls.cmd_instruction_checkout_title"}}</h3>{{ctx.Locale.Tr "repo.pulls.cmd_instruction_checkout_desc"}}</div>
{{$localBranch := .PullRequest.HeadBranch}}
{{if ne .PullRequest.HeadRepo.ID .PullRequest.BaseRepo.ID}}
{{$localBranch = print .PullRequest.HeadRepo.OwnerName "-" .PullRequest.HeadBranch}}
{{end}}
<div>git checkout {{$localBranch}}</div>
</div>
{{if .ShowMergeInstructions}}
<div>
<h3>{{ctx.Locale.Tr "repo.pulls.cmd_instruction_merge_title"}}</h3>
{{ctx.Locale.Tr "repo.pulls.cmd_instruction_merge_desc"}}
{{if not .AutodetectManualMerge}}
<div>{{ctx.Locale.Tr "repo.pulls.cmd_instruction_merge_warning"}}</div>
{{end}}
</div>
<div class="ui secondary segment">
<div data-pull-merge-style="merge">
<div>git checkout {{.PullRequest.BaseBranch}}</div>
<div>git merge --no-ff {{$localBranch}}</div>
</div>
<div class="tw-hidden" data-pull-merge-style="rebase">
<div>git checkout {{.PullRequest.BaseBranch}}</div>
<div>git merge --ff-only {{$localBranch}}</div>
</div>
<div class="tw-hidden" data-pull-merge-style="rebase-merge">
<div class="ui secondary segment">
{{if eq .PullRequest.Flow 0}}
<div>git fetch -u {{if ne .PullRequest.HeadRepo.ID .PullRequest.BaseRepo.ID}}<origin-url data-url="{{.PullRequest.HeadRepo.Link}}"></origin-url>{{else}}origin{{end}} {{.PullRequest.HeadBranch}}:{{$localBranch}}</div>
{{else}}
<div>git fetch -u origin {{.PullRequest.GetGitRefName}}:{{$localBranch}}</div>
{{end}}
<div>git checkout {{$localBranch}}</div>
<div>git rebase {{.PullRequest.BaseBranch}}</div>
<div>git checkout {{.PullRequest.BaseBranch}}</div>
<div>git merge --no-ff {{$localBranch}}</div>
</div>
<div class="tw-hidden" data-pull-merge-style="squash">
<div>git checkout {{.PullRequest.BaseBranch}}</div>
<div>git merge --squash {{$localBranch}}</div>
</div>
<div class="tw-hidden" data-pull-merge-style="fast-forward-only">
<div>git checkout {{.PullRequest.BaseBranch}}</div>
<div>git merge --ff-only {{$localBranch}}</div>
{{if .ShowMergeInstructions}}
<div>
<h3>{{ctx.Locale.Tr "repo.pulls.cmd_instruction_merge_title"}}</h3>
{{ctx.Locale.Tr "repo.pulls.cmd_instruction_merge_desc"}}
{{if not .AutodetectManualMerge}}
<div>{{ctx.Locale.Tr "repo.pulls.cmd_instruction_merge_warning"}}</div>
{{end}}
</div>
<div class="tw-hidden" data-pull-merge-style="manually-merged">
<div>git checkout {{.PullRequest.BaseBranch}}</div>
<div>git merge {{$localBranch}}</div>
<div class="ui secondary segment">
<div data-pull-merge-style="merge">
<div>git checkout {{.PullRequest.BaseBranch}}</div>
<div>git merge --no-ff {{$localBranch}}</div>
</div>
<div class="tw-hidden" data-pull-merge-style="rebase">
<div>git checkout {{.PullRequest.BaseBranch}}</div>
<div>git merge --ff-only {{$localBranch}}</div>
</div>
<div class="tw-hidden" data-pull-merge-style="rebase-merge">
<div>git checkout {{$localBranch}}</div>
<div>git rebase {{.PullRequest.BaseBranch}}</div>
<div>git checkout {{.PullRequest.BaseBranch}}</div>
<div>git merge --no-ff {{$localBranch}}</div>
</div>
<div class="tw-hidden" data-pull-merge-style="squash">
<div>git checkout {{.PullRequest.BaseBranch}}</div>
<div>git merge --squash {{$localBranch}}</div>
</div>
<div class="tw-hidden" data-pull-merge-style="fast-forward-only">
<div>git checkout {{.PullRequest.BaseBranch}}</div>
<div>git merge --ff-only {{$localBranch}}</div>
</div>
<div class="tw-hidden" data-pull-merge-style="manually-merged">
<div>git checkout {{.PullRequest.BaseBranch}}</div>
<div>git merge {{$localBranch}}</div>
</div>
<div>git push origin {{.PullRequest.BaseBranch}}</div>
</div>
<div>git push origin {{.PullRequest.BaseBranch}}</div>
{{end}}
</div>
{{end}}
</div>
</details>

@ -8,7 +8,7 @@
<div class="item-section-right">
{{if and $.UpdateAllowed $.UpdateByRebaseAllowed}}
<div class="tw-inline-block">
<div class="ui buttons update-button">
<div id="update-pr-branch-with-base" class="ui buttons">
<button class="ui button" data-do="{{$.Link}}/update" data-redirect="{{$.Link}}">
<span class="button-text">
{{ctx.Locale.Tr "repo.pulls.update_branch"}}

@ -1,4 +1,3 @@
import $ from 'jquery';
import {htmlEscape} from 'escape-goat';
import {createTippy, showTemporaryTooltip} from '../modules/tippy.ts';
import {
@ -21,35 +20,37 @@ import {ignoreAreYouSure} from '../vendor/jquery.are-you-sure.ts';
const {appSubUrl} = window.config;
export function initRepoIssueSidebarList() {
export function initRepoIssueSidebarDependency() {
const elDropdown = document.querySelector('#new-dependency-drop-list');
if (!elDropdown) return;
const issuePageInfo = parseIssuePageInfo();
const crossRepoSearch = $('#crossRepoSearch').val();
const crossRepoSearch = elDropdown.getAttribute('data-issue-cross-repo-search');
let issueSearchUrl = `${issuePageInfo.repoLink}/issues/search?q={query}&type=${issuePageInfo.issueDependencySearchType}`;
if (crossRepoSearch === 'true') {
issueSearchUrl = `${appSubUrl}/issues/search?q={query}&priority_repo_id=${issuePageInfo.repoId}&type=${issuePageInfo.issueDependencySearchType}`;
}
fomanticQuery('#new-dependency-drop-list').dropdown({
fomanticQuery(elDropdown).dropdown({
fullTextSearch: true,
apiSettings: {
cache: false,
rawResponse: true,
url: issueSearchUrl,
onResponse(response: any) {
const filteredResponse = {success: true, results: [] as Array<Record<string, any>>};
const currIssueId = $('#new-dependency-drop-list').data('issue-id');
const currIssueId = elDropdown.getAttribute('data-issue-id');
// Parse the response from the api to work with our dropdown
$.each(response, (_i, issue) => {
for (const issue of response) {
// Don't list current issue in the dependency list.
if (issue.id === currIssueId) {
return;
}
if (String(issue.id) === currIssueId) continue;
filteredResponse.results.push({
value: issue.id,
name: `<div class="gt-ellipsis">#${issue.number} ${htmlEscape(issue.title)}</div>
<div class="text small tw-break-anywhere">${htmlEscape(issue.repository.full_name)}</div>`,
value: issue.id,
});
});
}
return filteredResponse;
},
cache: false,
},
});
}
@ -181,24 +182,6 @@ export function initRepoIssueCommentDelete() {
});
}
export function initRepoIssueDependencyDelete() {
// Delete Issue dependency
$(document).on('click', '.delete-dependency-button', (e) => {
const id = e.currentTarget.getAttribute('data-id');
const type = e.currentTarget.getAttribute('data-type');
$('.remove-dependency').modal({
closable: false,
duration: 200,
onApprove: () => {
$('#removeDependencyID').val(id);
$('#dependencyType').val(type);
$('#removeDependencyForm').trigger('submit');
},
}).modal('show');
});
}
export function initRepoIssueCodeCommentCancel() {
// Cancel inline code comment
document.addEventListener('click', (e: DOMEvent<MouseEvent>) => {
@ -215,11 +198,12 @@ export function initRepoIssueCodeCommentCancel() {
}
export function initRepoPullRequestUpdate() {
// Pull Request update button
const pullUpdateButton = document.querySelector<HTMLButtonElement>('.update-button > button');
if (!pullUpdateButton) return;
const prUpdateButtonContainer = document.querySelector('#update-pr-branch-with-base');
if (!prUpdateButtonContainer) return;
pullUpdateButton.addEventListener('click', async function (e) {
const prUpdateButton = prUpdateButtonContainer.querySelector<HTMLButtonElement>(':scope > button');
const prUpdateDropdown = prUpdateButtonContainer.querySelector(':scope > .ui.dropdown');
prUpdateButton.addEventListener('click', async function (e) {
e.preventDefault();
const redirect = this.getAttribute('data-redirect');
this.classList.add('is-loading');
@ -246,27 +230,21 @@ export function initRepoPullRequestUpdate() {
}
});
$('.update-button > .dropdown').dropdown({
fomanticQuery(prUpdateDropdown).dropdown({
onChange(_text: string, _value: string, $choice: any) {
const choiceEl = $choice[0];
const url = choiceEl.getAttribute('data-do');
if (url) {
const buttonText = pullUpdateButton.querySelector('.button-text');
const buttonText = prUpdateButton.querySelector('.button-text');
if (buttonText) {
buttonText.textContent = choiceEl.textContent;
}
pullUpdateButton.setAttribute('data-do', url);
prUpdateButton.setAttribute('data-do', url);
}
},
});
}
export function initRepoPullRequestMergeInstruction() {
$('.show-instruction').on('click', () => {
toggleElem($('.instruct-content'));
});
}
export function initRepoPullRequestAllowMaintainerEdit() {
const wrapper = document.querySelector('#allow-edits-from-maintainers');
if (!wrapper) return;
@ -293,54 +271,8 @@ export function initRepoPullRequestAllowMaintainerEdit() {
});
}
export function initRepoIssueReferenceRepositorySearch() {
$('.issue_reference_repository_search')
.dropdown({
apiSettings: {
url: `${appSubUrl}/repo/search?q={query}&limit=20`,
onResponse(response: any) {
const filteredResponse = {success: true, results: [] as Array<Record<string, any>>};
$.each(response.data, (_r, repo) => {
filteredResponse.results.push({
name: htmlEscape(repo.repository.full_name),
value: repo.repository.full_name,
});
});
return filteredResponse;
},
cache: false,
},
onChange(_value: string, _text: string, $choice: any) {
const $form = $choice.closest('form');
if (!$form.length) return;
$form[0].setAttribute('action', `${appSubUrl}/${_text}/issues/new`);
},
fullTextSearch: true,
});
}
export function initRepoIssueWipTitle() {
$('.title_wip_desc > a').on('click', (e) => {
e.preventDefault();
const $issueTitle = $('#issue_title');
$issueTitle.trigger('focus');
const value = ($issueTitle.val() as string).trim().toUpperCase();
const wipPrefixes = $('.title_wip_desc').data('wip-prefixes');
for (const prefix of wipPrefixes) {
if (value.startsWith(prefix.toUpperCase())) {
return;
}
}
$issueTitle.val(`${wipPrefixes[0]} ${$issueTitle.val()}`);
});
}
export function initRepoIssueComments() {
if (!$('.repository.view.issue .timeline').length) return;
if (!document.querySelector('.repository.view.issue .timeline')) return;
document.addEventListener('click', (e: DOMEvent<MouseEvent>) => {
const urlTarget = document.querySelector(':target');
@ -352,9 +284,9 @@ export function initRepoIssueComments() {
if (!/^(issue|pull)(comment)?-\d+$/.test(urlTargetId)) return;
if (!e.target.closest(`#${urlTargetId}`)) {
const scrollPosition = $(window).scrollTop();
window.location.hash = '';
$(window).scrollTop(scrollPosition);
// if the user clicks outside the comment, remove the hash from the url
// use empty hash and state to avoid scrolling
window.location.hash = ' ';
window.history.pushState(null, null, ' ');
}
});
@ -395,31 +327,31 @@ export function initRepoPullRequestReview() {
}
}
$(document).on('click', '.show-outdated', function (e) {
addDelegatedEventListener(document, 'click', '.show-outdated', (el, e) => {
e.preventDefault();
const id = this.getAttribute('data-comment');
hideElem(this);
const id = el.getAttribute('data-comment');
hideElem(el);
showElem(`#code-comments-${id}`);
showElem(`#code-preview-${id}`);
showElem(`#hide-outdated-${id}`);
});
$(document).on('click', '.hide-outdated', function (e) {
addDelegatedEventListener(document, 'click', '.hide-outdated', (el, e) => {
e.preventDefault();
const id = this.getAttribute('data-comment');
hideElem(this);
const id = el.getAttribute('data-comment');
hideElem(el);
hideElem(`#code-comments-${id}`);
hideElem(`#code-preview-${id}`);
showElem(`#show-outdated-${id}`);
});
$(document).on('click', 'button.comment-form-reply', async function (e) {
addDelegatedEventListener(document, 'click', 'button.comment-form-reply', (el, e) => {
e.preventDefault();
await handleReply(this);
handleReply(el);
});
// The following part is only for diff views
if (!$('.repository.pull.diff').length) return;
if (!document.querySelector('.repository.pull.diff')) return;
const elReviewBtn = document.querySelector('.js-btn-review');
const elReviewPanel = document.querySelector('.review-box-panel.tippy-target');
@ -474,26 +406,67 @@ export function initRepoPullRequestReview() {
}
export function initRepoIssueReferenceIssue() {
const elDropdown = document.querySelector('.issue_reference_repository_search');
if (!elDropdown) return;
const form = elDropdown.closest('form');
fomanticQuery(elDropdown).dropdown({
fullTextSearch: true,
apiSettings: {
cache: false,
rawResponse: true,
url: `${appSubUrl}/repo/search?q={query}&limit=20`,
onResponse(response: any) {
const filteredResponse = {success: true, results: [] as Array<Record<string, any>>};
for (const repo of response.data) {
filteredResponse.results.push({
name: htmlEscape(repo.repository.full_name),
value: repo.repository.full_name,
});
}
return filteredResponse;
},
},
onChange(_value: string, _text: string, _$choice: any) {
form.setAttribute('action', `${appSubUrl}/${_text}/issues/new`);
},
});
// Reference issue
$(document).on('click', '.reference-issue', function (e) {
const target = this.getAttribute('data-target');
addDelegatedEventListener(document, 'click', '.reference-issue', (el, e) => {
e.preventDefault();
const target = el.getAttribute('data-target');
const content = document.querySelector(`#${target}`)?.textContent ?? '';
const poster = this.getAttribute('data-poster-username');
const reference = toAbsoluteUrl(this.getAttribute('data-reference'));
const modalSelector = this.getAttribute('data-modal');
const poster = el.getAttribute('data-poster-username');
const reference = toAbsoluteUrl(el.getAttribute('data-reference'));
const modalSelector = el.getAttribute('data-modal');
const modal = document.querySelector(modalSelector);
const textarea = modal.querySelector('textarea[name="content"]');
const textarea = modal.querySelector<HTMLTextAreaElement>('textarea[name="content"]');
textarea.value = `${content}\n\n_Originally posted by @${poster} in ${reference}_`;
$(modal).modal('show');
e.preventDefault();
fomanticQuery(modal).modal('show');
});
}
export function initRepoIssueWipNewTitle() {
// Toggle WIP for new PR
queryElems(document, '.title_wip_desc > a', (el) => el.addEventListener('click', (e) => {
e.preventDefault();
const wipPrefixes = JSON.parse(el.closest('.title_wip_desc').getAttribute('data-wip-prefixes'));
const titleInput = document.querySelector<HTMLInputElement>('#issue_title');
const titleValue = titleInput.value;
for (const prefix of wipPrefixes) {
if (titleValue.startsWith(prefix.toUpperCase())) {
return;
}
}
titleInput.value = `${wipPrefixes[0]} ${titleValue}`;
}));
}
export function initRepoIssueWipToggle() {
// Toggle WIP
$('.toggle-wip a, .toggle-wip button').on('click', async (e) => {
// Toggle WIP for existing PR
queryElems(document, '.toggle-wip', (el) => el.addEventListener('click', async (e) => {
e.preventDefault();
const toggleWip = e.currentTarget.closest('.toggle-wip');
const toggleWip = el;
const title = toggleWip.getAttribute('data-title');
const wipPrefix = toggleWip.getAttribute('data-wip-prefix');
const updateUrl = toggleWip.getAttribute('data-update-url');
@ -510,7 +483,7 @@ export function initRepoIssueWipToggle() {
} catch (error) {
console.error(error);
}
});
}));
}
export function initRepoIssueTitleEdit() {
@ -583,11 +556,11 @@ export function initRepoIssueBranchSelect() {
});
}
async function initSingleCommentEditor($commentForm: any) {
async function initSingleCommentEditor(commentForm: HTMLFormElement) {
// pages:
// * normal new issue/pr page: no status-button, no comment-button (there is only a normal submit button which can submit empty content)
// * issue/pr view page: with comment form, has status-button and comment-button
const editor = await initComboMarkdownEditor($commentForm[0].querySelector('.combo-markdown-editor'));
const editor = await initComboMarkdownEditor(commentForm.querySelector('.combo-markdown-editor'));
const statusButton = document.querySelector<HTMLButtonElement>('#status-button');
const commentButton = document.querySelector<HTMLButtonElement>('#comment-button');
const syncUiState = () => {
@ -605,27 +578,27 @@ async function initSingleCommentEditor($commentForm: any) {
syncUiState();
}
function initIssueTemplateCommentEditors($commentForm: any) {
function initIssueTemplateCommentEditors(commentForm: HTMLFormElement) {
// pages:
// * new issue with issue template
const $comboFields = $commentForm.find('.combo-editor-dropzone');
const comboFields = commentForm.querySelectorAll<HTMLElement>('.combo-editor-dropzone');
const initCombo = async (elCombo: HTMLElement) => {
const $formField = $(elCombo.querySelector('.form-field-real'));
const fieldTextarea = elCombo.querySelector<HTMLTextAreaElement>('.form-field-real');
const dropzoneContainer = elCombo.querySelector<HTMLElement>('.form-field-dropzone');
const markdownEditor = elCombo.querySelector<HTMLElement>('.combo-markdown-editor');
const editor = await initComboMarkdownEditor(markdownEditor);
editor.container.addEventListener(ComboMarkdownEditor.EventEditorContentChanged, () => $formField.val(editor.value()));
editor.container.addEventListener(ComboMarkdownEditor.EventEditorContentChanged, () => fieldTextarea.value = editor.value());
$formField.on('focus', async () => {
fieldTextarea.addEventListener('focus', async () => {
// deactivate all markdown editors
showElem($commentForm.find('.combo-editor-dropzone .form-field-real'));
hideElem($commentForm.find('.combo-editor-dropzone .combo-markdown-editor'));
hideElem($commentForm.find('.combo-editor-dropzone .form-field-dropzone'));
showElem(commentForm.querySelectorAll('.combo-editor-dropzone .form-field-real'));
hideElem(commentForm.querySelectorAll('.combo-editor-dropzone .combo-markdown-editor'));
hideElem(commentForm.querySelectorAll('.combo-editor-dropzone .form-field-dropzone'));
// activate this markdown editor
hideElem($formField);
hideElem(fieldTextarea);
showElem(markdownEditor);
showElem(dropzoneContainer);
@ -634,21 +607,21 @@ function initIssueTemplateCommentEditors($commentForm: any) {
});
};
for (const el of $comboFields) {
for (const el of comboFields) {
initCombo(el);
}
}
export function initRepoCommentFormAndSidebar() {
const $commentForm = $('.comment.form');
if (!$commentForm.length) return;
const commentForm = document.querySelector<HTMLFormElement>('.comment.form');
if (!commentForm) return;
if ($commentForm.find('.field.combo-editor-dropzone').length) {
if (commentForm.querySelector('.field.combo-editor-dropzone')) {
// at the moment, if a form has multiple combo-markdown-editors, it must be an issue template form
initIssueTemplateCommentEditors($commentForm);
} else if ($commentForm.find('.combo-markdown-editor').length) {
initIssueTemplateCommentEditors(commentForm);
} else if (commentForm.querySelector('.combo-markdown-editor')) {
// it's quite unclear about the "comment form" elements, sometimes it's for issue comment, sometimes it's for file editor/uploader message
initSingleCommentEditor($commentForm);
initSingleCommentEditor(commentForm);
}
initRepoIssueSidebar();

@ -2,8 +2,8 @@ import {registerGlobalInitFunc} from '../modules/observer.ts';
import {
initRepoCommentFormAndSidebar,
initRepoIssueBranchSelect, initRepoIssueCodeCommentCancel, initRepoIssueCommentDelete,
initRepoIssueComments, initRepoIssueDependencyDelete, initRepoIssueReferenceIssue,
initRepoIssueTitleEdit, initRepoIssueWipToggle,
initRepoIssueComments, initRepoIssueReferenceIssue,
initRepoIssueTitleEdit, initRepoIssueWipNewTitle, initRepoIssueWipToggle,
initRepoPullRequestUpdate,
} from './repo-issue.ts';
import {initUnicodeEscapeButton} from './repo-unicode-escape.ts';
@ -54,6 +54,7 @@ export function initRepository() {
initRepoCloneButtons();
initCitationFileCopyContent();
initRepoSettings();
initRepoIssueWipNewTitle();
// Issues
if (pageContent.matches('.page-content.repository.view.issue')) {
@ -67,7 +68,6 @@ export function initRepository() {
initRepoIssueReferenceIssue();
initRepoIssueCommentDelete();
initRepoIssueDependencyDelete();
initRepoIssueCodeCommentCancel();
initRepoPullRequestUpdate();
initCompReactionSelector();

@ -20,15 +20,8 @@ import {initStopwatch} from './features/stopwatch.ts';
import {initFindFileInRepo} from './features/repo-findfile.ts';
import {initMarkupContent} from './markup/content.ts';
import {initPdfViewer} from './render/pdf.ts';
import {initUserAuthOauth2, initUserCheckAppUrl} from './features/user-auth.ts';
import {
initRepoIssueReferenceRepositorySearch,
initRepoIssueWipTitle,
initRepoPullRequestMergeInstruction,
initRepoPullRequestAllowMaintainerEdit,
initRepoPullRequestReview, initRepoIssueSidebarList, initRepoIssueFilterItemLabel,
} from './features/repo-issue.ts';
import {initRepoPullRequestAllowMaintainerEdit, initRepoPullRequestReview, initRepoIssueSidebarDependency, initRepoIssueFilterItemLabel} from './features/repo-issue.ts';
import {initRepoEllipsisButton, initCommitStatuses} from './features/repo-commit.ts';
import {initRepoTopicBar} from './features/repo-home.ts';
import {initAdminCommon} from './features/admin/common.ts';
@ -137,13 +130,10 @@ onDomReady(() => {
initRepoIssueContentHistory,
initRepoIssueList,
initRepoIssueFilterItemLabel,
initRepoIssueSidebarList,
initRepoIssueReferenceRepositorySearch,
initRepoIssueWipTitle,
initRepoIssueSidebarDependency,
initRepoMigration,
initRepoMigrationStatusChecker,
initRepoProject,
initRepoPullRequestMergeInstruction,
initRepoPullRequestAllowMaintainerEdit,
initRepoPullRequestReview,
initRepoRelease,

Loading…
Cancel
Save