feat: message composer

1 files changed, 40 insertions, 18 deletions

diff --git a/src/lib.rs b/src/lib.rs
index 52d64e4..a05f511 100644
--- a/src/lib.rs
+++ b/src/lib.rs
@@ -18,7 +18,7 @@ use futures::stream::StreamExt;
 use indexmap::IndexMap;
 use jid::JID;
 use leptos::{
-    html::{self, Div, Input, Textarea}, prelude::*, tachys::dom::document, task::{spawn, spawn_local}
+    ev::{Event, KeyboardEvent, SubmitEvent}, html::{self, Div, Input, Pre, Textarea}, prelude::*, tachys::{dom::document, reactive_graph::bind::GetValue}, task::{spawn, spawn_local}
 };
 use leptos_meta::Stylesheet;
 use leptos_use::{use_textarea_autosize, UseTextareaAutosizeReturn};
@@ -570,18 +570,18 @@ pub fn ChatViewMessageComposer(chat: JID) -> impl IntoView {
     let new_message = RwSignal::new("".to_string());
     let client: Client = use_context().expect("no client in context");
     let client = RwSignal::new(client);
+    let (shift_pressed, set_shift_pressed) = signal(false);
 
-    let send_message = Action::new(move |_| {
+    let send_message = move || {
         let value = chat.clone();
-        async move {
-            spawn_local(async move { match client.read_untracked().send_message(value, Body { body: new_message.get_untracked() }).await {
-                Ok(_) => {
-                    new_message.set("".to_string());
-                },
-                Err(e) => tracing::error!("message send error: {}", e),
-            }})
-        }
-    });
+        spawn_local(async move { match client.read_untracked().send_message(value, Body { body: new_message.get_untracked() }).await {
+            Ok(_) => {
+                new_message.set("".to_string());
+                message_input.write_untracked().as_ref().expect("message input div not mounted").set_text_content(Some(""));
+            },
+            Err(e) => tracing::error!("message send error: {}", e),
+        }})
+    };
 
     let _focus = Effect::new(move |_| {
         if let Some(input) = message_input.get() {
@@ -592,23 +592,45 @@ pub fn ChatViewMessageComposer(chat: JID) -> impl IntoView {
         }
     });
 
+    // let on_input = move |ev: Event| {
+    //     // let keyboard_event: KeyboardEvent = ev.try_into().unwrap();
+    //     debug!("got input event");
+    //     let key= event_target_value(&ev);
+    //     new_message.set(key);
+    //     debug!("set new message");
+    // };
+    //
+
     // TODO: placeholder
     view! {
         <form
             class="new-message-composer panel"
-            on:submit=move |ev| {
-                ev.prevent_default();
-                send_message.dispatch(());
-            }
         >
             <div
                 class="text-box"
-                prop:value=new_message
-                on:input=move |ev| new_message.set(event_target_value(&ev))
+                on:input:target=move |ev| new_message.set(ev.target().text_content().unwrap_or_default())
                 node_ref=message_input
                 contenteditable
+                on:keydown=move |ev| {
+                    match ev.key_code() {
+                        16 => set_shift_pressed.set(true),
+                        13 => if !shift_pressed.get_untracked() {
+                            ev.prevent_default();
+                            send_message();
+                        }
+                        _ => {}
+                        // debug!("shift pressed down");
+                    }
+                }
+                on:keyup=move |ev| {
+                    match ev.key_code()  {
+                        16 => set_shift_pressed.set(false),
+                        _ => {}
+                        // debug!("shift released");
+                    }
+                }
             ></div>
-            <input hidden type="submit" />
+            // <input hidden type="submit" />
         </form>
     }
 }