Close popup with esc

frontend/src/popup.rs

@@ -1,13 +1,15 @@
 use crate::bridge::invoke;
-use leptos::{html::Input, prelude::*};
+use leptos::{ev::keydown, html::Input, prelude::*};
-use wasm_bindgen::{prelude::Closure, JsCast};
+use wasm_bindgen::{prelude::Closure, JsCast, JsValue};
+use wasm_bindgen_futures::spawn_local;
 
 #[component]
 pub fn Popup() -> impl IntoView {
+    // Prompt signals and and action
     let prompt_input_ref = NodeRef::<Input>::new();
     let (prompt_text, set_prompt_text) = signal(String::new());
     let (prompt_result, set_prompt_result) = signal(String::new());
-
+    // Action that calls the promp daemon
     let prompt_action = Action::new_local(|prompt: &String| {
         let prompt = prompt.clone();
         async move {
@@ -20,13 +22,13 @@ pub fn Popup() -> impl IntoView {
             result
         }
     });
-
+    // Update the model response div with the prompt result
     Effect::new(move |_| {
         if let Some(result) = prompt_action.value().get() {
             set_prompt_result.set(result)
         }
     });
-
+    // Clear the propt text-input when the window loses focus (and is hidden)
     Effect::new(move |_| {
         let Some(input_el) = prompt_input_ref.get() else {
             return;
@@ -42,6 +44,14 @@ pub fn Popup() -> impl IntoView {
 
         handle_focus.forget();
     });
+    // Hide the popup when ESC is pressed
+    let _ = window_event_listener(keydown, move |ev| {
+        if ev.key() == "Escape" {
+            spawn_local(async move {
+                let _ = invoke("toggle_popup", JsValue::UNDEFINED).await;
+            });
+        }
+    });
 
     view! {
         <main class="window-shell rounded-container">