import QtQuick
import Quickshell
import Quickshell.Widgets
import qs.Services
import qs.Common
import qs.Widgets
import Quickshell.Services.Notifications

Item {
    id: root 

    property var monitor: ""
    property bool createWindow: false

    MarginWrapperManager {
        rightMargin: Theme.gaps
        leftMargin: Theme.gaps
    }

    Rectangle {
        color: Theme.backgroudColor
        implicitWidth: clockText.implicitWidth * 1.6
        implicitHeight: Theme.heightGaps
        radius: 25

        Text {
            id: clockText

            anchors.centerIn: parent
            text: {
                NotificationService.notificationsNumber > 0 ? "\udb80\udc9a   "+NotificationService.notificationsNumber : "\ueaa2";
            }
            font.bold: true
            font.pixelSize: Theme.pixelSize
            font.family: Theme.fontFamily
            color: Theme.textColor
        }

        MouseArea {
            anchors.fill: parent
            onClicked: {
                console.log(NotificationService.currentNotification.image);
                root.createWindow = true
            }
        }
    }
    LazyLoader {
        id: windowLoader

        active: root.createWindow

        component: NotificationWindow {
            anchor.item:root
        }
    }
}