Web: hide notifications after a few seconds

The notifications (like "job requeued" after pushing the "requeue" button)
are now hidden after 5 seconds.
This commit is contained in:
Sybren A. Stüvel 2022-05-11 15:11:17 +02:00
parent 1f76c3bc64
commit 0c8fce7b42

View File

@ -1,5 +1,8 @@
import { defineStore } from 'pinia' import { defineStore } from 'pinia'
/** Time after which a notification is hidden. */
const MESSAGE_HIDE_DELAY_MS = 5000;
/** /**
* Store notifications to users of the web frontend. * Store notifications to users of the web frontend.
*/ */
@ -8,7 +11,9 @@ export const useNotifs = defineStore('notifications', {
/** @type {{ msg: string, time: Date }[]} */ /** @type {{ msg: string, time: Date }[]} */
history: [], history: [],
/** @type { msg: string, time: Date } */ /** @type { msg: string, time: Date } */
last: null, last: "",
hideTimerID: 0,
}), }),
actions: { actions: {
/** /**
@ -20,6 +25,7 @@ export const useNotifs = defineStore('notifications', {
this.history.push(notif); this.history.push(notif);
this.last = notif; this.last = notif;
this._prune(); this._prune();
this._restartHideTimer();
}, },
/* Ensure there is only 1000 items in the history. */ /* Ensure there is only 1000 items in the history. */
@ -27,5 +33,16 @@ export const useNotifs = defineStore('notifications', {
if (this.history.length <= 1000) return; if (this.history.length <= 1000) return;
this.history.splice(0, 1000 - this.history.length); this.history.splice(0, 1000 - this.history.length);
}, },
_restartHideTimer() {
if (this.hideTimerID) window.clearTimeout(this.hideTimerID);
this.hideTimerID = window.setTimeout(this._hideMessage, MESSAGE_HIDE_DELAY_MS);
},
_hideMessage() {
this.$patch({
hideTimerID: 0,
last: "",
});
},
}, },
}) })