{{if not .IsForcePush}}
- {{template "repo/commits_list_small" dict "comment" . "root" $}}
+ {{template "repo/commits_list_small" dict "comment" $comment}}
{{end}}
{{else if eq .Type 30}}
diff --git a/templates/repo/issue/view_content/context_menu.tmpl b/templates/repo/issue/view_content/context_menu.tmpl
index 59ee728c509..80c89aa927f 100644
--- a/templates/repo/issue/view_content/context_menu.tmpl
+++ b/templates/repo/issue/view_content/context_menu.tmpl
@@ -26,7 +26,7 @@
{{ctx.Locale.Tr "repo.issues.context.edit"}}
{{if $supportDelete}}
-
{{ctx.Locale.Tr "repo.issues.context.delete"}}
+
{{ctx.Locale.Tr "repo.issues.context.delete"}}
{{end}}
{{end}}
{{end}}
diff --git a/tests/e2e/pr-review.test.ts b/tests/e2e/pr-review.test.ts
index ba07fa455c9..6e7acb96d33 100644
--- a/tests/e2e/pr-review.test.ts
+++ b/tests/e2e/pr-review.test.ts
@@ -117,8 +117,13 @@ test('pr review flow', async ({page, request}) => {
const pendingComment = fileBox.locator('.comment').filter({hasText: 'pending review comment'});
await expect(pendingComment.locator('[data-clipboard-text]')).toHaveAttribute('data-clipboard-text', /\/files#issuecomment-\d+$/);
await pendingComment.getByRole('menu').filter({has: page.getByRole('menuitem', {name: 'Delete', exact: true, includeHidden: true})}).click();
- page.once('dialog', (dialog) => dialog.accept());
await pendingComment.getByRole('menuitem', {name: 'Delete', exact: true}).click();
+ await page.getByRole('button', {name: 'Cancel', exact: true}).click();
+ await expect(pendingComment).toBeVisible();
+ await expect(counter).toHaveAttribute('data-pending-comment-number', '1');
+ await pendingComment.getByRole('menu').filter({has: page.getByRole('menuitem', {name: 'Delete', exact: true, includeHidden: true})}).click();
+ await pendingComment.getByRole('menuitem', {name: 'Delete', exact: true}).click();
+ await page.getByRole('button', {name: 'Confirm', exact: true}).click();
await expect(pendingComment).toHaveCount(0);
await expect(counter).toHaveAttribute('data-pending-comment-number', '0');
await expect(counter).toHaveText('0');
diff --git a/web_src/css/repo.css b/web_src/css/repo.css
index ff4f66d0939..383e61b3f3b 100644
--- a/web_src/css/repo.css
+++ b/web_src/css/repo.css
@@ -620,10 +620,6 @@
min-width: 0;
}
-.repository .comment.form .content .field:first-child {
- clear: none;
-}
-
.repository.new.milestone textarea {
height: 200px;
}
diff --git a/web_src/js/components/RepoActionView.vue b/web_src/js/components/RepoActionView.vue
index 445e140e22c..a5f432ff547 100644
--- a/web_src/js/components/RepoActionView.vue
+++ b/web_src/js/components/RepoActionView.vue
@@ -10,6 +10,7 @@ import type {ActionsJob, ActionsRunAttempt} from '../modules/gitea-actions.ts';
import {buildJobsByParentJobID, createActionRunViewStore} from './ActionRunView.ts';
import {buildArtifactTooltipHtml} from './ActionRunArtifacts.ts';
import {trString} from '../modules/i18n.ts';
+import {confirmModal} from '../features/comp/ConfirmModal.ts';
defineOptions({
name: 'RepoActionView',
@@ -142,8 +143,9 @@ function approveRun() {
}
async function deleteArtifact(name: string) {
- if (!window.confirm(trString(locale.confirmDeleteArtifact, name))) return;
- await DELETE(buildArtifactLink(name));
+ const artifactLink = buildArtifactLink(name);
+ if (!await confirmModal({content: trString(locale.confirmDeleteArtifact, name), confirmButtonColor: 'red'})) return;
+ await DELETE(artifactLink);
await store.forceReloadCurrentRun();
}
diff --git a/web_src/js/features/common-organization.ts b/web_src/js/features/common-organization.ts
deleted file mode 100644
index 0e616134b97..00000000000
--- a/web_src/js/features/common-organization.ts
+++ /dev/null
@@ -1,16 +0,0 @@
-import {initCompLabelEdit} from './comp/LabelEdit.ts';
-import {toggleElem} from '../utils/dom.ts';
-
-export function initCommonOrganization() {
- if (!document.querySelectorAll('.organization').length) {
- return;
- }
-
- document.querySelector
('.organization.settings.options #org_name')?.addEventListener('input', function () {
- const nameChanged = this.value.toLowerCase() !== this.getAttribute('data-org-name')!.toLowerCase();
- toggleElem('#org-name-change-prompt', nameChanged);
- });
-
- // Labels
- initCompLabelEdit('.page-content.organization.settings.labels');
-}
diff --git a/web_src/js/features/comp/LabelEdit.ts b/web_src/js/features/comp/LabelEdit.ts
index 1adf9022215..e10863e94ff 100644
--- a/web_src/js/features/comp/LabelEdit.ts
+++ b/web_src/js/features/comp/LabelEdit.ts
@@ -1,19 +1,13 @@
-import {toggleElem} from '../../utils/dom.ts';
+import {queryElems, toggleElem} from '../../utils/dom.ts';
import {showFomanticModal} from '../../modules/fomantic/modal.ts';
import {submitFormFetchAction} from '../../modules/fetch-action.ts';
+import {registerGlobalInitFunc} from '../../modules/observer.ts';
function nameHasScope(name: string): boolean {
return /.*[^/]\/[^/].*/.test(name);
}
-export function initCompLabelEdit(pageSelector: string) {
- const pageContent = document.querySelector(pageSelector);
- if (!pageContent) return;
-
- // for guest view, the modal is not available, the "labels" are read-only
- const elModal = pageContent.querySelector('#issue-label-edit-modal');
- if (!elModal) return;
-
+function initLabelEditModal(elModal: HTMLElement) {
const elLabelId = elModal.querySelector('input[name="id"]')!;
const elNameInput = elModal.querySelector('.label-name-input')!;
const elExclusiveField = elModal.querySelector('.label-exclusive-input-field')!;
@@ -79,15 +73,15 @@ export function initCompLabelEdit(pageSelector: string) {
elModal.addEventListener('input', () => syncModalUi());
- // theoretically, if the modal exists, the "new label" button should also exist, just in case it doesn't, use "?."
- const elNewLabel = pageContent.querySelector('.ui.button.new-label');
- elNewLabel?.addEventListener('click', () => showLabelEditModal(elNewLabel));
+ const elNewLabel = document.querySelector('.ui.button.new-label')!;
+ elNewLabel.addEventListener('click', () => showLabelEditModal(elNewLabel));
- const elEditLabelButtons = pageContent.querySelectorAll('.edit-label-button');
- for (const btn of elEditLabelButtons) {
- btn.addEventListener('click', (e) => {
- e.preventDefault();
- showLabelEditModal(btn);
- });
- }
+ queryElems(document, '.edit-label-button', (btn) => btn.addEventListener('click', (e) => {
+ e.preventDefault();
+ showLabelEditModal(btn);
+ }));
+}
+
+export function initCompLabelEdit() {
+ registerGlobalInitFunc('initLabelEditModal', initLabelEditModal);
}
diff --git a/web_src/js/features/repo-issue-content.ts b/web_src/js/features/repo-issue-content.ts
index 53caf03520b..5665da6fe10 100644
--- a/web_src/js/features/repo-issue-content.ts
+++ b/web_src/js/features/repo-issue-content.ts
@@ -39,6 +39,7 @@ function showContentHistoryDetail(issueBaseUrl: string, commentId: string, histo
async onChange(_value: string, _text: string, $item: JQueryElem) {
const optionItem = $item.data('option-item');
if (optionItem === 'delete') {
+ // TODO: to use confirmModal instead of window.confirm, need to support multiple modals on the same page first.
if (window.confirm(i18nTextDeleteFromHistoryConfirm)) {
try {
const params = new URLSearchParams();
diff --git a/web_src/js/features/repo-issue.ts b/web_src/js/features/repo-issue.ts
index 3c6c0be32bd..c105494fd1e 100644
--- a/web_src/js/features/repo-issue.ts
+++ b/web_src/js/features/repo-issue.ts
@@ -7,19 +7,19 @@ import {
hideElem,
queryElems,
showElem,
- toggleElem,
+ toggleElem, toggleElemClass,
} from '../utils/dom.ts';
import {setFileFolding} from './file-fold.ts';
import {ComboMarkdownEditor, getComboMarkdownEditor, initComboMarkdownEditor} from './comp/ComboMarkdownEditor.ts';
import {GET, POST} from '../modules/fetch.ts';
import {showErrorToast} from '../modules/toast.ts';
-import {initRepoIssueSidebar} from './repo-issue-sidebar.ts';
import {fomanticQuery} from '../modules/fomantic/base.ts';
import {showFomanticModal} from '../modules/fomantic/modal.ts';
import {ignoreAreYouSure} from '../modules/are-you-sure.ts';
import {registerGlobalEventFunc, registerGlobalInitFunc} from '../modules/observer.ts';
import type {FomanticApiResponse} from '../types.ts';
import {performFetchActionRequest} from '../modules/fetch-action.ts';
+import {confirmModal} from './comp/ConfirmModal.ts';
const {appSubUrl} = window.config;
@@ -96,40 +96,48 @@ export function initRepoIssueFilterItemLabel() {
export function initRepoIssueCommentDelete() {
registerGlobalEventFunc('click', 'onConvContentDelete', async (deleteButton) => {
- if (!window.confirm(deleteButton.getAttribute('data-locale')!)) return;
+ if (!await confirmModal({content: deleteButton.getAttribute('data-locale')!, confirmButtonColor: 'red'})) return;
- const response = await performFetchActionRequest(deleteButton, {method: 'POST', url: deleteButton.getAttribute('data-url')!});
- if (!response) return;
+ const resp = await performFetchActionRequest(deleteButton, {method: 'POST', url: deleteButton.getAttribute('data-url')!});
+ if (!resp) return;
+ // query the parent elements of the delete button before the comment (with the delete button) is removed from the DOM
const conversationHolder = deleteButton.closest('.conversation-holder');
- const parentTimelineItem = deleteButton.closest('.timeline-item');
const parentTimelineGroup = deleteButton.closest('.timeline-item-group');
+ const parentTimelineItem = deleteButton.closest('.timeline-item');
- // Check if this was a pending comment.
- if (conversationHolder?.querySelector('.pending-label')) {
- const counter = document.querySelector('.review-box-button .review-comments-counter')!;
- let num = parseInt(counter?.getAttribute('data-pending-comment-number') || '') - 1 || 0;
- num = Math.max(num, 0);
- counter.setAttribute('data-pending-comment-number', String(num));
- counter.textContent = String(num);
+ // Delete the current comment from the DOM
+ const commentHashTag = deleteButton.getAttribute('data-comment-hash-tag')!;
+ const deletedComment = document.querySelector(`#${commentHashTag}`);
+ deletedComment?.remove();
+
+ // only pr review comments have the "conversation-holder" element, so if it's not found, we can return early
+ if (!conversationHolder) return;
+
+ // Check if this was a pending comment for a review, and if so, update the pending comment counter in the review box button.
+ if (deletedComment?.querySelector('.pending-label')) {
+ const reviewCounter = document.querySelector('.review-box-button .review-comments-counter');
+ if (reviewCounter) {
+ let num = parseInt(reviewCounter.getAttribute('data-pending-comment-number') || '') - 1 || 0;
+ num = Math.max(num, 0);
+ reviewCounter.setAttribute('data-pending-comment-number', String(num));
+ reviewCounter.textContent = String(num);
+ }
}
- document.querySelector(`#${deleteButton.getAttribute('data-comment-id')}`)?.remove();
-
- if (conversationHolder && !conversationHolder.querySelector('.comment')) {
- const path = conversationHolder.getAttribute('data-path');
- const side = conversationHolder.getAttribute('data-side');
- const idx = conversationHolder.getAttribute('data-idx');
- const lineType = conversationHolder.closest('tr')?.getAttribute('data-line-type');
-
+ // If the conversation holder has no more comments, remove it.
+ if (!conversationHolder.querySelector('.comment')) {
// the conversation holder could appear either on the "Conversation" page, or the "Files Changed" page
- // on the Conversation page, there is no parent "tr", so no need to do anything for "add-code-comment"
- if (lineType) {
- if (lineType === 'same') {
- document.querySelector(`[data-path="${CSS.escape(String(path))}"] .add-code-comment[data-idx="${CSS.escape(String(idx))}"]`)!.classList.remove('tw-invisible');
- } else {
- document.querySelector(`[data-path="${CSS.escape(String(path))}"] .add-code-comment[data-side="${CSS.escape(String(side))}"][data-idx="${CSS.escape(String(idx))}"]`)!.classList.remove('tw-invisible');
- }
+ // on the Conversation page, there is no parent "tr", so no need to do anything for "add-code-comment" button
+ const parentTr = conversationHolder.closest('tr[data-line-type]');
+ if (parentTr) {
+ // allow to add a new comment on the same line after deleting the existing comments
+ // previous element is the "tr" for the code line, and it contains the "add-code-comment" button
+ const isLineSame = parentTr.getAttribute('data-line-type') === 'same';
+ const side = conversationHolder.getAttribute('data-side')!;
+ const selector = isLineSame ? '.add-code-comment' : `.add-code-comment[data-side=${CSS.escape(side)}]`;
+ const addCodeCommentButtons = parentTr.previousElementSibling!.querySelectorAll(selector);
+ toggleElemClass(addCodeCommentButtons, 'tw-invisible', false);
}
conversationHolder.remove();
}
@@ -154,8 +162,8 @@ export function initRepoIssueCodeCommentCancel() {
});
}
-export function initRepoIssueComments() {
- if (!document.querySelector('.repository.view.issue .timeline')) return;
+export function initRepoIssueCommentTargetHashReset() {
+ if (!document.querySelector('.repository.view.issue')) return;
document.addEventListener('click', (e: Event) => {
const urlTarget = document.querySelector(':target');
@@ -491,9 +499,7 @@ function initIssueTemplateCommentEditors(commentForm: HTMLFormElement) {
}
}
-export function initRepoCommentFormAndSidebar() {
- initRepoIssueSidebar();
-
+export function initRepoCommentForm() {
const commentForm = document.querySelector('.comment.form');
if (!commentForm) return;
diff --git a/web_src/js/features/repo-legacy.ts b/web_src/js/features/repo-legacy.ts
index 9656604790f..7a54b033f40 100644
--- a/web_src/js/features/repo-legacy.ts
+++ b/web_src/js/features/repo-legacy.ts
@@ -1,14 +1,13 @@
import {registerGlobalInitFunc} from '../modules/observer.ts';
import {
- initRepoCommentFormAndSidebar,
+ initRepoCommentForm,
initRepoIssueCodeCommentCancel, initRepoIssueCommentDelete,
- initRepoIssueComments, initRepoIssueReferenceIssue,
+ initRepoIssueCommentTargetHashReset, initRepoIssueReferenceIssue,
initRepoIssueTitleEdit, initRepoIssueWipNewTitle, initRepoIssueWipToggle,
} from './repo-issue.ts';
import {initUnicodeEscapeButton} from './repo-unicode-escape.ts';
import {initRepoCloneButtons} from './repo-common.ts';
import {initRepoCitationPanel} from './citation.ts';
-import {initCompLabelEdit} from './comp/LabelEdit.ts';
import {initCompReactionSelector} from './comp/ReactionSelector.ts';
import {initRepoSettings} from './repo-settings.ts';
import {hideElem, queryElemChildren, queryElems, showElem} from '../utils/dom.ts';
@@ -18,6 +17,7 @@ import {initRepoNew} from './repo-new.ts';
import {createApp} from 'vue';
import RepoBranchTagSelector from '../components/RepoBranchTagSelector.vue';
import {initRepoPullMergeBox, initRepoPullRequestUpdate} from './repo-issue-pull.ts';
+import {initRepoIssueSidebar} from './repo-issue-sidebar.ts';
function initRepoBranchTagSelector() {
registerGlobalInitFunc('initRepoBranchTagSelector', (elRoot: HTMLInputElement) => {
@@ -47,9 +47,9 @@ export function initRepository() {
if (!pageContent) return;
initRepoBranchTagSelector();
- initRepoCommentFormAndSidebar();
+ initRepoIssueSidebar();
+ initRepoCommentForm();
- initCompLabelEdit('.page-content.repository.labels');
initRepoMilestone();
initRepoNew();
@@ -61,14 +61,14 @@ export function initRepository() {
initRepoIssueCommentDelete();
initRepoIssueCodeCommentCancel();
+ initCompReactionSelector();
+
if (pageContent.matches('.page-content.repository.view.issue')) {
initRepoIssueTitleEdit();
initRepoIssueWipToggle();
- initRepoIssueComments();
+ initRepoIssueCommentTargetHashReset();
initRepoIssueReferenceIssue();
-
- initCompReactionSelector();
}
initUnicodeEscapeButton();
diff --git a/web_src/js/index.ts b/web_src/js/index.ts
index cf0d85e3fd0..94df261a952 100644
--- a/web_src/js/index.ts
+++ b/web_src/js/index.ts
@@ -36,8 +36,8 @@ import {initRepoEditor} from './features/repo-editor.ts';
import {initCompSearchUserBox} from './features/comp/SearchUserBox.ts';
import {initInstall} from './features/install.ts';
import {initCompWebHookEditor} from './features/comp/WebHookEditor.ts';
+import {initCompLabelEdit} from './features/comp/LabelEdit.ts';
import {initRepoBranchButton} from './features/repo-branch.ts';
-import {initCommonOrganization} from './features/common-organization.ts';
import {initRepoWiki} from './features/repo-wiki.ts';
import {initRepository, initBranchSelectorTabs} from './features/repo-legacy.ts';
import {initCaptcha} from './features/captcha.ts';
@@ -86,11 +86,11 @@ const initPerformanceTracer = callInitFunctions([
initGlobalInput,
initGlobalShortcut,
- initCommonOrganization,
initCommonIssueListQuickGoto,
initCompSearchUserBox,
initCompWebHookEditor,
+ initCompLabelEdit,
initInstall,