pragma ComponentBehavior: Bound

import QtQuick
import QtQuick.Controls
import QtQuick.Layouts
import Quickshell
import Quickshell.Wayland
import Quickshell.Widgets
import Quickshell.Io

Singleton {
    id: topLevel
    required property real width

    Timer {
        id: closeTimer
        interval: 400
        running: false
        repeat: false
        onTriggered: launcherData.active = false
    }

    PersistentProperties {
        id: launcherData
        property bool open: false
        property bool active: false
        property real curWidth: 0
        onOpenChanged: {
            if (open) {
                curWidth = topLevel.width;
                launcherData.active = true;
            } else {
                curWidth = 0;
                closeTimer.start();
            }
        }
        Behavior on curWidth {
            NumberAnimation {
                duration: 400
                easing.type: Easing.InOutQuad
            }
        }
    }

    IpcHandler {
        target: "launch"
        function open(): void {
            launcherData.open = true;
        }
        function close(): void {
            launcherData.open = false;
        }
        function toggle(): void {
            launcherData.open = !launcherData.open;
        }
    }

    LazyLoader {
        id: loader
        activeAsync: launcherData.active

        PanelWindow {
            id: launcherBase

            anchors {
                top: true
                bottom: true
                right: true
            }

            color: "transparent"
            implicitWidth: topLevel.width

            WlrLayershell.layer: WlrLayer.Overlay
            focusable: true
            exclusionMode: ExclusionMode.Ignore
            WlrLayershell.namespace: "shell:launcher"
            WlrLayershell.keyboardFocus: WlrKeyboardFocus.Exclusive
            // launcherData.curWidth

            Rectangle {
                color: "#ffab5b"
                anchors {
                    fill: parent
                    topMargin: parent.height / 3
                    bottomMargin: anchors.topMargin
                    leftMargin: topLevel.width - launcherData.curWidth
                }
                bottomLeftRadius: 10
                // topLeftRadius: 10

                Rectangle {
                    color: "#272a2a"
                    anchors {
                        fill: parent
                        topMargin: 3
                        bottomMargin: 3
                        leftMargin: 3
                    }
                    bottomLeftRadius: 10
                    // topLeftRadius: 10
                    // implicitWidth: topLevel.width

                    TextField {
                        id: searchField
                        anchors {
                            top: parent.top
                            left: parent.left
                            right: parent.right
                            topMargin: 10
                            leftMargin: 10
                        }
                        font {
                            family: "Inria Sans"
                            pointSize: 12
                        }
                        color: "#202e2f"
                        height: 24
                        background: Rectangle {
                            color: "#caccce"
                            radius: 5
                        }
                        focus: true

                        Keys.forwardTo: [list]
                        Keys.onEscapePressed: launcherData.open = false

                        onAccepted: {
                            if (list.currentItem) {
                                list.currentItem.clicked(null);
                            }
                        }
                    }

                    Rectangle {
                        id: emptyScrollbar
                        anchors {
                            left: parent.left
                            top: searchField.bottom
                            bottom: list.bottom
                            topMargin: 6
                            bottomMargin: 4
                            leftMargin: 4
                        }
                        color: "#3a5299ff"
                        width: 3
                        radius: 10
                    }

                    ListView {
                        id: list
                        anchors {
                            left: parent.left
                            right: parent.right
                            bottom: parent.bottom
                            top: searchField.bottom
                            topMargin: 4
                            leftMargin: 12
                            bottomMargin: 12
                        }
                        clip: true
                        cacheBuffer: 0
                        model: ScriptModel {
                            values: DesktopEntries.applications.values.map(x => x).filter(entry => {
                                const search = searchField.text.toLowerCase();
                                const name = entry.name.toLowerCase();
                                return search.length ? name.indexOf(search) > -1 : true;
                            })
                        }
                        onModelChanged: list.currentIndex = 0
                        highlight: Rectangle {
                            anchors {
                                left: parent.left
                                right: parent.right
                            }
                            color: "#7f5299ff"
                            border.color: "#928cc9"
                            border.width: 2
                        }
                        spacing: 0
                        delegate: MouseArea {
                            id: clickableEntry
                            required property DesktopEntry modelData
                            onClicked: {
                                modelData.execute();
                                launcherData.open = false;
                            }
                            implicitHeight: 24
                            implicitWidth: ListView.view.width

                            RowLayout {
                                id: rowEntry

                                anchors {
                                    left: parent.left
                                    leftMargin: 4
                                    verticalCenter: parent.verticalCenter
                                }

                                IconImage {
                                    asynchronous: true
                                    implicitSize: 18
                                    source: Quickshell.iconPath(clickableEntry.modelData.icon)
                                }

                                Text {
                                    font {
                                        family: "Inria Sans"
                                        pointSize: 12
                                    }
                                    color: "#ffab5b"
                                    text: clickableEntry.modelData.name
                                    Layout.alignment: Qt.AlignBottom
                                }
                            }
                        }
                    }
                }
            }
        }
    }
}
