Update notification table with only latest data (#16445)
When marking notifications read the results may be returned out of order or be delayed. This PR sends a sequence number to gitea so that the browser can ensure that only the results of the latest notification change are shown. Signed-off-by: Andrew Thornton <art27@cantab.net> Co-authored-by: 6543 <6543@obermui.de>
This commit is contained in:
parent
b08e14bbcf
commit
93f31e1897
|
@ -50,6 +50,7 @@ func Notifications(c *context.Context) {
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
if c.QueryBool("div-only") {
|
if c.QueryBool("div-only") {
|
||||||
|
c.Data["SequenceNumber"] = c.Query("sequence-number")
|
||||||
c.HTML(http.StatusOK, tplNotificationDiv)
|
c.HTML(http.StatusOK, tplNotificationDiv)
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
|
@ -175,6 +176,7 @@ func NotificationStatusPost(c *context.Context) {
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
c.Data["Link"] = setting.AppURL + "notifications"
|
c.Data["Link"] = setting.AppURL + "notifications"
|
||||||
|
c.Data["SequenceNumber"] = c.Req.PostFormValue("sequence-number")
|
||||||
|
|
||||||
c.HTML(http.StatusOK, tplNotificationDiv)
|
c.HTML(http.StatusOK, tplNotificationDiv)
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,4 +1,4 @@
|
||||||
<div class="page-content user notification" id="notification_div" data-params="{{.Page.GetParams}}">
|
<div class="page-content user notification" id="notification_div" data-params="{{.Page.GetParams}}" data-sequence-number="{{.SequenceNumber}}">
|
||||||
<div class="ui container">
|
<div class="ui container">
|
||||||
<h1 class="ui dividing header">{{.i18n.Tr "notification.notifications"}}</h1>
|
<h1 class="ui dividing header">{{.i18n.Tr "notification.notifications"}}</h1>
|
||||||
<div class="ui top attached tabular menu">
|
<div class="ui top attached tabular menu">
|
||||||
|
|
|
@ -1,5 +1,7 @@
|
||||||
const {AppSubUrl, csrf, NotificationSettings} = window.config;
|
const {AppSubUrl, csrf, NotificationSettings} = window.config;
|
||||||
|
|
||||||
|
let notificationSequenceNumber = 0;
|
||||||
|
|
||||||
export function initNotificationsTable() {
|
export function initNotificationsTable() {
|
||||||
$('#notification_table .button').on('click', async function () {
|
$('#notification_table .button').on('click', async function () {
|
||||||
const data = await updateNotification(
|
const data = await updateNotification(
|
||||||
|
@ -10,8 +12,10 @@ export function initNotificationsTable() {
|
||||||
$(this).data('notification-id'),
|
$(this).data('notification-id'),
|
||||||
);
|
);
|
||||||
|
|
||||||
|
if ($(data).data('sequence-number') === notificationSequenceNumber) {
|
||||||
$('#notification_div').replaceWith(data);
|
$('#notification_div').replaceWith(data);
|
||||||
initNotificationsTable();
|
initNotificationsTable();
|
||||||
|
}
|
||||||
await updateNotificationCount();
|
await updateNotificationCount();
|
||||||
|
|
||||||
return false;
|
return false;
|
||||||
|
@ -139,11 +143,14 @@ async function updateNotificationTable() {
|
||||||
url: `${AppSubUrl}/notifications?${notificationDiv.data('params')}`,
|
url: `${AppSubUrl}/notifications?${notificationDiv.data('params')}`,
|
||||||
data: {
|
data: {
|
||||||
'div-only': true,
|
'div-only': true,
|
||||||
|
'sequence-number': ++notificationSequenceNumber,
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
if ($(data).data('sequence-number') === notificationSequenceNumber) {
|
||||||
notificationDiv.replaceWith(data);
|
notificationDiv.replaceWith(data);
|
||||||
initNotificationsTable();
|
initNotificationsTable();
|
||||||
}
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
async function updateNotificationCount() {
|
async function updateNotificationCount() {
|
||||||
|
@ -182,6 +189,7 @@ async function updateNotification(url, status, page, q, notificationID) {
|
||||||
page,
|
page,
|
||||||
q,
|
q,
|
||||||
noredirect: true,
|
noredirect: true,
|
||||||
|
'sequence-number': ++notificationSequenceNumber,
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue