import Quickshell
import Quickshell.Widgets
import QtQuick.Layouts
import QtQuick
import qs
import qs.settings
import qs.widgets

WrapperRectangle {
    id: root
    required property var notification
    required property ShellScreen nScreen
    implicitWidth: nScreen.width / 6
    implicitHeight: 100
    radius: Config.rounding
    anchors.right: parent?.right
    color: Colors.base01
    clip: true
    Timer {
        id: dismissTimer
        running: true
        interval: 5000
        repeat: false
        onTriggered: root.notification?.dismiss()
    }
    child: WrapperMouseArea {
        id: mouseHandler
        child: RowLayout {
            spacing: 10
            IconImage {
                id: appIcon
                Layout.leftMargin: 8
                visible: root.notification?.image ? true : false
                source: root.notification?.image ? root.notification.image : ''
                implicitSize: 64
            }
            ColumnLayout {
                Layout.alignment: Qt.AlignLeft
                Layout.fillWidth: true
                Layout.preferredWidth: 0
                Layout.fillHeight: true
                Layout.leftMargin: appIcon.visible ? 0 : 16
                RowLayout {
                    Layout.alignment: Qt.AlignTop
                    MaterialIcon {
                        text: "\uea35"
                        font.pixelSize: 12
                    }
                    StyledText {
                        id: appId
                        text: root.notification?.appName ? root.notification.appName : ''
                        opacity: 0.4
                    }
                }
                ColumnLayout {
                    spacing: 0
                    Layout.rightMargin: 40
                    StyledText {
                        id: title
                        Layout.bottomMargin: 0
                        Layout.topMargin: 5
                        Layout.alignment: Qt.AlignBottom
                        Layout.fillWidth: true
                        text: root.notification?.summary == null ? '' : root.notification.summary
                        elide: Text.ElideRight
                    }
                    StyledText {
                        id: body
                        Layout.alignment: Qt.AlignBottom
                        text: root.notification?.body ? root.notification.body : ''
                        elide: Text.ElideRight
                        maximumLineCount: 1
                        Layout.fillWidth: true
                        opacity: 0.6
                    }
                }
            }
        }
        acceptedButtons: Qt.LeftButton
        cursorShape: Qt.PointingHandCursor
        hoverEnabled: true
        onEntered: {
            root.color = Colors.base03;
        }
        onExited: {
            root.color = Colors.base01;
        }
        onClicked: {
            root.notification ? root.notification.dismiss() : '';
        }
    }
}