import { Variable } from "astal";
import { App, Astal, Gdk, Gtk } from "astal/gtk4";
import AstalApps from "gi://AstalApps";

const MAX_ITEMS = 8;

function hide() {
  App.get_window("launcher")!.hide();
}

const Launcher = () => {
    const { CENTER } = Gtk.Align;
    const apps = new AstalApps.Apps();
    const width = Variable(1000);

    const text = Variable("");
    const visible = Variable(false);
    const list = text((text) => apps.fuzzy_query(text).slice(0, MAX_ITEMS));
    const onEnter = () => {
        apps.fuzzy_query(text.get())?.[0].launch();
        hide();
    };
    return <window
        name="launcher"
        visible={visible()}
        anchor={Astal.WindowAnchor.TOP | Astal.WindowAnchor.BOTTOM}
        exclusivity={Astal.Exclusivity.EXCLUSIVE}
        keymode={Astal.Keymode.ON_DEMAND}
        application={App}
        onShow={(self) => {
            width.set(self.get_current_monitor().geometry.width);
        }}
        onKeyPressed={(self, keyval) => {
            if (keyval === Gdk.KEY_Escape) self.hide();
        }}
        child={
            <box></box>
        }
    >
    </window>
}