1use std::sync::Arc;
2
3use client::TelemetrySettings;
4use fs::Fs;
5use gpui::{App, IntoElement};
6use settings::{BaseKeymap, Settings, update_settings_file};
7use theme::{
8 Appearance, SystemAppearance, ThemeMode, ThemeName, ThemeRegistry, ThemeSelection,
9 ThemeSettings,
10};
11use ui::{
12 ParentElement as _, StatefulInteractiveElement, SwitchField, ToggleButtonGroup,
13 ToggleButtonSimple, ToggleButtonWithIcon, prelude::*, rems_from_px,
14};
15use vim_mode_setting::VimModeSetting;
16
17use crate::theme_preview::{ThemePreviewStyle, ThemePreviewTile};
18
19fn render_theme_section(tab_index: &mut isize, cx: &mut App) -> impl IntoElement {
20 let theme_selection = ThemeSettings::get_global(cx).theme_selection.clone();
21 let system_appearance = theme::SystemAppearance::global(cx);
22 let theme_selection = theme_selection.unwrap_or_else(|| ThemeSelection::Dynamic {
23 mode: match *system_appearance {
24 Appearance::Light => ThemeMode::Light,
25 Appearance::Dark => ThemeMode::Dark,
26 },
27 light: ThemeName("One Light".into()),
28 dark: ThemeName("One Dark".into()),
29 });
30
31 let theme_mode = theme_selection
32 .mode()
33 .unwrap_or_else(|| match *system_appearance {
34 Appearance::Light => ThemeMode::Light,
35 Appearance::Dark => ThemeMode::Dark,
36 });
37
38 return v_flex()
39 .gap_2()
40 .child(
41 h_flex().justify_between().child(Label::new("Theme")).child(
42 ToggleButtonGroup::single_row(
43 "theme-selector-onboarding-dark-light",
44 [ThemeMode::Light, ThemeMode::Dark, ThemeMode::System].map(|mode| {
45 const MODE_NAMES: [SharedString; 3] = [
46 SharedString::new_static("Light"),
47 SharedString::new_static("Dark"),
48 SharedString::new_static("System"),
49 ];
50 ToggleButtonSimple::new(
51 MODE_NAMES[mode as usize].clone(),
52 move |_, _, cx| {
53 write_mode_change(mode, cx);
54 },
55 )
56 }),
57 )
58 .tab_index(tab_index)
59 .selected_index(theme_mode as usize)
60 .style(ui::ToggleButtonGroupStyle::Outlined)
61 .width(rems_from_px(3. * 64.)),
62 ),
63 )
64 .child(
65 h_flex()
66 .gap_4()
67 .justify_between()
68 .children(render_theme_previews(tab_index, &theme_selection, cx)),
69 );
70
71 fn render_theme_previews(
72 tab_index: &mut isize,
73 theme_selection: &ThemeSelection,
74 cx: &mut App,
75 ) -> [impl IntoElement; 3] {
76 let system_appearance = SystemAppearance::global(cx);
77 let theme_registry = ThemeRegistry::global(cx);
78
79 let theme_seed = 0xBEEF as f32;
80 let theme_mode = theme_selection
81 .mode()
82 .unwrap_or_else(|| match *system_appearance {
83 Appearance::Light => ThemeMode::Light,
84 Appearance::Dark => ThemeMode::Dark,
85 });
86 let appearance = match theme_mode {
87 ThemeMode::Light => Appearance::Light,
88 ThemeMode::Dark => Appearance::Dark,
89 ThemeMode::System => *system_appearance,
90 };
91 let current_theme_name = theme_selection.theme(appearance);
92
93 const LIGHT_THEMES: [&'static str; 3] = ["One Light", "Ayu Light", "Gruvbox Light"];
94 const DARK_THEMES: [&'static str; 3] = ["One Dark", "Ayu Dark", "Gruvbox Dark"];
95 const FAMILY_NAMES: [SharedString; 3] = [
96 SharedString::new_static("One"),
97 SharedString::new_static("Ayu"),
98 SharedString::new_static("Gruvbox"),
99 ];
100
101 let theme_names = match appearance {
102 Appearance::Light => LIGHT_THEMES,
103 Appearance::Dark => DARK_THEMES,
104 };
105
106 let themes = theme_names.map(|theme| theme_registry.get(theme).unwrap());
107
108 let theme_previews = [0, 1, 2].map(|index| {
109 let theme = &themes[index];
110 let is_selected = theme.name == current_theme_name;
111 let name = theme.name.clone();
112 let colors = cx.theme().colors();
113
114 v_flex()
115 .w_full()
116 .items_center()
117 .gap_1()
118 .child(
119 h_flex()
120 .id(name.clone())
121 .relative()
122 .w_full()
123 .border_2()
124 .border_color(colors.border_transparent)
125 .rounded(ThemePreviewTile::ROOT_RADIUS)
126 .map(|this| {
127 if is_selected {
128 this.border_color(colors.border_selected)
129 } else {
130 this.opacity(0.8).hover(|s| s.border_color(colors.border))
131 }
132 })
133 .tab_index({
134 *tab_index += 1;
135 *tab_index - 1
136 })
137 .focus(|mut style| {
138 style.border_color = Some(colors.border_focused);
139 style
140 })
141 .on_click({
142 let theme_name = theme.name.clone();
143 move |_, _, cx| {
144 write_theme_change(theme_name.clone(), theme_mode, cx);
145 }
146 })
147 .map(|this| {
148 if theme_mode == ThemeMode::System {
149 let (light, dark) = (
150 theme_registry.get(LIGHT_THEMES[index]).unwrap(),
151 theme_registry.get(DARK_THEMES[index]).unwrap(),
152 );
153 this.child(
154 ThemePreviewTile::new(light, theme_seed)
155 .style(ThemePreviewStyle::SideBySide(dark)),
156 )
157 } else {
158 this.child(
159 ThemePreviewTile::new(theme.clone(), theme_seed)
160 .style(ThemePreviewStyle::Bordered),
161 )
162 }
163 }),
164 )
165 .child(
166 Label::new(FAMILY_NAMES[index].clone())
167 .color(Color::Muted)
168 .size(LabelSize::Small),
169 )
170 });
171
172 theme_previews
173 }
174
175 fn write_mode_change(mode: ThemeMode, cx: &mut App) {
176 let fs = <dyn Fs>::global(cx);
177 update_settings_file::<ThemeSettings>(fs, cx, move |settings, _cx| {
178 settings.set_mode(mode);
179 });
180 }
181
182 fn write_theme_change(theme: impl Into<Arc<str>>, theme_mode: ThemeMode, cx: &mut App) {
183 let fs = <dyn Fs>::global(cx);
184 let theme = theme.into();
185 update_settings_file::<ThemeSettings>(fs, cx, move |settings, cx| {
186 if theme_mode == ThemeMode::System {
187 settings.theme = Some(ThemeSelection::Dynamic {
188 mode: ThemeMode::System,
189 light: ThemeName(theme.clone()),
190 dark: ThemeName(theme.clone()),
191 });
192 } else {
193 let appearance = *SystemAppearance::global(cx);
194 settings.set_theme(theme.clone(), appearance);
195 }
196 });
197 }
198}
199
200fn render_telemetry_section(tab_index: &mut isize, cx: &App) -> impl IntoElement {
201 let fs = <dyn Fs>::global(cx);
202
203 v_flex()
204 .pt_6()
205 .gap_4()
206 .border_t_1()
207 .border_color(cx.theme().colors().border_variant.opacity(0.5))
208 .child(Label::new("Telemetry").size(LabelSize::Large))
209 .child(SwitchField::new(
210 "onboarding-telemetry-metrics",
211 "Help Improve Zed",
212 Some("Anonymous usage data helps us build the right features and improve your experience.".into()),
213 if TelemetrySettings::get_global(cx).metrics {
214 ui::ToggleState::Selected
215 } else {
216 ui::ToggleState::Unselected
217 },
218 {
219 let fs = fs.clone();
220 move |selection, _, cx| {
221 let enabled = match selection {
222 ToggleState::Selected => true,
223 ToggleState::Unselected => false,
224 ToggleState::Indeterminate => { return; },
225 };
226
227 update_settings_file::<TelemetrySettings>(
228 fs.clone(),
229 cx,
230 move |setting, _| setting.metrics = Some(enabled),
231 );
232 }},
233 ).tab_index({
234 *tab_index += 1;
235 *tab_index
236 }))
237 .child(SwitchField::new(
238 "onboarding-telemetry-crash-reports",
239 "Help Fix Zed",
240 Some("Send crash reports so we can fix critical issues fast.".into()),
241 if TelemetrySettings::get_global(cx).diagnostics {
242 ui::ToggleState::Selected
243 } else {
244 ui::ToggleState::Unselected
245 },
246 {
247 let fs = fs.clone();
248 move |selection, _, cx| {
249 let enabled = match selection {
250 ToggleState::Selected => true,
251 ToggleState::Unselected => false,
252 ToggleState::Indeterminate => { return; },
253 };
254
255 update_settings_file::<TelemetrySettings>(
256 fs.clone(),
257 cx,
258 move |setting, _| setting.diagnostics = Some(enabled),
259 );
260 }
261 }
262 ).tab_index({
263 *tab_index += 1;
264 *tab_index
265 }))
266}
267
268fn render_base_keymap_section(tab_index: &mut isize, cx: &mut App) -> impl IntoElement {
269 let base_keymap = match BaseKeymap::get_global(cx) {
270 BaseKeymap::VSCode => Some(0),
271 BaseKeymap::JetBrains => Some(1),
272 BaseKeymap::SublimeText => Some(2),
273 BaseKeymap::Atom => Some(3),
274 BaseKeymap::Emacs => Some(4),
275 BaseKeymap::Cursor => Some(5),
276 BaseKeymap::TextMate | BaseKeymap::None => None,
277 };
278
279 return v_flex().gap_2().child(Label::new("Base Keymap")).child(
280 ToggleButtonGroup::two_rows(
281 "base_keymap_selection",
282 [
283 ToggleButtonWithIcon::new("VS Code", IconName::EditorVsCode, |_, _, cx| {
284 write_keymap_base(BaseKeymap::VSCode, cx);
285 }),
286 ToggleButtonWithIcon::new("Jetbrains", IconName::EditorJetBrains, |_, _, cx| {
287 write_keymap_base(BaseKeymap::JetBrains, cx);
288 }),
289 ToggleButtonWithIcon::new("Sublime Text", IconName::EditorSublime, |_, _, cx| {
290 write_keymap_base(BaseKeymap::SublimeText, cx);
291 }),
292 ],
293 [
294 ToggleButtonWithIcon::new("Atom", IconName::EditorAtom, |_, _, cx| {
295 write_keymap_base(BaseKeymap::Atom, cx);
296 }),
297 ToggleButtonWithIcon::new("Emacs", IconName::EditorEmacs, |_, _, cx| {
298 write_keymap_base(BaseKeymap::Emacs, cx);
299 }),
300 ToggleButtonWithIcon::new("Cursor", IconName::EditorCursor, |_, _, cx| {
301 write_keymap_base(BaseKeymap::Cursor, cx);
302 }),
303 ],
304 )
305 .when_some(base_keymap, |this, base_keymap| {
306 this.selected_index(base_keymap)
307 })
308 .full_width()
309 .tab_index(tab_index)
310 .size(ui::ToggleButtonGroupSize::Medium)
311 .style(ui::ToggleButtonGroupStyle::Outlined),
312 );
313
314 fn write_keymap_base(keymap_base: BaseKeymap, cx: &App) {
315 let fs = <dyn Fs>::global(cx);
316
317 update_settings_file::<BaseKeymap>(fs, cx, move |setting, _| {
318 *setting = Some(keymap_base);
319 });
320 }
321}
322
323fn render_vim_mode_switch(tab_index: &mut isize, cx: &mut App) -> impl IntoElement {
324 let toggle_state = if VimModeSetting::get_global(cx).0 {
325 ui::ToggleState::Selected
326 } else {
327 ui::ToggleState::Unselected
328 };
329 SwitchField::new(
330 "onboarding-vim-mode",
331 "Vim Mode",
332 Some("Coming from Neovim? Use our first-class implementation of Vim Mode.".into()),
333 toggle_state,
334 {
335 let fs = <dyn Fs>::global(cx);
336 move |&selection, _, cx| {
337 update_settings_file::<VimModeSetting>(fs.clone(), cx, move |setting, _| {
338 *setting = match selection {
339 ToggleState::Selected => Some(true),
340 ToggleState::Unselected => Some(false),
341 ToggleState::Indeterminate => None,
342 }
343 });
344 }
345 },
346 )
347 .tab_index({
348 *tab_index += 1;
349 *tab_index - 1
350 })
351}
352
353pub(crate) fn render_basics_page(cx: &mut App) -> impl IntoElement {
354 let mut tab_index = 0;
355 v_flex()
356 .gap_6()
357 .child(render_theme_section(&mut tab_index, cx))
358 .child(render_base_keymap_section(&mut tab_index, cx))
359 .child(render_vim_mode_switch(&mut tab_index, cx))
360 .child(render_telemetry_section(&mut tab_index, cx))
361}