Remove jQuery AJAX from the comment edit history (#29703)
- Removed all jQuery AJAX calls and replaced with our fetch wrapper - Tested the comment edit history list, diff, and delete functionality and it works as before # Demo using `fetch` instead of jQuery AJAX ![demo](https://github.com/go-gitea/gitea/assets/20454870/e8c557bc-f2b9-4d73-b55e-0850c1b19364) Signed-off-by: Yarden Shoham <git@yardenshoham.com> (cherry picked from commit b5ed42864e306f22305beba50d6ff71df2aea0c6)
This commit is contained in:
parent
cc1c000ac8
commit
32dd02829e
1 changed files with 36 additions and 22 deletions
|
@ -1,8 +1,9 @@
|
||||||
import $ from 'jquery';
|
import $ from 'jquery';
|
||||||
import {svg} from '../svg.js';
|
import {svg} from '../svg.js';
|
||||||
import {showErrorToast} from '../modules/toast.js';
|
import {showErrorToast} from '../modules/toast.js';
|
||||||
|
import {GET, POST} from '../modules/fetch.js';
|
||||||
|
|
||||||
const {appSubUrl, csrfToken} = window.config;
|
const {appSubUrl} = window.config;
|
||||||
let i18nTextEdited;
|
let i18nTextEdited;
|
||||||
let i18nTextOptions;
|
let i18nTextOptions;
|
||||||
let i18nTextDeleteFromHistory;
|
let i18nTextDeleteFromHistory;
|
||||||
|
@ -31,19 +32,27 @@ function showContentHistoryDetail(issueBaseUrl, commentId, historyId, itemTitleH
|
||||||
$dialog.find('.dialog-header-options').dropdown({
|
$dialog.find('.dialog-header-options').dropdown({
|
||||||
showOnFocus: false,
|
showOnFocus: false,
|
||||||
allowReselection: true,
|
allowReselection: true,
|
||||||
onChange(_value, _text, $item) {
|
async onChange(_value, _text, $item) {
|
||||||
const optionItem = $item.data('option-item');
|
const optionItem = $item.data('option-item');
|
||||||
if (optionItem === 'delete') {
|
if (optionItem === 'delete') {
|
||||||
if (window.confirm(i18nTextDeleteFromHistoryConfirm)) {
|
if (window.confirm(i18nTextDeleteFromHistoryConfirm)) {
|
||||||
$.post(`${issueBaseUrl}/content-history/soft-delete?comment_id=${commentId}&history_id=${historyId}`, {
|
try {
|
||||||
_csrf: csrfToken,
|
const params = new URLSearchParams();
|
||||||
}).done((resp) => {
|
params.append('comment_id', commentId);
|
||||||
|
params.append('history_id', historyId);
|
||||||
|
|
||||||
|
const response = await POST(`${issueBaseUrl}/content-history/soft-delete?${params.toString()}`);
|
||||||
|
const resp = await response.json();
|
||||||
|
|
||||||
if (resp.ok) {
|
if (resp.ok) {
|
||||||
$dialog.modal('hide');
|
$dialog.modal('hide');
|
||||||
} else {
|
} else {
|
||||||
showErrorToast(resp.message);
|
showErrorToast(resp.message);
|
||||||
}
|
}
|
||||||
});
|
} catch (error) {
|
||||||
|
console.error('Error:', error);
|
||||||
|
showErrorToast('An error occurred while deleting the history.');
|
||||||
|
}
|
||||||
}
|
}
|
||||||
} else { // required by eslint
|
} else { // required by eslint
|
||||||
showErrorToast(`unknown option item: ${optionItem}`);
|
showErrorToast(`unknown option item: ${optionItem}`);
|
||||||
|
@ -54,19 +63,24 @@ function showContentHistoryDetail(issueBaseUrl, commentId, historyId, itemTitleH
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
$dialog.modal({
|
$dialog.modal({
|
||||||
onShow() {
|
async onShow() {
|
||||||
$.ajax({
|
try {
|
||||||
url: `${issueBaseUrl}/content-history/detail?comment_id=${commentId}&history_id=${historyId}`,
|
const params = new URLSearchParams();
|
||||||
data: {
|
params.append('comment_id', commentId);
|
||||||
_csrf: csrfToken,
|
params.append('history_id', historyId);
|
||||||
},
|
|
||||||
}).done((resp) => {
|
const url = `${issueBaseUrl}/content-history/detail?${params.toString()}`;
|
||||||
|
const response = await GET(url);
|
||||||
|
const resp = await response.json();
|
||||||
|
|
||||||
$dialog.find('.comment-diff-data').removeClass('is-loading').html(resp.diffHtml);
|
$dialog.find('.comment-diff-data').removeClass('is-loading').html(resp.diffHtml);
|
||||||
// there is only one option "item[data-option-item=delete]", so the dropdown can be entirely shown/hidden.
|
// there is only one option "item[data-option-item=delete]", so the dropdown can be entirely shown/hidden.
|
||||||
if (resp.canSoftDelete) {
|
if (resp.canSoftDelete) {
|
||||||
$dialog.find('.dialog-header-options').removeClass('gt-hidden');
|
$dialog.find('.dialog-header-options').removeClass('gt-hidden');
|
||||||
}
|
}
|
||||||
});
|
} catch (error) {
|
||||||
|
console.error('Error:', error);
|
||||||
|
}
|
||||||
},
|
},
|
||||||
onHidden() {
|
onHidden() {
|
||||||
$dialog.remove();
|
$dialog.remove();
|
||||||
|
@ -103,7 +117,7 @@ function showContentHistoryMenu(issueBaseUrl, $item, commentId) {
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
export function initRepoIssueContentHistory() {
|
export async function initRepoIssueContentHistory() {
|
||||||
const issueIndex = $('#issueIndex').val();
|
const issueIndex = $('#issueIndex').val();
|
||||||
if (!issueIndex) return;
|
if (!issueIndex) return;
|
||||||
|
|
||||||
|
@ -114,12 +128,10 @@ export function initRepoIssueContentHistory() {
|
||||||
const repoLink = $('#repolink').val();
|
const repoLink = $('#repolink').val();
|
||||||
const issueBaseUrl = `${appSubUrl}/${repoLink}/issues/${issueIndex}`;
|
const issueBaseUrl = `${appSubUrl}/${repoLink}/issues/${issueIndex}`;
|
||||||
|
|
||||||
$.ajax({
|
try {
|
||||||
url: `${issueBaseUrl}/content-history/overview`,
|
const response = await GET(`${issueBaseUrl}/content-history/overview`);
|
||||||
data: {
|
const resp = await response.json();
|
||||||
_csrf: csrfToken,
|
|
||||||
},
|
|
||||||
}).done((resp) => {
|
|
||||||
i18nTextEdited = resp.i18n.textEdited;
|
i18nTextEdited = resp.i18n.textEdited;
|
||||||
i18nTextDeleteFromHistory = resp.i18n.textDeleteFromHistory;
|
i18nTextDeleteFromHistory = resp.i18n.textDeleteFromHistory;
|
||||||
i18nTextDeleteFromHistoryConfirm = resp.i18n.textDeleteFromHistoryConfirm;
|
i18nTextDeleteFromHistoryConfirm = resp.i18n.textDeleteFromHistoryConfirm;
|
||||||
|
@ -133,5 +145,7 @@ export function initRepoIssueContentHistory() {
|
||||||
const $itemComment = $(`#issuecomment-${commentId}`);
|
const $itemComment = $(`#issuecomment-${commentId}`);
|
||||||
showContentHistoryMenu(issueBaseUrl, $itemComment, commentId);
|
showContentHistoryMenu(issueBaseUrl, $itemComment, commentId);
|
||||||
}
|
}
|
||||||
});
|
} catch (error) {
|
||||||
|
console.error('Error:', error);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in a new issue