import QtQuick
import Quickshell
import "../../config"

Rectangle {
    id: root

    required property var notification
    property real duration: 5000 // Expected in milliseconds (e.g., 5000 for 5s)

    signal dismissed(var notification)

    implicitWidth: content.implicitWidth + 2*18
    implicitHeight: content.implicitHeight + 18 + progressBar.height

    color: Qt.alpha(Colors.primaryContainer, 0.75)
    border.width: Config.border_width
    border.color: Colors.primary

    MouseArea {
        id: mouseArea
        anchors.fill: parent
        hoverEnabled: true

        onClicked: {
            dismissed(root.notification)
        }

        Column {
            id: content
            anchors.fill: parent
            anchors.margins: 10
            spacing: 5

            Text {
                id: appNameText
                text: root.notification?.id + ": " + (root.notification?.appName ?? "")
                font.family: Config.font
                font.pixelSize: 18
                color: Colors.primary
                elide: Text.ElideRight
            }

            Text {
                id: summaryText
                text: root.notification?.summary ?? ""
                font.family: Config.font
                font.pixelSize: 22
                color: Colors.primary
                wrapMode: Text.Wrap
            }

            Text {
                id: bodyText
                text: root.notification?.body ?? ""
                font.family: Config.font
                font.pixelSize: 16
                color: Colors.primary
                wrapMode: Text.Wrap
            }
        }
    }

    // Timeout progress bar
    Rectangle {
        id: progressBar
        anchors.bottom: parent.bottom
        anchors.left: parent.left
        height: 10
        color: Colors.primary

        property real progress: 1.0
        width: root.width * progress

        NumberAnimation on progress {
            id: anim
            running: root.duration > 0
            from: 1.0
            to: 0.0
            // If your duration property comes in seconds (e.g., 5), change to: (root.duration * 1000)
            duration: root.duration 
            paused: mouseArea.containsMouse

            onFinished: root.dismissed(root.notification)
        }
    }

    Component.onCompleted: {
        console.log(
            "[NotificationBody]:",
            notification,
            "notification:",
            notification.appName
        )
    }
}