import QtQuick
import "../services" as S

Column {
    id: root

    required property color accentColor
    property bool active: true

    property bool _localExpanded: true

    // Localhost section header
    Item {
        width: root.width
        height: 32

        Rectangle {
            anchors.fill: parent
            anchors.leftMargin: 4
            anchors.rightMargin: 4
            color: _localHdrHover.hovered ? S.Theme.base02 : "transparent"
            radius: S.Theme.radius
            z: -1
        }

        HoverHandler {
            id: _localHdrHover
        }

        Text {
            anchors.left: parent.left
            anchors.leftMargin: 12
            anchors.verticalCenter: parent.verticalCenter
            text: "  localhost"
            color: S.Theme.base05
            font.pixelSize: S.Theme.fontSize
            font.family: S.Theme.fontFamily
        }

        Rectangle {
            id: _localStateChip
            anchors.right: _localChevron.left
            anchors.rightMargin: 8
            anchors.verticalCenter: parent.verticalCenter
            visible: S.SystemdService.systemState !== "unknown"
            color: {
                const st = S.SystemdService.systemState;
                if (st === "running")
                    return S.Theme.base0B;
                if (st === "degraded")
                    return S.Theme.base0A;
                return S.Theme.base08;
            }
            opacity: 0.85
            radius: 3
            width: _localStateLbl.width + 8
            height: 14

            Text {
                id: _localStateLbl
                anchors.centerIn: parent
                text: S.SystemdService.systemState
                color: S.Theme.base00
                font.pixelSize: S.Theme.fontSize - 3
                font.family: S.Theme.fontFamily
            }
        }

        Text {
            id: _localChevron
            anchors.right: parent.right
            anchors.rightMargin: 12
            anchors.verticalCenter: parent.verticalCenter
            text: root._localExpanded ? "" : ""
            color: S.Theme.base04
            font.pixelSize: S.Theme.fontSize - 2
            font.family: S.Theme.iconFontFamily
        }

        TapHandler {
            onTapped: root._localExpanded = !root._localExpanded
        }
    }

    // Localhost expanded content
    Column {
        visible: root._localExpanded
        width: root.width

        // System sub-section
        Item {
            width: root.width
            height: 22

            Text {
                anchors.left: parent.left
                anchors.leftMargin: 24
                anchors.verticalCenter: parent.verticalCenter
                text: "SYSTEM"
                color: S.Theme.base03
                font.pixelSize: S.Theme.fontSize - 3
                font.family: S.Theme.fontFamily
                font.letterSpacing: 1
            }
        }

        Repeater {
            model: S.SystemdService.systemUnits
            delegate: SystemdUnitRow {
                required property var modelData
                unitName: modelData.name
                description: modelData.description
                subState: modelData.subState
                isUser: false
                machineName: ""
                accentColor: root.accentColor
            }
        }

        Item {
            visible: S.SystemdService.systemUnits.length === 0
            width: root.width
            height: 22
            Text {
                anchors.centerIn: parent
                text: "no failures"
                color: S.Theme.base0B
                font.pixelSize: S.Theme.fontSize - 2
                font.family: S.Theme.fontFamily
            }
        }

        // User sub-section
        Item {
            width: root.width
            height: 22

            Text {
                anchors.left: parent.left
                anchors.leftMargin: 24
                anchors.verticalCenter: parent.verticalCenter
                text: "USER"
                color: S.Theme.base03
                font.pixelSize: S.Theme.fontSize - 3
                font.family: S.Theme.fontFamily
                font.letterSpacing: 1
            }
        }

        Repeater {
            model: S.SystemdService.userUnits
            delegate: SystemdUnitRow {
                required property var modelData
                unitName: modelData.name
                description: modelData.description
                subState: modelData.subState
                isUser: true
                machineName: ""
                accentColor: root.accentColor
            }
        }

        Item {
            visible: S.SystemdService.userUnits.length === 0
            width: root.width
            height: 22
            Text {
                anchors.centerIn: parent
                text: "no failures"
                color: S.Theme.base0B
                font.pixelSize: S.Theme.fontSize - 2
                font.family: S.Theme.fontFamily
            }
        }
    }

    // Containers
    Repeater {
        model: S.MachinectlService.machines

        delegate: Column {
            id: _machineSection
            required property var modelData
            required property int index

            property bool _expanded: false
            property bool _loading: false

            width: root.width

            Connections {
                target: S.MachinectlService
                function onMachineReady(machineName) {
                    if (machineName === _machineSection.modelData.name)
                        _machineSection._loading = false;
                }
            }

            Separator {}

            // Machine header
            Item {
                width: _machineSection.width
                height: 32

                Rectangle {
                    anchors.fill: parent
                    anchors.leftMargin: 4
                    anchors.rightMargin: 4
                    color: _mHdrHover.hovered ? S.Theme.base02 : "transparent"
                    radius: S.Theme.radius
                    z: -1
                }

                HoverHandler {
                    id: _mHdrHover
                }

                Text {
                    anchors.left: parent.left
                    anchors.leftMargin: 12
                    anchors.verticalCenter: parent.verticalCenter
                    text: "  " + _machineSection.modelData.name
                    color: S.Theme.base05
                    font.pixelSize: S.Theme.fontSize
                    font.family: S.Theme.fontFamily
                    elide: Text.ElideRight
                    width: parent.width - 100
                }

                Rectangle {
                    id: _mStateChip
                    anchors.right: _mChevron.left
                    anchors.rightMargin: 8
                    anchors.verticalCenter: parent.verticalCenter
                    visible: _machineSection._expanded && !_machineSection._loading
                    color: {
                        const st = S.MachinectlService.machineState(_machineSection.modelData.name);
                        if (st === "running")
                            return S.Theme.base0B;
                        if (st === "degraded")
                            return S.Theme.base0A;
                        return st === "unknown" ? "transparent" : S.Theme.base08;
                    }
                    opacity: 0.85
                    radius: 3
                    width: _mStateLbl.width + 8
                    height: 14

                    Text {
                        id: _mStateLbl
                        anchors.centerIn: parent
                        text: S.MachinectlService.machineState(_machineSection.modelData.name)
                        color: S.Theme.base00
                        font.pixelSize: S.Theme.fontSize - 3
                        font.family: S.Theme.fontFamily
                    }
                }

                Text {
                    id: _mChevron
                    anchors.right: parent.right
                    anchors.rightMargin: 12
                    anchors.verticalCenter: parent.verticalCenter
                    text: _machineSection._expanded ? "" : ""
                    color: S.Theme.base04
                    font.pixelSize: S.Theme.fontSize - 2
                    font.family: S.Theme.iconFontFamily
                }

                TapHandler {
                    onTapped: {
                        _machineSection._expanded = !_machineSection._expanded;
                        if (_machineSection._expanded) {
                            _machineSection._loading = true;
                            S.MachinectlService.fetchMachine(_machineSection.modelData.name);
                        }
                    }
                }
            }

            // Machine expanded content
            Column {
                visible: _machineSection._expanded
                width: _machineSection.width

                Item {
                    visible: _machineSection._loading
                    width: _machineSection.width
                    height: 28
                    Text {
                        anchors.centerIn: parent
                        text: "loading..."
                        color: S.Theme.base04
                        font.pixelSize: S.Theme.fontSize - 2
                        font.family: S.Theme.fontFamily
                    }
                }

                // System units inside the container
                Item {
                    visible: !_machineSection._loading
                    width: _machineSection.width
                    height: 22

                    Text {
                        anchors.left: parent.left
                        anchors.leftMargin: 24
                        anchors.verticalCenter: parent.verticalCenter
                        text: "SYSTEM"
                        color: S.Theme.base03
                        font.pixelSize: S.Theme.fontSize - 3
                        font.family: S.Theme.fontFamily
                        font.letterSpacing: 1
                    }
                }

                Repeater {
                    model: !_machineSection._loading ? S.MachinectlService.machineUnits(_machineSection.modelData.name) : []
                    delegate: SystemdUnitRow {
                        required property var modelData
                        unitName: modelData.name
                        description: modelData.description
                        subState: modelData.subState
                        isUser: false
                        machineName: _machineSection.modelData.name
                        accentColor: root.accentColor
                    }
                }

                Item {
                    visible: !_machineSection._loading && S.MachinectlService.machineUnits(_machineSection.modelData.name).length === 0
                    width: _machineSection.width
                    height: 22
                    Text {
                        anchors.centerIn: parent
                        text: "no failures"
                        color: S.Theme.base0B
                        font.pixelSize: S.Theme.fontSize - 2
                        font.family: S.Theme.fontFamily
                    }
                }
            }
        }
    }

    Item {
        width: 1
        height: 4
    }
}