example(applauncher): hide on app launch

1 files changed, 12 insertions, 2 deletions

diff --git a/examples/js/applauncher/widget/Applauncher.tsx b/examples/js/applauncher/widget/Applauncher.tsx
index f52780b..c7bac68 100644
--- a/examples/js/applauncher/widget/Applauncher.tsx
+++ b/examples/js/applauncher/widget/Applauncher.tsx
@@ -4,8 +4,14 @@ import { Variable } from "astal"
 
 const MAX_ITEMS = 8
 
+function hide() {
+    App.get_window("launcher")!.hide()
+}
+
 function AppButton({ app }: { app: Apps.Application }) {
-    return <button className="AppButton" onClicked={() => app.launch()}>
+    return <button
+        className="AppButton"
+        onClicked={() => { hide(); app.launch() }}>
         <box>
             <icon icon={app.iconName} />
             <box valign={Gtk.Align.CENTER} vertical>
@@ -32,7 +38,10 @@ export default function Applauncher() {
 
     const text = Variable("")
     const list = text(text => apps.fuzzy_query(text).slice(0, MAX_ITEMS))
-    const hide = () => App.get_window("launcher")!.hide()
+    const onEnter = () => {
+        apps.fuzzy_query(text.get())?.[0].launch()
+        hide()
+    }
 
     return <window
         name="launcher"
@@ -54,6 +63,7 @@ export default function Applauncher() {
                         placeholderText="Search"
                         text={text()}
                         onChanged={self => text.set(self.text)}
+                        onActivate={onEnter}
                     />
                     <box spacing={6} vertical>
                         {list.as(list => list.map(app => (