import QtQuick
import QtQuick.Layouts
import org.kde.plasma.components as PlasmaComponents3
import org.kde.plasma.plasmoid

PlasmoidItem {
    id: root

    readonly property int compactSize: 48
    readonly property int cardWidth: 420
    readonly property int cardHeight: 360

    implicitWidth: cardWidth
    implicitHeight: cardHeight
    preferredRepresentation: fullRepresentation
    switchWidth: cardWidth
    switchHeight: cardHeight

    compactRepresentation: Rectangle {
        id: compactButton

        width: root.compactSize
        height: root.compactSize
        implicitWidth: root.compactSize
        implicitHeight: root.compactSize
        radius: 14
        color: "#090A14"
        border.color: "#6F5CFF"
        border.width: 1

        PlasmaComponents3.Label {
            anchors.centerIn: parent
            text: "N"
            color: "#FFFFFF"
            font.pixelSize: 24
            font.bold: true
        }

        MouseArea {
            anchors.fill: parent
            hoverEnabled: true
            cursorShape: Qt.PointingHandCursor
            onClicked: root.expanded = !root.expanded
        }
    }

    fullRepresentation: Item {
        id: fullRoot

        width: root.cardWidth
        height: root.cardHeight
        implicitWidth: root.cardWidth
        implicitHeight: root.cardHeight

        Rectangle {
            id: card

            width: root.cardWidth
            height: root.cardHeight
            anchors.centerIn: parent
            clip: true
            radius: 24
            color: "#111321"
            border.color: "#6F5CFF"
            border.width: 1

            Rectangle {
                anchors.left: parent.left
                anchors.right: parent.right
                anchors.top: parent.top
                anchors.margins: 18
                height: 1
                color: "#30325A"
            }

            ColumnLayout {
                anchors.fill: parent
                anchors.margins: 24
                spacing: 16

                ColumnLayout {
                    Layout.fillWidth: true
                    spacing: 6

                    PlasmaComponents3.Label {
                        text: "NebulaOS"
                        color: "#FFFFFF"
                        font.pixelSize: 28
                        font.bold: true
                    }

                    PlasmaComponents3.Label {
                        text: "Desktop Mode prototype"
                        color: "#A7A8C8"
                        font.pixelSize: 14
                    }
                }

                Rectangle {
                    Layout.fillWidth: true
                    Layout.preferredHeight: 1
                    color: "#30325A"
                }

                GridLayout {
                    Layout.fillWidth: true
                    columns: 2
                    rowSpacing: 12
                    columnSpacing: 12

                    Repeater {
                        model: ["Library", "Settings", "Bigscreen", "Power"]

                        delegate: PlasmaComponents3.Button {
                            Layout.fillWidth: true
                            Layout.preferredHeight: 52
                            text: modelData
                            icon.name: modelData === "Library" ? "applications-games"
                                : modelData === "Settings" ? "settings-configure"
                                : modelData === "Bigscreen" ? "video-display"
                                : "system-shutdown"
                            onClicked: console.log("Nebula Launcher:", modelData)
                        }
                    }
                }

                Item { Layout.fillHeight: true }

                PlasmaComponents3.Label {
                    Layout.fillWidth: true
                    text: "Starter launcher UI for NebulaOS Desktop Mode."
                    color: "#7F81A8"
                    font.pixelSize: 12
                    wrapMode: Text.WordWrap
                }
            }
        }
    }
}