import QtQuick
import QtQuick.Layouts
import Quickshell
import Quickshell.Wayland
import "../theme"
import ".."

PanelWindow {
    id: root

    property var modelData
    screen: modelData

    anchors {
        top: true
        left: true
        right: true
    }

    margins.left: Theme.sidebarWidth

    implicitHeight: Theme.topStripHeight
    color: Qt.rgba(Theme.bgPrimary.r, Theme.bgPrimary.g, Theme.bgPrimary.b, 0.92)
    exclusiveZone: Theme.topStripHeight

    WlrLayershell.layer: WlrLayer.Top
    WlrLayershell.namespace: "quickshell-topstrip"
    WlrLayershell.keyboardFocus: WlrKeyboardFocus.None

    Rectangle {
        id: bottomBorder
        anchors {
            bottom: parent.bottom
            left: parent.left
            right: parent.right
        }
        height: 1
        color: Theme.glassBorder
    }

    RowLayout {
        anchors.fill: parent
        anchors.leftMargin: 16
        anchors.rightMargin: 16
        spacing: 16

        // Left Section
        Text {
            id: workspaceIndicator
            Layout.alignment: Qt.AlignVCenter
            font.family: Theme.fontMono
            font.pixelSize: 12
            color: Theme.textMuted
            
            function pad(num) {
                if (num === undefined || num === null) return "00";
                return num < 10 ? "0" + num : num.toString();
            }

            text: pad(GlobalState.activeWorkspace) + " // " + (GlobalState.workspaceNames[GlobalState.activeWorkspace] !== undefined ? GlobalState.workspaceNames[GlobalState.activeWorkspace] : "main")

            Behavior on color {
                ColorAnimation { duration: 150 }
            }
        }

        // Center Section
        Text {
            id: windowTitle
            Layout.fillWidth: true
            Layout.alignment: Qt.AlignVCenter
            horizontalAlignment: Text.AlignHCenter
            font.family: Theme.fontSerif
            font.italic: true
            font.pixelSize: Theme.fontSizeLarge
            color: Theme.textSecondary
            elide: Text.ElideRight
            maximumLineCount: 1

            text: GlobalState.activeWindowTitle

            Behavior on color {
                ColorAnimation { duration: 150 }
            }
        }

        // Right Section
        Text {
            id: clock
            Layout.alignment: Qt.AlignVCenter
            font.family: Theme.fontMono
            font.pixelSize: 12
            color: Theme.textPrimary
            text: GlobalState.timeString

            Behavior on color {
                ColorAnimation { duration: 150 }
            }
        }
    }
}