Added pagination to the notifications menu and a configurable limit to the amount of notifications spawned. (#199)

* Added notification pagination and pagination configuration options. fixes #171

* Added skip to end buttons

* Update theme

* Removed unused theme parts

* Update pager colors

* Theme auto-generator

* Update label color in options for pager.

* Updated themes

* Added option to change footer background for notifications menu.

* Changes to the Displayed Total options now update the menu. Bugfix
This commit is contained in:
Jas Singh
2024-08-30 01:32:11 -07:00
committed by GitHub
parent f80b3e4ef6
commit f624153eab
39 changed files with 1586 additions and 1317 deletions

View File

@@ -6,54 +6,63 @@ import { Image } from "./image/index.js";
import { Placeholder } from "./placeholder/index.js";
import { Body } from "./body/index.js";
import { CloseButton } from "./close/index.js";
import options from "options.js";
import { Variable } from "types/variable.js";
const NotificationCard = (notifs: Notifications) => {
return Widget.Box({
class_name: "menu-content-container notifications",
hpack: "center",
vexpand: true,
spacing: 0,
vertical: true,
setup: (self) => {
self.hook(notifs, () => {
const sortedNotifications = notifs.notifications.sort(
(a, b) => b.time - a.time,
);
const { displayedTotal } = options.notifications;
if (notifs.notifications.length <= 0) {
return (self.children = [Placeholder(notifs)]);
}
const NotificationCard = (notifs: Notifications, curPage: Variable<number>) => {
return Widget.Scrollable({
vscroll: "automatic",
child: Widget.Box({
class_name: "menu-content-container notifications",
hpack: "center",
vexpand: true,
spacing: 0,
vertical: true,
setup: (self) => {
Utils.merge([notifs.bind("notifications"), curPage.bind("value"), displayedTotal.bind("value")], (notifications, currentPage, dispTotal) => {
const sortedNotifications = notifications.sort(
(a, b) => b.time - a.time,
);
return (self.children = sortedNotifications.map((notif: Notification) => {
return Widget.Box({
class_name: "notification-card-content-container",
children: [
Widget.Box({
class_name: "notification-card menu",
vpack: "start",
hexpand: true,
vexpand: false,
children: [
Image(notif),
Widget.Box({
vpack: "center",
vertical: true,
hexpand: true,
class_name: `notification-card-content ${!notifHasImg(notif) ? "noimg" : " menu"}`,
children: [
Header(notif),
Body(notif),
Actions(notif, notifs),
],
}),
],
}),
CloseButton(notif, notifs),
],
});
}));
});
},
if (notifications.length <= 0) {
return (self.children = [Placeholder(notifs)]);
}
const pageStart = (currentPage - 1) * dispTotal;
const pageEnd = currentPage * dispTotal;
return (self.children = sortedNotifications.slice(pageStart, pageEnd).map((notif: Notification) => {
return Widget.Box({
class_name: "notification-card-content-container",
children: [
Widget.Box({
class_name: "notification-card menu",
vpack: "start",
hexpand: true,
vexpand: false,
children: [
Image(notif),
Widget.Box({
vpack: "center",
vertical: true,
hexpand: true,
class_name: `notification-card-content ${!notifHasImg(notif) ? "noimg" : " menu"}`,
children: [
Header(notif),
Body(notif),
Actions(notif, notifs),
],
}),
],
}),
CloseButton(notif, notifs),
],
});
}));
});
},
})
});
};