import QtQuick
import Quickshell
import Quickshell.Hyprland
import "../../../config"
import "../states/Apps"

Rectangle {
    id: workspacesContainer
    required property HyprlandMonitor thisMonitor

    height: bar.height - (Config.spacing_fun(bar.height) * 1.5)
    width: workspacesRow.width + (Config.spacing_fun(bar.height) * 2)
    
    radius: height / 2
    
    color: Colors.surfaceVariant 
    border.color: Colors.surfaceVariant_fg
    border.width: Config.border_width

    Row {
        id: workspacesRow
        anchors.centerIn: parent
        spacing: Config.spacing_fun(bar.height) / 2 

        Repeater {
            model: Hyprland.workspaces
            Loader {
                active: modelData.monitor === thisMonitor
                sourceComponent: Item {
                    id: wsItem
                    property var workspaceData: modelData
                    
                    width: Math.max(40, wsIconsRow.width==0 ? wsNum.width + 2*Config.spacing_fun(bar.height) : wsNum.width + wsIconsRow.width + 3*Config.spacing_fun(bar.height)+Config.spacing_fun(bar.height))
                    // width: {
                    //     var spacing = Config.spacing_fun(bar.height)
                    //     var cw = wsNum.width
                    //     if (wsIconsRow.children.length > 0) {
                    //         cw += spacing + wsIconsRow.width + spacing
                    //     } else {
                    //         cw += spacing * 2
                    //     }
                    //     Math.max(cw, wsNum.height + spacing * 2)
                    // }
                    height: workspacesContainer.height
                    
                    // highlight
                    Rectangle {
                        anchors.centerIn: parent
                        width: parent.width
                        height: parent.height - (Config.spacing_fun(bar.height) * 1.5)
                        
                        radius: height / 2
                        
                        color: wsArea.containsMouse ? Colors.tertiaryContainer
                            : workspaceData.active ? Colors.primaryContainer
                            : "transparent"
                        
                        border.color: wsArea.containsMouse ? Colors.tertiaryContainer_fg
                            : workspaceData.active ? Colors.primaryContainer_fg
                            : "transparent"
                        
                        border.width: (wsArea.containsMouse || workspaceData.active) ? Config.border_width : 0

                        // hyprland workspace api + color
                        MouseArea {
                            id: wsArea
                            hoverEnabled: true
                            cursorShape: Qt.PointingHandCursor
                            anchors.fill: parent
                            onClicked: {
                                console.log("[Workspaces] Switch to workspace: " + workspaceData.id)
                                Hyprland.dispatch("workspace " + workspaceData.id)
                                Hyprland.dispatch("hl.dsp.focus({ workspace = "+workspaceData.id+" })")
                            }

                            Row {
                                anchors.left: parent.left
                                anchors.leftMargin: wsIconsRow.width==0 ? (wsItem.width-wsNum.width)/2 : (wsItem.width-wsNum.width-wsIconsRow.width-Config.spacing_fun(bar.height))/2
                                anchors.verticalCenter: parent.verticalCenter
                                spacing: Config.spacing_fun(bar.height)

                                Text {
                                    id: wsNum
                                    text: workspaceData.id
                                    anchors.verticalCenter: parent.verticalCenter
                                    color: wsArea.containsMouse ? Colors.tertiary
                                        : workspaceData.active ? Colors.primary
                                        : Colors.secondary
                                    font.pixelSize: Config.iconSize(bar.height)
                                    font.family: Config.font
                                    font.bold: true
                                }

                                Row {
                                    id: wsIconsRow
                                    spacing: Config.spacing_fun(workspacesContainer.height)
                                    anchors.verticalCenter: parent.verticalCenter

                                    Repeater {
                                        model: AppsState.iconsForWorkspace(workspaceData.id)
                                        delegate: Text {
                                            text: modelData
                                            color: wsArea.containsMouse ? Colors.tertiary
                                                : Colors.secondary
                                            font.pixelSize: Config.labelSize(bar.height)
                                            font.family: Config.font
                                        }
                                    }
                                }
                            }
                        }
                    }
                }
            }
        }
    }

    Text {
        visible: Hyprland.workspaces.length === 0
        text: "No Workspaces"
        color: Colors.error
        font.pixelSize: Config.iconSize(bar.height)
        anchors.centerIn: parent
    }
}