// This file is for the notification widget on the sidebar
// For the popup notifications, see onscreendisplay.js
// The actual widget for each single notification is in lib/notification.js

const { GLib, Gtk } = imports.gi;
import { Service, Utils, Widget } from '../imports.js';
import Notifications from 'resource:///com/github/Aylur/ags/service/notifications.js';
const { lookUpIcon, timeout } = Utils;
const { Box, Icon, Scrollable, Label, Button, Revealer } = Widget;
import { MaterialIcon } from "./lib/materialicon.js";
import { setupCursorHover } from "./lib/cursorhover.js";
import Notification from "./lib/notification.js";

const NotificationList = Box({
    vertical: true,
    valign: 'start',
    className: 'spacing-v-5-revealer',
    connections: [
        [Notifications, (box, id) => {
            if (box.children.length == 0) {
                Notifications.notifications
                    .forEach(n => {
                        box.pack_end(Notification({
                            notifObject: n,
                            isPopup: false,
                        }), false, false, 0)
                    });
                box.show_all();
            }
            else if (id) {
                const notif = Notifications.getNotification(id);

                const NewNotif = Notification({
                    notifObject: notif,
                    isPopup: false,
                });

                if (NewNotif) {
                    box.pack_end(NewNotif, false, false, 0);
                    box.show_all();
                }
            }
        }, 'notified'],

        [Notifications, (box, id) => {
            if (!id) return;
            for (const ch of box.children) {
                if (ch._id === id) {
                    ch._destroyWithAnims();
                }
            }
        }, 'closed'],

        [Notifications, box => box.visible = Notifications.notifications.length > 0],
    ],
});

export default (props) => {
    const listTitle = Revealer({
        revealChild: false,
        connections: [[Notifications, (revealer) => {
            revealer.revealChild = (Notifications.notifications.length > 0);
        }]],
        child: Box({
            valign: 'start',
            className: 'sidebar-group-invisible txt',
            children: [
                Label({
                    hexpand: true,
                    xalign: 0,
                    className: 'txt-title-small',
                    label: 'Notifications',
                }),
                Button({
                    className: 'notif-closeall-btn',
                    onClicked: () => {
                        Notifications.clear();
                    },
                    child: Box({
                        className: 'spacing-h-5',
                        children: [
                            MaterialIcon('clear_all', 'norm'),
                            Label({
                                className: 'txt-small',
                                label: 'Clear',
                            })
                        ]
                    }),
                    setup: button => {
                        setupCursorHover(button);
                    },
                })
            ]
        })
    });
    const listContents = Scrollable({
        hexpand: true,
        hscroll: 'never',
        vscroll: 'automatic',
        child: Widget({
            type: Gtk.Viewport,
            className: 'sidebar-viewport',
            setup: (viewport) => {
                viewport.add(Box({
                    vexpand: true,
                    children: [NotificationList],
                }));
            }
        })
    });
    listContents.set_policy(Gtk.PolicyType.NEVER, Gtk.PolicyType.AUTOMATIC);
    const vScrollbar = listContents.get_vscrollbar();
    vScrollbar.get_style_context().add_class('sidebar-scrollbar');
    return Box({
        ...props,
        className: 'sidebar-group-invisible spacing-v-5',
        vertical: true,
        children: [
            listTitle,
            listContents,
        ]
    });
}