✨ ags(apps-window): focus entry on open, show results immediatelly

ags/window/AppsWindow.ts

@@ -7,25 +7,18 @@ const { TOP, LEFT, RIGHT, BOTTOM } = Astal.WindowAnchor;
 
 export const AppsWindow = (mon: number): (Widget.Window) => {
     const searchString = new Variable<string>("");
-    let searchSubscription: () => void;
+    const searchSubscription = searchString.subscribe((str: string) => {
+        updateResults(str);
+    });
+
+    let results: Array<AstalApps.Application> = [];
 
-    return new Widget.Window({
-        namespace: "apps-window",
-        layer: Astal.Layer.OVERLAY,
-        exclusivity: Astal.Exclusivity.IGNORE,
-        anchor: TOP | LEFT | RIGHT | BOTTOM,
-        keymode: Astal.Keymode.EXCLUSIVE,
-        monitor: mon,
-        onDestroy: () => {
-            searchString.set("");
-            searchSubscription()
-        },
-        setup: (window) => {
     const flowbox = new Gtk.FlowBox({
         rowSpacing: 6,
         homogeneous: true,
         columnSpacing: 6,
         expand: false,
+        vexpand: false,
         orientation: Gtk.Orientation.HORIZONTAL,
         visible: true
     } as Gtk.FlowBox.ConstructorProps);
@@ -39,24 +32,34 @@ export const AppsWindow = (mon: number): (Widget.Window) => {
         }
     } as Widget.EntryProps);
 
-            searchSubscription = searchString.subscribe((str: string) => {
+    async function updateResults(str: string) {
-                const results: Array<AstalApps.Application> = getAstalApps().fuzzy_query(str);
+        results = [];
+        results = getAstalApps().fuzzy_query(str);
 
         // Destroy is handled by GnomeJS
         flowbox.get_children().map(flowboxChild => flowbox.remove(flowboxChild));
 
         results.map(app => {
-                    flowbox.insert(new Widget.Button({
+            flowbox.insert(AppWidget(app), -1);
+
+            const flowboxchild = flowbox.get_children()[flowbox.get_children().length-1];
+            flowboxchild.set_valign(Gtk.Align.START);
+        });
+
+        const firstChild = flowbox.get_child_at_index(0);
+        firstChild && flowbox.select_child(firstChild);
+    }
+
+    function AppWidget(app: AstalApps.Application) {
+        return new Widget.Button({
             onClick: (_button, event: Astal.ClickEvent) => {
                 if(event.button === Astal.MouseButton.PRIMARY) {
                     searchString.set("");
                     entry.text = "";
                     window.close();
                     cleanExec(app);
-
                     return;
                 }
-
                 // select app launch options TODO
             },
             child: new Widget.Box({
@@ -74,17 +77,25 @@ export const AppsWindow = (mon: number): (Widget.Window) => {
                     } as Widget.LabelProps)
                 ]
             } as Widget.BoxProps)
-                    } as Widget.ButtonProps), -1);
+        } as Widget.ButtonProps);
+    }
 
-                    const flowboxchild = flowbox.get_children()[flowbox.get_children().length-1];
+    const window = new Widget.Window({
-                    flowboxchild.set_valign(Gtk.Align.START);
+        namespace: "apps-window",
-                });
+        layer: Astal.Layer.OVERLAY,
-
+        exclusivity: Astal.Exclusivity.IGNORE,
-                const firstChild = flowbox.get_child_at_index(0);
+        anchor: TOP | LEFT | RIGHT | BOTTOM,
-                firstChild && flowbox.select_child(firstChild);
+        keymode: Astal.Keymode.EXCLUSIVE,
-            });
+        monitor: mon,
-
+        onDestroy: () => {
-            window.add(new Widget.EventBox({
+            searchString.set("");
+            searchSubscription()
+        },
+        onKeyPressEvent: (_, event: Gdk.Event) => {
+            event.get_keyval()[1] === Gdk.KEY_Escape &&
+                _.close();
+        },
+        child: new Widget.EventBox({
             onClick: () => {
                 searchString.set("");
                 entry.text = "";
@@ -111,7 +122,9 @@ export const AppsWindow = (mon: number): (Widget.Window) => {
                     } as Widget.ScrollableProps)
                 ]
             } as Widget.BoxProps)
-            } as Widget.EventBoxProps));
+        } as Widget.EventBoxProps),
-        }
+        setup: () => updateResults("")
     });
+
+    return window;
 }