Added dedicated notifications page.

assets/js/router.js

@@ -10,6 +10,7 @@ import Networks from '../components/networks/networks.vue';
 import Actor from '../components/actors/actor.vue';
 import Actors from '../components/actors/actors.vue';
 import Movies from '../components/releases/movies.vue';
+import Notifications from '../components/notifications/notifications.vue';
 import Tag from '../components/tags/tag.vue';
 import Tags from '../components/tags/tags.vue';
 import Stash from '../components/stashes/stash.vue';
@@ -202,6 +203,20 @@ const routes = [
 		component: Tags,
 		name: 'tags',
 	},
+	{
+		path: '/notifications',
+		redirect: {
+			name: 'notifications',
+			params: {
+				pageNumber: 1,
+			},
+		},
+	},
+	{
+		path: '/notifications/:pageNumber',
+		component: Notifications,
+		name: 'notifications',
+	},
 	{
 		path: '/stash/:stashId/:stashSlug?',
 		component: Stash,

assets/js/ui/actions.js

@@ -29,7 +29,7 @@ function initUiActions(store, _router) {
 		localStorage.setItem('sfw', sfw);
 	}
 
-	async function fetchNotifications({ commit }) {
+	async function fetchNotifications(_context, { page = 1, limit = 10 } = {}) {
 		if (!store.state.auth.user) {
 			return [];
 		}
@@ -38,44 +38,50 @@ function initUiActions(store, _router) {
             query Notifications(
 				$hasAuth: Boolean!
 				$userId: Int
+				$limit: Int = 10
+				$offset: Int = 0
 			) {
-                notifications(
-					first: 10
+				notifications: notificationsConnection(
+					first: $limit
+					offset: $offset
 					orderBy: CREATED_AT_DESC
 				) {
-                    id
-					sceneId
-					userId
-					seen
-					createdAt
-					scene {
-						${releaseFields}
-					}
-					alert {
-						tags: alertsTags {
-							tag {
-								id
-								name
-								slug
-							}
+					nodes {
+						id
+						sceneId
+						userId
+						seen
+						createdAt
+						scene {
+							${releaseFields}
 						}
-						actors: alertsActors {
-							actor {
-								id
-								name
-								slug
+						alert {
+							tags: alertsTags {
+								tag {
+									id
+									name
+									slug
+								}
 							}
-						}
-						entity: alertsEntityByAlertId {
-							entity {
-								id
-								name
-								slug
-								independent
+							actors: alertsActors {
+								actor {
+									id
+									name
+									slug
+								}
+							}
+							entity: alertsEntityByAlertId {
+								entity {
+									id
+									name
+									slug
+									independent
+								}
 							}
 						}
 					}
-                }
+					totalCount
+				}
 				unseenNotifications: notificationsConnection(
 					filter: { seen: { equalTo: false } }
 				) {
@@ -85,15 +91,15 @@ function initUiActions(store, _router) {
         `, {
 			hasAuth: !!store.state.auth.user,
 			userId: store.state.auth.user?.id,
+			limit,
+			offset: (page - 1) * limit,
 		});
 
-		const curatedNotifications = notifications.map(notification => curateNotification(notification));
-
-		commit('setNotifications', curatedNotifications);
-		commit('setUnseenNotificationsCount', unseenNotifications.totalCount);
+		const curatedNotifications = notifications.nodes.map(notification => curateNotification(notification));
 
 		return {
 			notifications: curatedNotifications,
+			totalCount: notifications.totalCount,
 			unseenCount: unseenNotifications.totalCount,
 		};
 	}
@@ -207,6 +213,8 @@ function initUiActions(store, _router) {
 			userId: store.state.auth.user?.id,
 		});
 
+		console.log(res.results);
+
 		return {
 			releases: res?.results.map(result => curateRelease(result.release)) || [],
 			actors: res?.actors.map(actor => curateActor(actor)) || [],

assets/js/ui/mutations.js

@@ -1,11 +1,3 @@
-function setNotifications(state, notifications) {
-	state.notifications = notifications;
-}
-
-function setUnseenNotificationsCount(state, count) {
-	state.unseenNotificationsCount = count;
-}
-
 function setTagFilter(state, tagFilter) {
 	state.tagFilter = tagFilter;
 }
@@ -27,8 +19,6 @@ function setTheme(state, theme) {
 }
 
 export default {
-	setNotifications,
-	setUnseenNotificationsCount,
 	setTagFilter,
 	setRange,
 	setBatch,

assets/js/ui/state.js

@@ -11,6 +11,4 @@ export default {
 	batch: storedBatch || 'all',
 	sfw: storedSfw === 'true' || false,
 	theme: storedTheme || deviceTheme,
-	notifications: [],
-	unseenNotificationsCount: 0,
 };