mirror of
				https://github.com/go-gitea/gitea.git
				synced 2025-10-26 12:27:06 +00:00 
			
		
		
		
	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  --------- Signed-off-by: Yarden Shoham <git@yardenshoham.com> Co-authored-by: silverwind <me@silverwind.io>
This commit is contained in:
		| @@ -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,29 +145,37 @@ 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'); | ||||||
|       } |       } | ||||||
|     }); |  | ||||||
|  |       const data = await response.text(); | ||||||
|       if ($(data).data('sequence-number') === notificationSequenceNumber) { |       if ($(data).data('sequence-number') === notificationSequenceNumber) { | ||||||
|         notificationDiv.replaceWith(data); |         notificationDiv.replaceWith(data); | ||||||
|         initNotificationsTable(); |         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: { |     if (!response.ok) { | ||||||
|       'X-Csrf-Token': csrfToken, |       throw new Error('Failed to fetch notification count'); | ||||||
|     }, |     } | ||||||
|   }); |  | ||||||
|  |     const data = await response.json(); | ||||||
|  |  | ||||||
|     const notificationCount = $('.notification_count'); |     const notificationCount = $('.notification_count'); | ||||||
|     if (data.new === 0) { |     if (data.new === 0) { | ||||||
| @@ -197,24 +187,8 @@ async function updateNotificationCount() { | |||||||
|     notificationCount.text(`${data.new}`); |     notificationCount.text(`${data.new}`); | ||||||
|  |  | ||||||
|     return `${data.new}`; |     return `${data.new}`; | ||||||
|  |   } catch (error) { | ||||||
|  |     console.error(error); | ||||||
|  |     return '0'; | ||||||
|   } |   } | ||||||
|  |  | ||||||
| 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, |  | ||||||
|     }, |  | ||||||
|   }); |  | ||||||
| } | } | ||||||
|   | |||||||
		Reference in New Issue
	
	Block a user
	 Yarden Shoham
					Yarden Shoham