import Quickshell
import QtQuick
import "../components"

PanelWindow {
    id: root

    property var modelData
    screen: modelData

    anchors {
        top: true
        left: true
        right: true
    }
    implicitHeight: 40
    color: Theme.bg

    readonly property string screenName: modelData.name

    // Layout — three sections anchored independently for true centering
    Item {
        anchors.fill: parent
        anchors.leftMargin: 8
        anchors.rightMargin: 8
        anchors.topMargin: 2
        anchors.bottomMargin: 2

        // Left
        Enclosure {
            anchors.left: parent.left
            anchors.verticalCenter: parent.verticalCenter
            child: Workspaces {
                screenName: root.screenName
            }
        }

        // Center — truly centered regardless of left/right content width
        Enclosure {
            anchors.centerIn: parent
            child: MusicPlayer {
                id: musicChip
                onClicked: musicControls.visible = !musicControls.visible
            }
        }

        // Right — status chips
        Enclosure {
            anchors.right: parent.right
            anchors.verticalCenter: parent.verticalCenter
            child: Row {
                spacing: 8

                SysTray {
                    anchors.verticalCenter: parent.verticalCenter
                    barWindow: root
                }

                NetworkStatus {
                    anchors.verticalCenter: parent.verticalCenter
                }

                VolumeControl {
                    anchors.verticalCenter: parent.verticalCenter
                }

                Clock {
                    anchors.verticalCenter: parent.verticalCenter
                }
            }
        }
    }

    // Popup declared after the layout so musicChip is already initialised.
    // Centered horizontally within the bar window, placed just below it.
    MusicPlayerControls {
        id: musicControls
        visible: false
        anchor.window: root
        anchor.rect.x: Math.round((root.width - musicControls.width) / 2)
        anchor.rect.y: root.height
        player: musicChip.player
    }
}