import QtQuick
import "../services" as S
import NovaStats as NS

Column {
    id: root

    required property int percent
    required property real usedGb
    required property real totalGb
    required property real availGb
    required property real cachedGb
    required property real buffersGb
    required property var processes
    required property color accentColor

    property bool active: true

    function _fmt(gb) {
        return gb >= 10 ? gb.toFixed(1) + "G" : gb.toFixed(2) + "G";
    }

    // Usage bar
    Item {
        width: root.width
        height: 14

        Item {
            id: memBar
            anchors.left: parent.left
            anchors.leftMargin: 12
            anchors.right: parent.right
            anchors.rightMargin: 12
            anchors.verticalCenter: parent.verticalCenter
            height: 6

            Rectangle {
                anchors.fill: parent
                color: NS.ThemeService.base02
                radius: 3
            }

            // Cached (base0D, behind used)
            Rectangle {
                width: parent.width * Math.min(1, (root.usedGb + root.cachedGb) / Math.max(root.totalGb, 0.001))
                height: parent.height
                color: NS.ThemeService.base0D
                opacity: 0.4
                radius: 3
                Behavior on width {
                    enabled: root.active
                    NumberAnimation {
                        duration: 200
                    }
                }
            }

            // Used (accentColor, on top)
            Rectangle {
                width: parent.width * Math.min(1, root.usedGb / Math.max(root.totalGb, 0.001))
                height: parent.height
                color: root.accentColor
                radius: 3
                Behavior on width {
                    enabled: root.active
                    NumberAnimation {
                        duration: 200
                    }
                }
            }
        }
    }

    // Breakdown rows
    InfoRow {
        label: "Used"
        value: root._fmt(root.usedGb)
    }
    InfoRow {
        label: "Cached"
        value: root._fmt(root.cachedGb)
    }
    InfoRow {
        label: "Available"
        value: root._fmt(root.availGb)
    }
    InfoRow {
        label: "Total"
        value: root._fmt(root.totalGb)
    }

    // Memory history sparkline
    SparklineCanvas {
        anchors.left: parent.left
        anchors.leftMargin: 12
        anchors.right: parent.right
        anchors.rightMargin: 12
        height: 32
        history: S.SystemStats.memHistory
        strokeColor: root.accentColor
        colorAt: v => S.ThemeUtil.loadColor(v)
        active: root.active
    }

    // Process list - hidden on lock screen (exposes running process names)
    Column {
        visible: !S.LockService.locked
        width: root.width

        Separator {}

        Item {
            width: parent.width
            height: 18

            Text {
                anchors.left: parent.left
                anchors.leftMargin: 12
                anchors.verticalCenter: parent.verticalCenter
                text: "PROCESS"
                color: NS.ThemeService.base03
                font.pixelSize: NS.ThemeService.fontSize - 3
                font.family: NS.ThemeService.fontFamily
                font.letterSpacing: 1
            }

            Text {
                anchors.right: parent.right
                anchors.rightMargin: 12
                anchors.verticalCenter: parent.verticalCenter
                text: "MEM"
                color: NS.ThemeService.base03
                font.pixelSize: NS.ThemeService.fontSize - 3
                font.family: NS.ThemeService.fontFamily
                font.letterSpacing: 1
            }
        }

        Repeater {
            model: root.processes

            delegate: Item {
                required property var modelData
                width: root.width
                height: 20

                Text {
                    anchors.left: parent.left
                    anchors.leftMargin: 12
                    anchors.verticalCenter: parent.verticalCenter
                    text: modelData.cmd
                    color: NS.ThemeService.base05
                    font.pixelSize: NS.ThemeService.fontSize - 2
                    font.family: NS.ThemeService.fontFamily
                    elide: Text.ElideRight
                    width: parent.width - 80
                }

                Text {
                    anchors.right: parent.right
                    anchors.rightMargin: 12
                    anchors.verticalCenter: parent.verticalCenter
                    text: modelData.mem.toFixed(1) + "%"
                    color: NS.ThemeService.base04
                    font.pixelSize: NS.ThemeService.fontSize - 2
                    font.family: NS.ThemeService.fontFamily
                    width: 36
                    horizontalAlignment: Text.AlignRight
                }
            }
        }

        Item {
            width: 1
            height: 4
        }
    }
}