Remove jQuery AJAX from the notifications (#29817)
- Removed 2 jQuery AJAX calls and replaced with our fetch wrapper - Deleted an AJAX call that wasn't attached to any element since #24989 - Tested the notification count and notification table functionality and it works as before # Demo using `fetch` instead of jQuery AJAX ![demo](https://github.com/go-gitea/gitea/assets/20454870/ff862a9a-1c88-41cc-bd01-5a0711dbd6f8) --------- Signed-off-by: Yarden Shoham <git@yardenshoham.com> Co-authored-by: silverwind <me@silverwind.io> (cherry picked from commit 043f55fabfadd765125690052920ba31ebd3817b)
This commit is contained in:
parent
23e2ace77d
commit
afc27fb2a3
|
@ -1,6 +1,7 @@
|
||||||
import $ from 'jquery';
|
import $ from 'jquery';
|
||||||
|
import {GET} from '../modules/fetch.js';
|
||||||
|
|
||||||
const {appSubUrl, csrfToken, notificationSettings, assetVersionEncoded} = window.config;
|
const {appSubUrl, notificationSettings, assetVersionEncoded} = window.config;
|
||||||
let notificationSequenceNumber = 0;
|
let notificationSequenceNumber = 0;
|
||||||
|
|
||||||
export function initNotificationsTable() {
|
export function initNotificationsTable() {
|
||||||
|
@ -27,25 +28,6 @@ export function initNotificationsTable() {
|
||||||
e.target.closest('.notifications-item').setAttribute('data-remove', 'true');
|
e.target.closest('.notifications-item').setAttribute('data-remove', 'true');
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
$('#notification_table .button').on('click', function () {
|
|
||||||
(async () => {
|
|
||||||
const data = await updateNotification(
|
|
||||||
$(this).data('url'),
|
|
||||||
$(this).data('status'),
|
|
||||||
$(this).data('page'),
|
|
||||||
$(this).data('q'),
|
|
||||||
$(this).data('notification-id'),
|
|
||||||
);
|
|
||||||
|
|
||||||
if ($(data).data('sequence-number') === notificationSequenceNumber) {
|
|
||||||
$('#notification_div').replaceWith(data);
|
|
||||||
initNotificationsTable();
|
|
||||||
}
|
|
||||||
await updateNotificationCount();
|
|
||||||
})();
|
|
||||||
return false;
|
|
||||||
});
|
|
||||||
}
|
}
|
||||||
|
|
||||||
async function receiveUpdateCount(event) {
|
async function receiveUpdateCount(event) {
|
||||||
|
@ -163,58 +145,50 @@ async function updateNotificationCountWithCallback(callback, timeout, lastCount)
|
||||||
async function updateNotificationTable() {
|
async function updateNotificationTable() {
|
||||||
const notificationDiv = $('#notification_div');
|
const notificationDiv = $('#notification_div');
|
||||||
if (notificationDiv.length > 0) {
|
if (notificationDiv.length > 0) {
|
||||||
const data = await $.ajax({
|
try {
|
||||||
type: 'GET',
|
const params = new URLSearchParams(window.location.search);
|
||||||
url: `${appSubUrl}/notifications${window.location.search}`,
|
params.set('div-only', true);
|
||||||
data: {
|
params.set('sequence-number', ++notificationSequenceNumber);
|
||||||
'div-only': true,
|
const url = `${appSubUrl}/notifications?${params.toString()}`;
|
||||||
'sequence-number': ++notificationSequenceNumber,
|
const response = await GET(url);
|
||||||
|
|
||||||
|
if (!response.ok) {
|
||||||
|
throw new Error('Failed to fetch notification table');
|
||||||
}
|
}
|
||||||
});
|
|
||||||
if ($(data).data('sequence-number') === notificationSequenceNumber) {
|
const data = await response.text();
|
||||||
notificationDiv.replaceWith(data);
|
if ($(data).data('sequence-number') === notificationSequenceNumber) {
|
||||||
initNotificationsTable();
|
notificationDiv.replaceWith(data);
|
||||||
|
initNotificationsTable();
|
||||||
|
}
|
||||||
|
} catch (error) {
|
||||||
|
console.error(error);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
async function updateNotificationCount() {
|
async function updateNotificationCount() {
|
||||||
const data = await $.ajax({
|
try {
|
||||||
type: 'GET',
|
const response = await GET(`${appSubUrl}/notifications/new`);
|
||||||
url: `${appSubUrl}/notifications/new`,
|
|
||||||
headers: {
|
|
||||||
'X-Csrf-Token': csrfToken,
|
|
||||||
},
|
|
||||||
});
|
|
||||||
|
|
||||||
const notificationCount = $('.notification_count');
|
if (!response.ok) {
|
||||||
if (data.new === 0) {
|
throw new Error('Failed to fetch notification count');
|
||||||
notificationCount.addClass('gt-hidden');
|
}
|
||||||
} else {
|
|
||||||
notificationCount.removeClass('gt-hidden');
|
const data = await response.json();
|
||||||
|
|
||||||
|
const notificationCount = $('.notification_count');
|
||||||
|
if (data.new === 0) {
|
||||||
|
notificationCount.addClass('gt-hidden');
|
||||||
|
} else {
|
||||||
|
notificationCount.removeClass('gt-hidden');
|
||||||
|
}
|
||||||
|
|
||||||
|
notificationCount.text(`${data.new}`);
|
||||||
|
|
||||||
|
return `${data.new}`;
|
||||||
|
} catch (error) {
|
||||||
|
console.error(error);
|
||||||
|
return '0';
|
||||||
}
|
}
|
||||||
|
|
||||||
notificationCount.text(`${data.new}`);
|
|
||||||
|
|
||||||
return `${data.new}`;
|
|
||||||
}
|
|
||||||
|
|
||||||
async function updateNotification(url, status, page, q, notificationID) {
|
|
||||||
if (status !== 'pinned') {
|
|
||||||
$(`#notification_${notificationID}`).remove();
|
|
||||||
}
|
|
||||||
|
|
||||||
return $.ajax({
|
|
||||||
type: 'POST',
|
|
||||||
url,
|
|
||||||
data: {
|
|
||||||
_csrf: csrfToken,
|
|
||||||
notification_id: notificationID,
|
|
||||||
status,
|
|
||||||
page,
|
|
||||||
q,
|
|
||||||
noredirect: true,
|
|
||||||
'sequence-number': ++notificationSequenceNumber,
|
|
||||||
},
|
|
||||||
});
|
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in a new issue