Fix quickly switching notification filters resulting in empty or incorrect list ...

Follow-up to #18960

The aforementioned PR fixed an issue in which switching notification filters
while notifications were loading prevented the query for the new filter from
running, but another issue remained: if the first query completed after the
second one, its results would override the second one, thus leading to the
same issue.

This commit cancels the first request if it is still running, before issuing
the second one.

diff --git a/app/javascript/mastodon/actions/notifications.js b/app/javascript/mastodon/actions/notifications.js
index 7f62e6c04208f20caf374350d988140ba9141fbd..d4588db2c9462a4dd01e61179ac15b93acb5cf98 100644 (file)
--- a/app/javascript/mastodon/actions/notifications.js
+++ b/app/javascript/mastodon/actions/notifications.js
@@ -141,15 +141,22 @@ const excludeTypesFromFilter = filter => {
 
 const noOp = () => {};
 
+let expandNotificationsController = new AbortController();
+
 export function expandNotifications({ maxId, forceLoad } = {}, done = noOp) {
   return (dispatch, getState) => {
     const activeFilter = getState().getIn(['settings', 'notifications', 'quickFilter', 'active']);
     const notifications = getState().get('notifications');
     const isLoadingMore = !!maxId;
 
-    if (notifications.get('isLoading') && !forceLoad) {
-      done();
-      return;
+    if (notifications.get('isLoading')) {
+      if (forceLoad) {
+        expandNotificationsController.abort();
+        expandNotificationsController = new AbortController();
+      } else {
+        done();
+        return;
+      }
     }
 
     const params = {
@@ -174,7 +181,7 @@ export function expandNotifications({ maxId, forceLoad } = {}, done = noOp) {
 
     dispatch(expandNotificationsRequest(isLoadingMore));
 
-    api(getState).get('/api/v1/notifications', { params }).then(response => {
+    api(getState).get('/api/v1/notifications', { params, signal: expandNotificationsController.signal }).then(response => {
       const next = getLinks(response).refs.find(link => link.rel === 'next');
 
       dispatch(importFetchedAccounts(response.data.map(item => item.account)));
@@ -215,7 +222,7 @@ export function expandNotificationsFail(error, isLoadingMore) {
     type: NOTIFICATIONS_EXPAND_FAIL,
     error,
     skipLoading: !isLoadingMore,
-    skipAlert: !isLoadingMore,
+    skipAlert: !isLoadingMore || error.name === 'AbortError',
   };
 };