import QtQuick
import Quickshell
import Quickshell.Widgets
import Quickshell.Io
import "../../notification/notificationServer/"
import "../../../config"

MouseArea {
    id: notificationButton
    width: Math.max(bar.height, notificationText.width + Config.spacing)
    height: bar.height
    hoverEnabled: true
    cursorShape: Qt.PointingHandCursor

    onClicked: {
        NotificationS.toggleOverview()
    }

    Rectangle {
        anchors.fill: parent
        color: notificationButton.containsMouse || NotificationS.overviewVisible ? Colors.tertiary : "transparent"
        radius: Config.radius_fun(notificationButton.height)
        border.width: Config.border_width
        border.color: notificationButton.containsMouse || NotificationS.overviewVisible ? Colors.tertiary_fg : "transparent"

        Text {
            id: notificationText
            anchors.centerIn: parent
            text: "󰂚"
            font.pixelSize: Config.bigIconSize(bar.height)
            font.family: Config.font
            color: NotificationS.overviewVisible ? Colors.tertiary_fg : Colors.secondaryContainer_fg
        }

        // count badge
        Rectangle {
            id: badge
            visible: NotificationS.trackedNotifications.values.length > 0
            width: badgeText.implicitWidth + 6
            height: badgeText.implicitHeight + 4
            radius: height / 2
            color: Colors.errorContainer
            border.width: 1
            border.color: Colors.error
            anchors.top: parent.top
            anchors.right: parent.right
            anchors.topMargin: 2
            anchors.rightMargin: 2
            Text {
                id: badgeText
                anchors.centerIn: parent
                text: NotificationS.trackedNotifications.values.length > 99 ? "99+" : NotificationS.trackedNotifications.values.length
                font.family: Config.font
                font.pixelSize: Config.labelSize(bar.height) * 0.6
                font.bold: true
                color: Colors.error_fg
            }
        }

        // muted indicator dot
        Rectangle {
            visible: !NotificationS.soundEnabled
            width: 8
            height: 8
            radius: 4
            color: Colors.error
            border.width: 1
            border.color: Colors.error_fg
            anchors.bottom: parent.bottom
            anchors.right: parent.right
            anchors.bottomMargin: 3
            anchors.rightMargin: 3
        }

        // Image{
        //     id: iconImage
        //     source: Quickshell.iconPath("discord")
        //     width: Config.bigIconSize(notificationButton.height)
        //     height: Config.bigIconSize(notificationButton.height)
        // }
    }
}