pragma ComponentBehavior: Bound

import QtQuick
import QtQuick.Layouts
// Workspaces.qml
import Quickshell
import Quickshell.Hyprland
import Quickshell.Widgets
import qs.Common
import qs.Common.Styled
import qs.Services

WrapperMouseArea {
    id: root

    property var monitor: "black"

    onWheel: wheel => {
        if (wheel.angleDelta.y > 0) {
            if ((Hyprland.focusedWorkspace.id) % 5 === 0)
                return;

            Hyprland.dispatch("workspace " + (Hyprland.focusedWorkspace.id + 1));
        } else if (wheel.angleDelta.y < 0) {
            if (Hyprland.focusedWorkspace.id === 1 || Hyprland.focusedWorkspace.id === 6)
                return;

            Hyprland.dispatch("workspace " + (Hyprland.focusedWorkspace.id - 1));
        }
    }

    RowLayout {

        property var monitor: root.monitor

        Layout.alignment: Qt.AlignVCenter | Qt.AlignHCenter

        Repeater {
            id: workspacesRepeater

            property var monitor: parent.monitor

            model: 5

            delegate: BackgroundRectangle {
                id: workspacesRectangle

                property string type: "workspace"

                required property var modelData
                property var index: modelData // Get the workspace data from the model
                property int workspaceIndex: parent.monitor === "DP-2" ? modelData + 5 : modelData
                property int workspaceIndexAlign: workspaceIndex + 1
                property var workspace: Hyprland.workspaces.values.length > workspaceIndex ? Hyprland.workspaces.values[workspaceIndex] : null
                property bool workspaceActive: workspace === Hyprland.focusedWorkspace ? true : false
                property var topLevels: HyprlandService.topLevelWorkspaces
                property var hasTopLevel: topLevels.filter(topLevelworkspace => topLevelworkspace.id === workspaceIndexAlign).length ? true : false

                Layout.alignment: Qt.AlignVCenter | Qt.AlignHCenter
                implicitHeight: Theme.heightGaps

                states: [
                    State {
                        name: "Active"
                        when: workspacesRectangle.workspaceActive
                        PropertyChanges {
                            workspacesRectangle {
                                color: Theme.color5
                                implicitWidth: Theme.barSize * 1.5
                            }
                        }
                    },
                    State {
                        name: "Filled"
                        when: !workspacesRectangle.workspaceActive && workspacesRectangle.hasTopLevel
                        PropertyChanges {
                            workspacesRectangle {
                                color: Theme.backgroudColorBright
                                implicitWidth: Theme.barSize
                            }
                        }
                    },
                    State {
                        name: "Empty"
                        when: !workspacesRectangle.workspaceActive && !workspacesRectangle.hasTopLevel
                        PropertyChanges {
                            workspacesRectangle {
                                color: Theme.backgroudColor
                                implicitWidth: Theme.barSize
                            }
                        }
                    }
                ]

                Behavior on color {
                    ColorAnimation {
                        duration: Theme.animationDuration
                    }
                }

                Behavior on implicitWidth {
                    NumberAnimation {
                        duration: Theme.animationDuration
                    }
                }

                StyledText {

                    property int workspaceName: workspacesRectangle.workspaceIndexAlign > 5 ? workspacesRectangle.workspaceIndexAlign - 5 : workspacesRectangle.workspaceIndexAlign

                    anchors.centerIn: parent
                    text: workspaceName
                }

                MouseArea {
                    anchors.fill: parent
                    hoverEnabled: true
                    onEntered: {
                        if (parent.hasTopLevel && !parent.workspaceActive) {
                            PopUpHover.start(workspacesRectangle, "workspace");
                        }
                    }
                    onExited: {
                        PopUpHover.exit();
                    }
                    onClicked: {
                        if (workspacesRectangle.workspace.id === Hyprland.focusedWorkspace.id) {
                            return;
                        }
                        Hyprland.dispatch("workspace " + workspacesRectangle.workspace.id);
                        PopUpHover.exit();
                    }
                }
            }
        }
    }
}