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>
This commit is contained in:
Yarden Shoham 2024-03-16 03:56:17 +02:00 committed by GitHub
parent 68169133a3
commit 043f55fabf
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194

View File

@ -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,
},
});
} }