add speech component

crates/chat_ui/Cargo.toml

@@ -7,7 +7,7 @@ publish.workspace = true
 [dependencies]
 state = { path = "../state" }
 ui = { path = "../ui" }
-gpui-kit.workspace = true
+gpui-kit = { workspace = true, features = ["speech"] }
 common = { path = "../common" }
 person = { path = "../person" }
 chat = { path = "../chat" }

crates/chat_ui/src/lib.rs

@@ -20,6 +20,7 @@ use gpui_kit::component::input::{Input, InputEvent, InputState, Textarea, Textar
 use gpui_kit::component::menu::DropdownMenu;
 use gpui_kit::component::notification::Notification;
 use gpui_kit::component::scroll::Scrollbar;
+use gpui_kit::component::speech::{SpeechButton, SpeechEvent, SpeechState, SpeechWaveform};
 use gpui_kit::component::tooltip::Tooltip;
 use gpui_kit::component::{ActiveTheme, Disableable, Icon, Sizable, WindowExt, h_flex, v_flex};
 use itertools::Itertools;
@@ -91,6 +92,9 @@ pub struct ChatPanel {
     /// Chat input state
     input: Entity<TextareaState>,
 
+    /// Dictation session for the chat input
+    speech: Entity<SpeechState>,
+
     /// Subject input state
     subject_input: Entity<InputState>,
 
@@ -116,7 +120,7 @@ pub struct ChatPanel {
     tasks: Vec<Task<Result<(), Error>>>,
 
     /// Event subscriptions
-    subscriptions: SmallVec<[Subscription; 3]>,
+    subscriptions: SmallVec<[Subscription; 4]>,
 }
 
 impl ChatPanel {
@@ -160,6 +164,9 @@ impl ChatPanel {
                 .clean_on_escape()
         });
 
+        // Define dictation state
+        let speech = cx.new(SpeechState::new);
+
         // Define subject input state
         let subject_input = cx.new(|cx| InputState::new(window, cx).placeholder("New subject..."));
         let subject_bar = cx.new(|_cx| false);
@@ -178,15 +185,28 @@ impl ChatPanel {
 
         subscriptions.push(
             // Subscribe the subject input event
-            cx.subscribe_in(
-                &subject_input,
-                window,
-                move |this, _input, event, window, cx| {
-                    if let InputEvent::PressEnter { .. } = event {
-                        this.change_subject(window, cx);
-                    };
-                },
-            ),
+            cx.subscribe_in(&subject_input, window, move |this, _, event, window, cx| {
+                if let InputEvent::PressEnter { .. } = event {
+                    this.change_subject(window, cx);
+                };
+            }),
+        );
+
+        subscriptions.push(
+            // Insert the dictated text into the chat input
+            cx.subscribe_in(&speech, window, move |this, _speech, event, window, cx| {
+                match event {
+                    SpeechEvent::Final(text) if !text.is_empty() => {
+                        this.input.update(cx, |input, cx| {
+                            input.insert(text.clone(), window, cx);
+                        });
+                    }
+                    SpeechEvent::Error(error) => {
+                        window.push_notification(Notification::error(error.to_string()), cx);
+                    }
+                    _ => {}
+                };
+            }),
         );
 
         // Define all functions that will run after the current cycle
@@ -206,6 +226,7 @@ impl ChatPanel {
             directory,
             list_state,
             input,
+            speech,
             subject_input,
             subject_bar,
             replies_to,
@@ -1807,6 +1828,7 @@ impl Render for ChatPanel {
 
         let is_typing = !self.input.read(cx).value().trim().is_empty();
         let pending_attachments = !self.encrypted_attachments.read(cx).is_empty();
+        let capturing = self.speech.read(cx).status().is_capturing();
 
         v_flex()
             .image_cache(retain_all(self.id.clone()))
@@ -1901,6 +1923,18 @@ impl Render for ChatPanel {
                                     .py_1()
                                     .flex_1(),
                             )
+                            .child(
+                                h_flex()
+                                    .items_end()
+                                    .gap_1()
+                                    .pl_1()
+                                    .when(capturing, |this| {
+                                        this.child(
+                                            SpeechWaveform::new(&self.speech).xsmall().w_12(),
+                                        )
+                                    })
+                                    .child(SpeechButton::new(&self.speech)),
+                            )
                             .child(
                                 h_flex()
                                     .pl_1()

crates/nip29_ui/Cargo.toml

@@ -12,7 +12,7 @@ nip29 = { path = "../nip29" }
 person = { path = "../person" }
 settings = { path = "../settings" }
 state = { path = "../state" }
-gpui-kit.workspace = true
+gpui-kit = { workspace = true, features = ["speech"] }
 ui = { path = "../ui" }
 
 gpui.workspace = true

crates/nip29_ui/src/lib.rs

@@ -15,6 +15,7 @@ use gpui_kit::component::dock::{Panel, PanelEvent};
 use gpui_kit::component::input::{InputEvent, Textarea, TextareaState};
 use gpui_kit::component::notification::Notification;
 use gpui_kit::component::scroll::Scrollbar;
+use gpui_kit::component::speech::{SpeechButton, SpeechEvent, SpeechState, SpeechWaveform};
 use gpui_kit::component::{ActiveTheme, Disableable, Icon, Sizable, WindowExt, h_flex, v_flex};
 use nip29::{Group, GroupEvent, GroupKey, GroupsRegistry, Membership, Pin, Row};
 use nostr_sdk::prelude::*;
@@ -312,6 +313,8 @@ pub struct GroupPanel {
     reply_to: Option<EventId>,
     rendered_texts_by_id: BTreeMap<EventId, RenderedText>,
     input: Entity<TextareaState>,
+    /// Dictation session for the composer input
+    speech: Entity<SpeechState>,
     /// Uploaded, non-encrypted attachments waiting to be sent.
     attachments: Vec<Url>,
     /// Whether an upload is in flight.
@@ -319,7 +322,7 @@ pub struct GroupPanel {
     /// Whether the user closed the encryption notice this visit
     notice_dismissed: bool,
     tasks: SmallVec<[Task<Result<()>>; 4]>,
-    _subscriptions: SmallVec<[Subscription; 3]>,
+    _subscriptions: SmallVec<[Subscription; 4]>,
 }
 
 impl GroupPanel {
@@ -338,6 +341,8 @@ impl GroupPanel {
                 .clean_on_escape()
         });
 
+        let speech = cx.new(SpeechState::new);
+
         let mut subscriptions = smallvec![];
 
         subscriptions.push(
@@ -348,6 +353,22 @@ impl GroupPanel {
             }),
         );
 
+        subscriptions.push(
+            cx.subscribe_in(&speech, window, |this, _, event, window, cx| {
+                match event {
+                    SpeechEvent::Final(text) if !text.is_empty() => {
+                        this.input.update(cx, |input, cx| {
+                            input.insert(text.clone(), window, cx);
+                        });
+                    }
+                    SpeechEvent::Error(error) => {
+                        window.push_notification(Notification::error(error.to_string()), cx);
+                    }
+                    _ => {}
+                };
+            }),
+        );
+
         subscriptions.push(cx.subscribe(&group, |this, _group, event, cx| {
             if !matches!(event, GroupEvent::Sent(_)) {
                 this.sync(cx);
@@ -383,6 +404,7 @@ impl GroupPanel {
             notice_dismissed: false,
             rendered_texts_by_id: BTreeMap::new(),
             input,
+            speech,
             attachments: Vec::new(),
             uploading: false,
             tasks: smallvec![],
@@ -1073,6 +1095,10 @@ impl GroupPanel {
                             .py_1()
                             .flex_1(),
                     )
+                    .when(self.speech.read(cx).status().is_capturing(), |this| {
+                        this.child(SpeechWaveform::new(&self.speech).xsmall().w_12())
+                    })
+                    .child(SpeechButton::new(&self.speech))
                     .child(
                         Button::new("send")
                             .icon(ui::IconName::PaperPlaneFill)