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