Loading notifications async.

src/alerts.js

@@ -145,12 +145,26 @@ export async function removeAlert(alertId, reqUser) {
 		.delete();
 }
 
+export async function fetchUnseenNotificationsCount(reqUser) {
+	if (!reqUser) {
+		return null;
+	}
+
+	const rawUnseen = await knex('notifications')
+		.select(knex.raw('count(id)'))
+		.where('user_id', reqUser.id)
+		.where('seen', false)
+		.first();
+
+	return Number(rawUnseen.count);
+}
+
 export async function fetchNotifications(reqUser, options = {}) {
 	if (!reqUser) {
 		return [];
 	}
 
-	const [notifications, rawUnseen] = await Promise.all([
+	const [notifications, unseen] = await Promise.all([
 		knex('notifications')
 			.select(
 				'notifications.*',
@@ -169,15 +183,10 @@ export async function fetchNotifications(reqUser, options = {}) {
 			.limit(options.limit)
 			.groupBy('notifications.id', 'alerts.id')
 			.orderBy('created_at', 'desc'),
-		knex('notifications')
-			.select(knex.raw('count(id)'))
-			.where('user_id', reqUser.id)
-			.where('seen', false)
-			.first(),
+		fetchUnseenNotificationsCount(reqUser),
 	]);
 
 	const scenes = await fetchScenesById(notifications.map((notification) => notification.scene_id));
-	const unseen = Number(rawUnseen.count);
 
 	const curatedNotifications = notifications.map((notification) => {
 		const scene = scenes.find((sceneX) => sceneX.id === notification.scene_id);

src/web/server.js

@@ -52,7 +52,7 @@ import {
 	updateNotificationsApi,
 } from './alerts.js';
 
-import { fetchNotifications } from '../alerts.js';
+import { fetchUnseenNotificationsCount } from '../alerts.js';
 
 import initLogger from '../logger.js';
 
@@ -168,7 +168,7 @@ export default async function initServer() {
 	router.get('/api/tags', fetchTagsApi);
 
 	router.get('*', async (req, res, next) => {
-		const notifications = await fetchNotifications(req.user, { limit: 20 });
+		const unseenNotifications = await fetchUnseenNotificationsCount(req.user);
 
 		const pageContextInit = {
 			urlOriginal: req.originalUrl,
@@ -191,7 +191,9 @@ export default async function initServer() {
 				maxAggregateSize: config.database.manticore.maxAggregateSize,
 				media: config.media,
 			},
-			notifications,
+			meta: {
+				unseenNotifications,
+			},
 		};
 
 		const pageContext = await renderPage(pageContextInit);