onboarding: Add explainer tooltips for the editing and AI section (#35619)

Includes the ability to add a tooltip for both the badge and switch
field components.

Release Notes:

- N/A

crates/onboarding/src/ai_setup_page.rs

@@ -11,7 +11,7 @@ use project::DisableAiSettings;
 use settings::{Settings, update_settings_file};
 use ui::{
     Badge, ButtonLike, Divider, Modal, ModalFooter, ModalHeader, Section, SwitchField, ToggleState,
-    prelude::*,
+    prelude::*, tooltip_container,
 };
 use util::ResultExt;
 use workspace::ModalView;
@@ -41,7 +41,11 @@ fn render_llm_provider_section(
 }
 
 fn render_privacy_card(disabled: bool, cx: &mut App) -> impl IntoElement {
-    let privacy_badge = || Badge::new("Privacy").icon(IconName::ShieldCheck);
+    let privacy_badge = || {
+        Badge::new("Privacy")
+            .icon(IconName::ShieldCheck)
+            .tooltip(move |_, cx| cx.new(|_| AiPrivacyTooltip::new()).into())
+    };
 
     v_flex()
         .relative()
@@ -355,3 +359,37 @@ impl Render for AiConfigurationModal {
             )
     }
 }
+
+pub struct AiPrivacyTooltip {}
+
+impl AiPrivacyTooltip {
+    pub fn new() -> Self {
+        Self {}
+    }
+}
+
+impl Render for AiPrivacyTooltip {
+    fn render(&mut self, window: &mut Window, cx: &mut Context<Self>) -> impl IntoElement {
+        const DESCRIPTION: &'static str = "One of Zed's most important principles is transparency. This is why we are and value open-source so much. And it wouldn't be any different with AI.";
+
+        tooltip_container(window, cx, move |this, _, _| {
+            this.child(
+                h_flex()
+                    .gap_1()
+                    .child(
+                        Icon::new(IconName::ShieldCheck)
+                            .size(IconSize::Small)
+                            .color(Color::Muted),
+                    )
+                    .child(Label::new("Privacy Principle")),
+            )
+            .child(
+                div().max_w_64().child(
+                    Label::new(DESCRIPTION)
+                        .size(LabelSize::Small)
+                        .color(Color::Muted),
+                ),
+            )
+        })
+    }
+}

crates/onboarding/src/editing_page.rs

@@ -9,7 +9,7 @@ use settings::{Settings as _, update_settings_file};
 use theme::{FontFamilyCache, FontFamilyName, ThemeSettings};
 use ui::{
     ButtonLike, ContextMenu, DropdownMenu, NumericStepper, SwitchField, ToggleButtonGroup,
-    ToggleButtonGroupStyle, ToggleButtonSimple, ToggleState, prelude::*,
+    ToggleButtonGroupStyle, ToggleButtonSimple, ToggleState, Tooltip, prelude::*,
 };
 
 use crate::{ImportCursorSettings, ImportVsCodeSettings};
@@ -357,23 +357,28 @@ fn render_font_customization_section(window: &mut Window, cx: &mut App) -> impl
 }
 
 fn render_popular_settings_section(window: &mut Window, cx: &mut App) -> impl IntoElement {
+    const LIGATURE_TOOLTIP: &'static str = "Ligatures are when a font creates a special character out of combining two characters into one. For example, with ligatures turned on, =/= would become ≠.";
+
     v_flex()
         .gap_5()
         .child(Label::new("Popular Settings").size(LabelSize::Large).mt_8())
         .child(render_font_customization_section(window, cx))
-        .child(SwitchField::new(
-            "onboarding-font-ligatures",
-            "Font Ligatures",
-            Some("Combine text characters into their associated symbols.".into()),
-            if read_font_ligatures(cx) {
-                ui::ToggleState::Selected
-            } else {
-                ui::ToggleState::Unselected
-            },
-            |toggle_state, _, cx| {
-                write_font_ligatures(toggle_state == &ToggleState::Selected, cx);
-            },
-        ))
+        .child(
+            SwitchField::new(
+                "onboarding-font-ligatures",
+                "Font Ligatures",
+                Some("Combine text characters into their associated symbols.".into()),
+                if read_font_ligatures(cx) {
+                    ui::ToggleState::Selected
+                } else {
+                    ui::ToggleState::Unselected
+                },
+                |toggle_state, _, cx| {
+                    write_font_ligatures(toggle_state == &ToggleState::Selected, cx);
+                },
+            )
+            .tooltip(Tooltip::text(LIGATURE_TOOLTIP)),
+        )
         .child(SwitchField::new(
             "onboarding-format-on-save",
             "Format on Save",
@@ -387,6 +392,32 @@ fn render_popular_settings_section(window: &mut Window, cx: &mut App) -> impl In
                 write_format_on_save(toggle_state == &ToggleState::Selected, cx);
             },
         ))
+        .child(SwitchField::new(
+            "onboarding-enable-inlay-hints",
+            "Inlay Hints",
+            Some("See parameter names for function and method calls inline.".into()),
+            if read_inlay_hints(cx) {
+                ui::ToggleState::Selected
+            } else {
+                ui::ToggleState::Unselected
+            },
+            |toggle_state, _, cx| {
+                write_inlay_hints(toggle_state == &ToggleState::Selected, cx);
+            },
+        ))
+        .child(SwitchField::new(
+            "onboarding-git-blame-switch",
+            "Git Blame",
+            Some("See who committed each line on a given file.".into()),
+            if read_git_blame(cx) {
+                ui::ToggleState::Selected
+            } else {
+                ui::ToggleState::Unselected
+            },
+            |toggle_state, _, cx| {
+                set_git_blame(toggle_state == &ToggleState::Selected, cx);
+            },
+        ))
         .child(
             h_flex()
                 .items_start()
@@ -421,32 +452,6 @@ fn render_popular_settings_section(window: &mut Window, cx: &mut App) -> impl In
                     .button_width(ui::rems_from_px(64.)),
                 ),
         )
-        .child(SwitchField::new(
-            "onboarding-enable-inlay-hints",
-            "Inlay Hints",
-            Some("See parameter names for function and method calls inline.".into()),
-            if read_inlay_hints(cx) {
-                ui::ToggleState::Selected
-            } else {
-                ui::ToggleState::Unselected
-            },
-            |toggle_state, _, cx| {
-                write_inlay_hints(toggle_state == &ToggleState::Selected, cx);
-            },
-        ))
-        .child(SwitchField::new(
-            "onboarding-git-blame-switch",
-            "Git Blame",
-            Some("See who committed each line on a given file.".into()),
-            if read_git_blame(cx) {
-                ui::ToggleState::Selected
-            } else {
-                ui::ToggleState::Unselected
-            },
-            |toggle_state, _, cx| {
-                set_git_blame(toggle_state == &ToggleState::Selected, cx);
-            },
-        ))
 }
 
 pub(crate) fn render_editing_page(window: &mut Window, cx: &mut App) -> impl IntoElement {