feedback_modal.rs

  1use std::{ops::RangeInclusive, sync::Arc, time::Duration};
  2
  3use anyhow::{anyhow, bail};
  4use bitflags::bitflags;
  5use client::{Client, ZED_SECRET_CLIENT_TOKEN, ZED_SERVER_URL};
  6use db::kvp::KEY_VALUE_STORE;
  7use editor::{Editor, EditorEvent};
  8use futures::AsyncReadExt;
  9use gpui::{
 10    div, red, rems, serde_json, AppContext, DismissEvent, Div, EventEmitter, FocusHandle,
 11    FocusableView, Model, PromptLevel, Render, Task, View, ViewContext,
 12};
 13use isahc::Request;
 14use language::Buffer;
 15use project::Project;
 16use regex::Regex;
 17use serde_derive::Serialize;
 18use ui::{prelude::*, Button, ButtonStyle, IconPosition, Tooltip};
 19use util::ResultExt;
 20use workspace::{ModalView, Workspace};
 21
 22use crate::{system_specs::SystemSpecs, GiveFeedback, OpenZedCommunityRepo};
 23
 24// For UI testing purposes
 25const SEND_SUCCESS_IN_DEV_MODE: bool = true;
 26const SEND_TIME_IN_DEV_MODE: Duration = Duration::from_secs(2);
 27
 28// Temporary, until tests are in place
 29#[cfg(debug_assertions)]
 30const DEV_MODE: bool = true;
 31
 32#[cfg(not(debug_assertions))]
 33const DEV_MODE: bool = false;
 34
 35const DATABASE_KEY_NAME: &str = "email_address";
 36const EMAIL_REGEX: &str = r"\b[A-Za-z0-9._%+-]+@[A-Za-z0-9.-]+\.[A-Z|a-z]{2,}\b";
 37const FEEDBACK_CHAR_LIMIT: RangeInclusive<i32> = 10..=5000;
 38const FEEDBACK_SUBMISSION_ERROR_TEXT: &str =
 39    "Feedback failed to submit, see error log for details.";
 40
 41#[derive(Serialize)]
 42struct FeedbackRequestBody<'a> {
 43    feedback_text: &'a str,
 44    email: Option<String>,
 45    metrics_id: Option<Arc<str>>,
 46    installation_id: Option<Arc<str>>,
 47    system_specs: SystemSpecs,
 48    is_staff: bool,
 49    token: &'a str,
 50}
 51
 52bitflags! {
 53    #[derive(Debug, Clone, PartialEq)]
 54    struct InvalidStateFlags: u8 {
 55        const EmailAddress = 0b00000001;
 56        const CharacterCount = 0b00000010;
 57    }
 58}
 59
 60#[derive(Debug, Clone, PartialEq)]
 61enum CannotSubmitReason {
 62    InvalidState { flags: InvalidStateFlags },
 63    AwaitingSubmission,
 64}
 65
 66#[derive(Debug, Clone, PartialEq)]
 67enum SubmissionState {
 68    CanSubmit,
 69    CannotSubmit { reason: CannotSubmitReason },
 70}
 71
 72pub struct FeedbackModal {
 73    system_specs: SystemSpecs,
 74    feedback_editor: View<Editor>,
 75    email_address_editor: View<Editor>,
 76    submission_state: Option<SubmissionState>,
 77    dismiss_modal: bool,
 78    character_count: i32,
 79}
 80
 81impl FocusableView for FeedbackModal {
 82    fn focus_handle(&self, cx: &AppContext) -> FocusHandle {
 83        self.feedback_editor.focus_handle(cx)
 84    }
 85}
 86impl EventEmitter<DismissEvent> for FeedbackModal {}
 87
 88impl ModalView for FeedbackModal {
 89    fn on_before_dismiss(&mut self, cx: &mut ViewContext<Self>) -> bool {
 90        self.update_email_in_store(cx);
 91
 92        if self.dismiss_modal {
 93            return true;
 94        }
 95
 96        let has_feedback = self.feedback_editor.read(cx).text_option(cx).is_some();
 97        if !has_feedback {
 98            return true;
 99        }
100
101        let answer = cx.prompt(PromptLevel::Info, "Discard feedback?", &["Yes", "No"]);
102
103        cx.spawn(move |this, mut cx| async move {
104            if answer.await.ok() == Some(0) {
105                this.update(&mut cx, |this, cx| {
106                    this.dismiss_modal = true;
107                    cx.emit(DismissEvent)
108                })
109                .log_err();
110            }
111        })
112        .detach();
113
114        false
115    }
116}
117
118impl FeedbackModal {
119    pub fn register(workspace: &mut Workspace, cx: &mut ViewContext<Workspace>) {
120        let _handle = cx.view().downgrade();
121        workspace.register_action(move |workspace, _: &GiveFeedback, cx| {
122            let markdown = workspace
123                .app_state()
124                .languages
125                .language_for_name("Markdown");
126
127            let project = workspace.project().clone();
128
129            cx.spawn(|workspace, mut cx| async move {
130                let markdown = markdown.await.log_err();
131                let buffer = project
132                    .update(&mut cx, |project, cx| {
133                        project.create_buffer("", markdown, cx)
134                    })?
135                    .expect("creating buffers on a local workspace always succeeds");
136
137                workspace.update(&mut cx, |workspace, cx| {
138                    let system_specs = SystemSpecs::new(cx);
139
140                    workspace.toggle_modal(cx, move |cx| {
141                        FeedbackModal::new(system_specs, project, buffer, cx)
142                    });
143                })?;
144
145                anyhow::Ok(())
146            })
147            .detach_and_log_err(cx);
148        });
149    }
150
151    pub fn new(
152        system_specs: SystemSpecs,
153        project: Model<Project>,
154        buffer: Model<Buffer>,
155        cx: &mut ViewContext<Self>,
156    ) -> Self {
157        let email_address_editor = cx.build_view(|cx| {
158            let mut editor = Editor::single_line(cx);
159            editor.set_placeholder_text("Email address (optional)", cx);
160
161            if let Ok(Some(email_address)) = KEY_VALUE_STORE.read_kvp(DATABASE_KEY_NAME) {
162                editor.set_text(email_address, cx)
163            }
164
165            editor
166        });
167
168        // Moved here because providing it inline breaks rustfmt
169        let placeholder_text =
170            "You can use markdown to organize your feedback with code and links.";
171
172        let feedback_editor = cx.build_view(|cx| {
173            let mut editor = Editor::for_buffer(buffer, Some(project.clone()), cx);
174            editor.set_placeholder_text(placeholder_text, cx);
175            // editor.set_show_gutter(false, cx);
176            editor.set_vertical_scroll_margin(5, cx);
177            editor
178        });
179
180        cx.subscribe(&feedback_editor, |this, editor, event: &EditorEvent, cx| {
181            if *event == EditorEvent::Edited {
182                this.character_count = editor
183                    .read(cx)
184                    .buffer()
185                    .read(cx)
186                    .as_singleton()
187                    .expect("Feedback editor is never a multi-buffer")
188                    .read(cx)
189                    .len() as i32;
190                cx.notify();
191            }
192        })
193        .detach();
194
195        Self {
196            system_specs: system_specs.clone(),
197            feedback_editor,
198            email_address_editor,
199            submission_state: None,
200            dismiss_modal: false,
201            character_count: 0,
202        }
203    }
204
205    pub fn submit(&mut self, cx: &mut ViewContext<Self>) -> Task<anyhow::Result<()>> {
206        let feedback_text = self.feedback_editor.read(cx).text(cx).trim().to_string();
207        let email = self.email_address_editor.read(cx).text_option(cx);
208
209        let answer = cx.prompt(
210            PromptLevel::Info,
211            "Ready to submit your feedback?",
212            &["Yes, Submit!", "No"],
213        );
214        let client = cx.global::<Arc<Client>>().clone();
215        let specs = self.system_specs.clone();
216        cx.spawn(|this, mut cx| async move {
217            let answer = answer.await.ok();
218            if answer == Some(0) {
219                this.update(&mut cx, |this, cx| {
220                    this.submission_state = Some(SubmissionState::CannotSubmit {
221                        reason: CannotSubmitReason::AwaitingSubmission,
222                    });
223                    cx.notify();
224                })
225                .log_err();
226
227                let res =
228                    FeedbackModal::submit_feedback(&feedback_text, email, client, specs).await;
229
230                match res {
231                    Ok(_) => {
232                        this.update(&mut cx, |this, cx| {
233                            this.dismiss_modal = true;
234                            cx.notify();
235                            cx.emit(DismissEvent)
236                        })
237                        .ok();
238                    }
239                    Err(error) => {
240                        log::error!("{}", error);
241                        this.update(&mut cx, |this, cx| {
242                            let prompt = cx.prompt(
243                                PromptLevel::Critical,
244                                FEEDBACK_SUBMISSION_ERROR_TEXT,
245                                &["OK"],
246                            );
247                            cx.spawn(|_, _cx| async move {
248                                prompt.await.ok();
249                            })
250                            .detach();
251
252                            this.submission_state = Some(SubmissionState::CanSubmit);
253                            cx.notify();
254                        })
255                        .log_err();
256                    }
257                }
258            }
259        })
260        .detach();
261
262        Task::ready(Ok(()))
263    }
264
265    async fn submit_feedback(
266        feedback_text: &str,
267        email: Option<String>,
268        zed_client: Arc<Client>,
269        system_specs: SystemSpecs,
270    ) -> anyhow::Result<()> {
271        if DEV_MODE {
272            smol::Timer::after(SEND_TIME_IN_DEV_MODE).await;
273
274            if SEND_SUCCESS_IN_DEV_MODE {
275                return Ok(());
276            } else {
277                return Err(anyhow!("Error submitting feedback"));
278            }
279        }
280
281        let feedback_endpoint = format!("{}/api/feedback", *ZED_SERVER_URL);
282        let telemetry = zed_client.telemetry();
283        let metrics_id = telemetry.metrics_id();
284        let installation_id = telemetry.installation_id();
285        let is_staff = telemetry.is_staff();
286        let http_client = zed_client.http_client();
287        let request = FeedbackRequestBody {
288            feedback_text: &feedback_text,
289            email,
290            metrics_id,
291            installation_id,
292            system_specs,
293            is_staff: is_staff.unwrap_or(false),
294            token: ZED_SECRET_CLIENT_TOKEN,
295        };
296        let json_bytes = serde_json::to_vec(&request)?;
297        let request = Request::post(feedback_endpoint)
298            .header("content-type", "application/json")
299            .body(json_bytes.into())?;
300        let mut response = http_client.send(request).await?;
301        let mut body = String::new();
302        response.body_mut().read_to_string(&mut body).await?;
303        let response_status = response.status();
304        if !response_status.is_success() {
305            bail!("Feedback API failed with error: {}", response_status)
306        }
307        Ok(())
308    }
309
310    fn update_submission_state(&mut self, cx: &mut ViewContext<Self>) {
311        if self.awaiting_submission() {
312            return;
313        }
314
315        let mut invalid_state_flags = InvalidStateFlags::empty();
316
317        let valid_email_address = match self.email_address_editor.read(cx).text_option(cx) {
318            Some(email_address) => Regex::new(EMAIL_REGEX).unwrap().is_match(&email_address),
319            None => true,
320        };
321
322        if !valid_email_address {
323            invalid_state_flags |= InvalidStateFlags::EmailAddress;
324        }
325
326        if !FEEDBACK_CHAR_LIMIT.contains(&self.character_count) {
327            invalid_state_flags |= InvalidStateFlags::CharacterCount;
328        }
329
330        if invalid_state_flags.is_empty() {
331            self.submission_state = Some(SubmissionState::CanSubmit);
332        } else {
333            self.submission_state = Some(SubmissionState::CannotSubmit {
334                reason: CannotSubmitReason::InvalidState {
335                    flags: invalid_state_flags,
336                },
337            });
338        }
339    }
340
341    fn update_email_in_store(&self, cx: &mut ViewContext<Self>) {
342        let email = self.email_address_editor.read(cx).text_option(cx);
343
344        cx.spawn(|_, _| async move {
345            match email {
346                Some(email) => {
347                    KEY_VALUE_STORE
348                        .write_kvp(DATABASE_KEY_NAME.to_string(), email)
349                        .await
350                        .ok();
351                }
352                None => {
353                    KEY_VALUE_STORE
354                        .delete_kvp(DATABASE_KEY_NAME.to_string())
355                        .await
356                        .ok();
357                }
358            }
359        })
360        .detach();
361    }
362
363    fn valid_email_address(&self) -> bool {
364        !self.in_invalid_state(InvalidStateFlags::EmailAddress)
365    }
366
367    fn valid_character_count(&self) -> bool {
368        !self.in_invalid_state(InvalidStateFlags::CharacterCount)
369    }
370
371    fn in_invalid_state(&self, flag: InvalidStateFlags) -> bool {
372        match self.submission_state {
373            Some(SubmissionState::CannotSubmit {
374                reason: CannotSubmitReason::InvalidState { ref flags },
375            }) => flags.contains(flag),
376            _ => false,
377        }
378    }
379
380    fn awaiting_submission(&self) -> bool {
381        matches!(
382            self.submission_state,
383            Some(SubmissionState::CannotSubmit {
384                reason: CannotSubmitReason::AwaitingSubmission
385            })
386        )
387    }
388
389    fn can_submit(&self) -> bool {
390        matches!(self.submission_state, Some(SubmissionState::CanSubmit))
391    }
392
393    fn cancel(&mut self, _: &menu::Cancel, cx: &mut ViewContext<Self>) {
394        cx.emit(DismissEvent)
395    }
396}
397
398impl Render for FeedbackModal {
399    type Element = Div;
400
401    fn render(&mut self, cx: &mut ViewContext<Self>) -> Self::Element {
402        self.update_submission_state(cx);
403
404        let submit_button_text = if self.awaiting_submission() {
405            "Submitting..."
406        } else {
407            "Submit"
408        };
409
410        let open_community_repo =
411            cx.listener(|_, _, cx| cx.dispatch_action(Box::new(OpenZedCommunityRepo)));
412
413        // Moved this here because providing it inline breaks rustfmt
414        let provide_an_email_address =
415            "Provide an email address if you want us to be able to reply.";
416
417        v_stack()
418            .elevation_3(cx)
419            .key_context("GiveFeedback")
420            .on_action(cx.listener(Self::cancel))
421            .min_w(rems(40.))
422            .max_w(rems(96.))
423            .h(rems(32.))
424            .p_4()
425            .gap_4()
426            .child(v_stack().child(
427                // TODO: Add Headline component to `ui2`
428                div().text_xl().child("Share Feedback"),
429            ))
430            .child(
431                Label::new(if self.character_count < *FEEDBACK_CHAR_LIMIT.start() {
432                    format!(
433                        "Feedback must be at least {} characters.",
434                        FEEDBACK_CHAR_LIMIT.start()
435                    )
436                } else {
437                    format!(
438                        "Characters: {}",
439                        *FEEDBACK_CHAR_LIMIT.end() - self.character_count
440                    )
441                })
442                .color(if self.valid_character_count() {
443                    Color::Success
444                } else {
445                    Color::Error
446                }),
447            )
448            .child(
449                div()
450                    .flex_1()
451                    .bg(cx.theme().colors().editor_background)
452                    .p_2()
453                    .border()
454                    .rounded_md()
455                    .border_color(cx.theme().colors().border)
456                    .child(self.feedback_editor.clone()),
457            )
458            .child(
459                h_stack()
460                    .bg(cx.theme().colors().editor_background)
461                    .p_2()
462                    .border()
463                    .rounded_md()
464                    .border_color(if self.valid_email_address() {
465                        cx.theme().colors().border
466                    } else {
467                        red()
468                    })
469                    .child(self.email_address_editor.clone()),
470            )
471            .child(
472                h_stack()
473                    .justify_between()
474                    .gap_1()
475                    .child(
476                        Button::new("community_repository", "Community Repository")
477                            .style(ButtonStyle::Transparent)
478                            .icon(Icon::ExternalLink)
479                            .icon_position(IconPosition::End)
480                            .icon_size(IconSize::Small)
481                            .on_click(open_community_repo),
482                    )
483                    .child(
484                        h_stack()
485                            .gap_1()
486                            .child(
487                                Button::new("cancel_feedback", "Cancel")
488                                    .style(ButtonStyle::Subtle)
489                                    .color(Color::Muted)
490                                    .on_click(cx.listener(move |_, _, cx| {
491                                        cx.spawn(|this, mut cx| async move {
492                                            this.update(&mut cx, |_, cx| cx.emit(DismissEvent))
493                                                .ok();
494                                        })
495                                        .detach();
496                                    })),
497                            )
498                            .child(
499                                Button::new("submit_feedback", submit_button_text)
500                                    .color(Color::Accent)
501                                    .style(ButtonStyle::Filled)
502                                    .on_click(cx.listener(|this, _, cx| {
503                                        this.submit(cx).detach();
504                                    }))
505                                    .tooltip(move |cx| {
506                                        Tooltip::with_meta(
507                                            "Submit feedback to the Zed team.",
508                                            None,
509                                            provide_an_email_address,
510                                            cx,
511                                        )
512                                    })
513                                    .when(!self.can_submit(), |this| this.disabled(true)),
514                            ),
515                    ),
516            )
517    }
518}
519
520// TODO: Testing of various button states, dismissal prompts, etc.
521
522// #[cfg(test)]
523// mod test {
524//     use super::*;
525
526//     #[test]
527//     fn test_invalid_email_addresses() {
528//         let markdown = markdown.await.log_err();
529//         let buffer = project.update(&mut cx, |project, cx| {
530//             project.create_buffer("", markdown, cx)
531//         })??;
532
533//         workspace.update(&mut cx, |workspace, cx| {
534//             let system_specs = SystemSpecs::new(cx);
535
536//             workspace.toggle_modal(cx, move |cx| {
537//                 let feedback_modal = FeedbackModal::new(system_specs, project, buffer, cx);
538
539//                 assert!(!feedback_modal.can_submit());
540//                 assert!(!feedback_modal.valid_email_address(cx));
541//                 assert!(!feedback_modal.valid_character_count());
542
543//                 feedback_modal
544//                     .email_address_editor
545//                     .update(cx, |this, cx| this.set_text("a", cx));
546//                 feedback_modal.set_submission_state(cx);
547
548//                 assert!(!feedback_modal.valid_email_address(cx));
549
550//                 feedback_modal
551//                     .email_address_editor
552//                     .update(cx, |this, cx| this.set_text("a&b.com", cx));
553//                 feedback_modal.set_submission_state(cx);
554
555//                 assert!(feedback_modal.valid_email_address(cx));
556//             });
557//         })?;
558//     }
559// }