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
    }

    Binding {
        target: root
        property: "createWindow"
        value: NotificationService.notificationsNumber > 0 && root.createWindow
    }

    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: {
                root.createWindow = !root.createWindow;
            }
        }
    }
    LazyLoader {
        id: windowLoader

        active: NotificationService.notificationsNumber ? createWindow : false

        component: NotificationWindow {}
    }
}