2022-01-28 21:00:11 +00:00
|
|
|
import $ from 'jquery';
|
2024-07-07 15:32:30 +00:00
|
|
|
import {initCompReactionSelector} from './comp/ReactionSelector.ts';
|
|
|
|
import {initRepoIssueContentHistory} from './repo-issue-content.ts';
|
2024-10-14 21:23:20 +00:00
|
|
|
import {initDiffFileTree, initDiffFileList} from './repo-diff-filetree.ts';
|
2024-07-07 15:32:30 +00:00
|
|
|
import {initDiffCommitSelect} from './repo-diff-commitselect.ts';
|
|
|
|
import {validateTextareaNonEmpty} from './comp/ComboMarkdownEditor.ts';
|
|
|
|
import {initViewedCheckboxListenerFor, countAndUpdateViewedFiles, initExpandAndCollapseFilesButton} from './pull-view-file.ts';
|
|
|
|
import {initImageDiff} from './imagediff.ts';
|
|
|
|
import {showErrorToast} from '../modules/toast.ts';
|
2024-11-21 14:09:16 +00:00
|
|
|
import {
|
|
|
|
submitEventSubmitter,
|
|
|
|
queryElemSiblings,
|
|
|
|
hideElem,
|
|
|
|
showElem,
|
|
|
|
animateOnce,
|
|
|
|
addDelegatedEventListener,
|
|
|
|
createElementFromHTML,
|
|
|
|
} from '../utils/dom.ts';
|
2024-07-07 15:32:30 +00:00
|
|
|
import {POST, GET} from '../modules/fetch.ts';
|
2024-11-21 14:09:16 +00:00
|
|
|
import {fomanticQuery} from '../modules/fomantic/base.ts';
|
2024-11-26 01:24:56 +00:00
|
|
|
import {createTippy} from '../modules/tippy.ts';
|
2022-01-28 21:00:11 +00:00
|
|
|
|
2024-03-14 22:21:14 +00:00
|
|
|
const {pageData, i18n} = window.config;
|
2021-10-16 17:28:04 +00:00
|
|
|
|
2023-04-09 13:11:02 +00:00
|
|
|
function initRepoDiffFileViewToggle() {
|
2021-10-16 17:28:04 +00:00
|
|
|
$('.file-view-toggle').on('click', function () {
|
2024-03-29 18:51:44 +00:00
|
|
|
for (const el of queryElemSiblings(this)) {
|
|
|
|
el.classList.remove('active');
|
|
|
|
}
|
|
|
|
this.classList.add('active');
|
2021-10-16 17:28:04 +00:00
|
|
|
|
2024-03-29 18:51:44 +00:00
|
|
|
const target = document.querySelector(this.getAttribute('data-toggle-selector'));
|
|
|
|
if (!target) return;
|
|
|
|
|
|
|
|
hideElem(queryElemSiblings(target));
|
|
|
|
showElem(target);
|
2021-10-16 17:28:04 +00:00
|
|
|
});
|
|
|
|
}
|
|
|
|
|
2023-04-09 13:11:02 +00:00
|
|
|
function initRepoDiffConversationForm() {
|
2024-11-21 14:09:16 +00:00
|
|
|
addDelegatedEventListener<HTMLFormElement>(document, 'submit', '.conversation-holder form', async (form, e) => {
|
2021-10-16 17:28:04 +00:00
|
|
|
e.preventDefault();
|
2024-11-21 14:09:16 +00:00
|
|
|
const textArea = form.querySelector<HTMLTextAreaElement>('textarea');
|
|
|
|
if (!validateTextareaNonEmpty(textArea)) return;
|
|
|
|
if (form.classList.contains('is-loading')) return;
|
2022-01-02 22:31:03 +00:00
|
|
|
|
2023-11-21 02:12:31 +00:00
|
|
|
try {
|
2024-11-21 14:09:16 +00:00
|
|
|
form.classList.add('is-loading');
|
|
|
|
const formData = new FormData(form);
|
2023-03-04 07:13:37 +00:00
|
|
|
|
2023-11-21 02:12:31 +00:00
|
|
|
// if the form is submitted by a button, append the button's name and value to the form data
|
2024-02-17 20:48:10 +00:00
|
|
|
const submitter = submitEventSubmitter(e);
|
2023-11-21 02:12:31 +00:00
|
|
|
const isSubmittedByButton = (submitter?.nodeName === 'BUTTON') || (submitter?.nodeName === 'INPUT' && submitter.type === 'submit');
|
|
|
|
if (isSubmittedByButton && submitter.name) {
|
|
|
|
formData.append(submitter.name, submitter.value);
|
|
|
|
}
|
2024-03-14 22:21:14 +00:00
|
|
|
|
2024-11-21 14:09:16 +00:00
|
|
|
const trLineType = form.closest('tr').getAttribute('data-line-type');
|
|
|
|
const response = await POST(form.getAttribute('action'), {data: formData});
|
|
|
|
const newConversationHolder = createElementFromHTML(await response.text());
|
|
|
|
const path = newConversationHolder.getAttribute('data-path');
|
|
|
|
const side = newConversationHolder.getAttribute('data-side');
|
|
|
|
const idx = newConversationHolder.getAttribute('data-idx');
|
|
|
|
|
|
|
|
form.closest('.conversation-holder').replaceWith(newConversationHolder);
|
|
|
|
form = null; // prevent further usage of the form because it should have been replaced
|
2021-10-16 17:28:04 +00:00
|
|
|
|
2024-03-29 18:51:44 +00:00
|
|
|
let selector;
|
2024-11-21 14:09:16 +00:00
|
|
|
if (trLineType === 'same') {
|
2024-03-29 18:51:44 +00:00
|
|
|
selector = `[data-path="${path}"] .add-code-comment[data-idx="${idx}"]`;
|
2023-11-21 02:12:31 +00:00
|
|
|
} else {
|
2024-03-29 18:51:44 +00:00
|
|
|
selector = `[data-path="${path}"] .add-code-comment[data-side="${side}"][data-idx="${idx}"]`;
|
|
|
|
}
|
|
|
|
for (const el of document.querySelectorAll(selector)) {
|
2024-11-21 14:09:16 +00:00
|
|
|
el.classList.add('tw-invisible'); // TODO need to figure out why
|
|
|
|
}
|
|
|
|
fomanticQuery(newConversationHolder.querySelectorAll('.ui.dropdown')).dropdown();
|
|
|
|
|
|
|
|
// the default behavior is to add a pending review, so if no submitter, it also means "pending_review"
|
|
|
|
if (!submitter || submitter?.matches('button[name="pending_review"]')) {
|
|
|
|
const reviewBox = document.querySelector('#review-box');
|
|
|
|
const counter = reviewBox?.querySelector('.review-comments-counter');
|
|
|
|
if (!counter) return;
|
|
|
|
const num = parseInt(counter.getAttribute('data-pending-comment-number')) + 1 || 1;
|
|
|
|
counter.setAttribute('data-pending-comment-number', String(num));
|
|
|
|
counter.textContent = String(num);
|
|
|
|
animateOnce(reviewBox, 'pulse-1p5-200');
|
2023-11-21 02:12:31 +00:00
|
|
|
}
|
2024-03-14 22:21:14 +00:00
|
|
|
} catch (error) {
|
|
|
|
console.error('Error:', error);
|
2023-11-21 02:12:31 +00:00
|
|
|
showErrorToast(i18n.network_error);
|
|
|
|
} finally {
|
2024-11-21 14:09:16 +00:00
|
|
|
form?.classList.remove('is-loading');
|
2021-10-16 17:28:04 +00:00
|
|
|
}
|
|
|
|
});
|
|
|
|
|
2022-01-18 17:28:38 +00:00
|
|
|
$(document).on('click', '.resolve-conversation', async function (e) {
|
2021-10-16 17:28:04 +00:00
|
|
|
e.preventDefault();
|
|
|
|
const comment_id = $(this).data('comment-id');
|
|
|
|
const origin = $(this).data('origin');
|
|
|
|
const action = $(this).data('action');
|
|
|
|
const url = $(this).data('update-url');
|
|
|
|
|
2024-03-14 22:21:14 +00:00
|
|
|
try {
|
|
|
|
const response = await POST(url, {data: new URLSearchParams({origin, action, comment_id})});
|
|
|
|
const data = await response.text();
|
|
|
|
|
|
|
|
if ($(this).closest('.conversation-holder').length) {
|
2024-03-16 12:22:16 +00:00
|
|
|
const $conversation = $(data);
|
|
|
|
$(this).closest('.conversation-holder').replaceWith($conversation);
|
|
|
|
$conversation.find('.dropdown').dropdown();
|
|
|
|
initCompReactionSelector($conversation);
|
2024-03-14 22:21:14 +00:00
|
|
|
} else {
|
|
|
|
window.location.reload();
|
|
|
|
}
|
|
|
|
} catch (error) {
|
|
|
|
console.error('Error:', error);
|
2021-10-16 17:28:04 +00:00
|
|
|
}
|
|
|
|
});
|
|
|
|
}
|
|
|
|
|
|
|
|
export function initRepoDiffConversationNav() {
|
|
|
|
// Previous/Next code review conversation
|
|
|
|
$(document).on('click', '.previous-conversation', (e) => {
|
|
|
|
const $conversation = $(e.currentTarget).closest('.comment-code-cloud');
|
2024-03-24 18:23:38 +00:00
|
|
|
const $conversations = $('.comment-code-cloud:not(.tw-hidden)');
|
2021-10-16 17:28:04 +00:00
|
|
|
const index = $conversations.index($conversation);
|
|
|
|
const previousIndex = index > 0 ? index - 1 : $conversations.length - 1;
|
|
|
|
const $previousConversation = $conversations.eq(previousIndex);
|
2024-03-23 12:37:18 +00:00
|
|
|
const anchor = $previousConversation.find('.comment').first()[0].getAttribute('id');
|
2021-10-16 17:28:04 +00:00
|
|
|
window.location.href = `#${anchor}`;
|
|
|
|
});
|
|
|
|
$(document).on('click', '.next-conversation', (e) => {
|
|
|
|
const $conversation = $(e.currentTarget).closest('.comment-code-cloud');
|
2024-03-24 18:23:38 +00:00
|
|
|
const $conversations = $('.comment-code-cloud:not(.tw-hidden)');
|
2021-10-16 17:28:04 +00:00
|
|
|
const index = $conversations.index($conversation);
|
|
|
|
const nextIndex = index < $conversations.length - 1 ? index + 1 : 0;
|
|
|
|
const $nextConversation = $conversations.eq(nextIndex);
|
2024-03-23 12:37:18 +00:00
|
|
|
const anchor = $nextConversation.find('.comment').first()[0].getAttribute('id');
|
2021-10-16 17:28:04 +00:00
|
|
|
window.location.href = `#${anchor}`;
|
|
|
|
});
|
|
|
|
}
|
2021-11-09 09:27:25 +00:00
|
|
|
|
2024-11-26 01:24:56 +00:00
|
|
|
function initDiffHeaderPopup() {
|
|
|
|
for (const btn of document.querySelectorAll('.diff-header-popup-btn:not([data-header-popup-initialized])')) {
|
|
|
|
btn.setAttribute('data-header-popup-initialized', '');
|
|
|
|
const popup = btn.nextElementSibling;
|
|
|
|
if (!popup?.matches('.tippy-target')) throw new Error('Popup element not found');
|
|
|
|
createTippy(btn, {content: popup, theme: 'menu', placement: 'bottom', trigger: 'click', interactive: true, hideOnClick: true});
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2022-05-07 18:28:10 +00:00
|
|
|
// Will be called when the show more (files) button has been pressed
|
|
|
|
function onShowMoreFiles() {
|
|
|
|
initRepoIssueContentHistory();
|
|
|
|
initViewedCheckboxListenerFor();
|
|
|
|
countAndUpdateViewedFiles();
|
2023-07-04 08:36:27 +00:00
|
|
|
initImageDiff();
|
2024-11-26 01:24:56 +00:00
|
|
|
initDiffHeaderPopup();
|
2022-05-07 18:28:10 +00:00
|
|
|
}
|
|
|
|
|
2024-03-14 22:21:14 +00:00
|
|
|
export async function loadMoreFiles(url) {
|
2024-03-29 18:51:44 +00:00
|
|
|
const target = document.querySelector('a#diff-show-more-files');
|
|
|
|
if (target?.classList.contains('disabled') || pageData.diffFileInfo.isLoadingNewData) {
|
2023-01-13 05:50:32 +00:00
|
|
|
return;
|
|
|
|
}
|
2023-05-30 10:53:15 +00:00
|
|
|
|
|
|
|
pageData.diffFileInfo.isLoadingNewData = true;
|
2024-03-29 18:51:44 +00:00
|
|
|
target?.classList.add('disabled');
|
2024-03-14 22:21:14 +00:00
|
|
|
|
|
|
|
try {
|
|
|
|
const response = await GET(url);
|
|
|
|
const resp = await response.text();
|
2023-05-30 10:53:15 +00:00
|
|
|
const $resp = $(resp);
|
|
|
|
// the response is a full HTML page, we need to extract the relevant contents:
|
|
|
|
// 1. append the newly loaded file list items to the existing list
|
|
|
|
$('#diff-incomplete').replaceWith($resp.find('#diff-file-boxes').children());
|
|
|
|
// 2. re-execute the script to append the newly loaded items to the JS variables to refresh the DiffFileTree
|
|
|
|
$('body').append($resp.find('script#diff-data-script'));
|
|
|
|
|
2023-01-13 05:50:32 +00:00
|
|
|
onShowMoreFiles();
|
2024-03-14 22:21:14 +00:00
|
|
|
} catch (error) {
|
|
|
|
console.error('Error:', error);
|
|
|
|
showErrorToast('An error occurred while loading more files.');
|
|
|
|
} finally {
|
2024-03-29 18:51:44 +00:00
|
|
|
target?.classList.remove('disabled');
|
2023-05-30 10:53:15 +00:00
|
|
|
pageData.diffFileInfo.isLoadingNewData = false;
|
2024-03-14 22:21:14 +00:00
|
|
|
}
|
2022-09-27 05:22:19 +00:00
|
|
|
}
|
|
|
|
|
2023-04-09 13:11:02 +00:00
|
|
|
function initRepoDiffShowMore() {
|
2023-01-13 05:50:32 +00:00
|
|
|
$(document).on('click', 'a#diff-show-more-files', (e) => {
|
|
|
|
e.preventDefault();
|
|
|
|
|
2024-03-23 12:37:18 +00:00
|
|
|
const linkLoadMore = e.target.getAttribute('data-href');
|
2023-05-30 10:53:15 +00:00
|
|
|
loadMoreFiles(linkLoadMore);
|
2023-01-13 05:50:32 +00:00
|
|
|
});
|
|
|
|
|
2024-03-14 22:21:14 +00:00
|
|
|
$(document).on('click', 'a.diff-load-button', async (e) => {
|
2021-11-21 16:51:08 +00:00
|
|
|
e.preventDefault();
|
|
|
|
const $target = $(e.target);
|
|
|
|
|
2024-03-29 18:51:44 +00:00
|
|
|
if (e.target.classList.contains('disabled')) {
|
2021-11-21 16:51:08 +00:00
|
|
|
return;
|
|
|
|
}
|
|
|
|
|
2024-03-29 18:51:44 +00:00
|
|
|
e.target.classList.add('disabled');
|
2021-11-21 16:51:08 +00:00
|
|
|
|
|
|
|
const url = $target.data('href');
|
2024-03-14 22:21:14 +00:00
|
|
|
|
|
|
|
try {
|
|
|
|
const response = await GET(url);
|
|
|
|
const resp = await response.text();
|
|
|
|
|
2021-11-21 16:51:08 +00:00
|
|
|
if (!resp) {
|
|
|
|
return;
|
|
|
|
}
|
|
|
|
$target.parent().replaceWith($(resp).find('#diff-file-boxes .diff-file-body .file-body').children());
|
2022-05-07 18:28:10 +00:00
|
|
|
onShowMoreFiles();
|
2024-03-14 22:21:14 +00:00
|
|
|
} catch (error) {
|
|
|
|
console.error('Error:', error);
|
|
|
|
} finally {
|
2024-03-29 18:51:44 +00:00
|
|
|
e.target.classList.remove('disabled');
|
2024-03-14 22:21:14 +00:00
|
|
|
}
|
2021-11-09 09:27:25 +00:00
|
|
|
});
|
|
|
|
}
|
2023-04-09 13:11:02 +00:00
|
|
|
|
|
|
|
export function initRepoDiffView() {
|
2023-04-19 17:05:25 +00:00
|
|
|
initRepoDiffConversationForm();
|
2024-03-25 18:37:55 +00:00
|
|
|
if (!$('#diff-file-list').length) return;
|
2023-04-09 13:11:02 +00:00
|
|
|
initDiffFileTree();
|
2024-10-14 21:23:20 +00:00
|
|
|
initDiffFileList();
|
2023-07-28 19:18:12 +00:00
|
|
|
initDiffCommitSelect();
|
2023-04-09 13:11:02 +00:00
|
|
|
initRepoDiffShowMore();
|
2024-11-26 01:24:56 +00:00
|
|
|
initDiffHeaderPopup();
|
2023-04-09 13:11:02 +00:00
|
|
|
initRepoDiffFileViewToggle();
|
|
|
|
initViewedCheckboxListenerFor();
|
|
|
|
initExpandAndCollapseFilesButton();
|
|
|
|
}
|