add preferences dialog

crates/coop/src/dialogs/mod.rs

@@ -1 +1,2 @@
 pub mod screening;
+pub mod settings;

crates/coop/src/dialogs/settings.rs

@@ -0,0 +1,166 @@
+use gpui::http_client::Url;
+use gpui::{
+    div, px, App, AppContext, Context, Entity, IntoElement, ParentElement, Render, SharedString,
+    Styled, Window,
+};
+use settings::{AppSettings, AuthMode};
+use theme::ActiveTheme;
+use ui::button::{Button, ButtonVariants};
+use ui::group_box::{GroupBox, GroupBoxVariants};
+use ui::input::{InputState, TextInput};
+use ui::menu::{DropdownMenu, PopupMenuItem};
+use ui::notification::Notification;
+use ui::switch::Switch;
+use ui::{h_flex, v_flex, IconName, Sizable, WindowExtension};
+
+pub fn init(window: &mut Window, cx: &mut App) -> Entity<Preferences> {
+    cx.new(|cx| Preferences::new(window, cx))
+}
+
+pub struct Preferences {
+    file_input: Entity<InputState>,
+}
+
+impl Preferences {
+    pub fn new(window: &mut Window, cx: &mut Context<Self>) -> Self {
+        let server = AppSettings::get_file_server(cx);
+        let file_input = cx.new(|cx| {
+            InputState::new(window, cx)
+                .default_value(server.to_string())
+                .placeholder("https://myblossom.com")
+        });
+
+        Self { file_input }
+    }
+
+    fn update_file_server(&mut self, window: &mut Window, cx: &mut Context<Self>) {
+        let value = self.file_input.read(cx).value();
+
+        match Url::parse(&value) {
+            Ok(url) => {
+                AppSettings::update_file_server(url, cx);
+            }
+            Err(e) => {
+                window.push_notification(Notification::error(e.to_string()), cx);
+            }
+        }
+    }
+}
+
+impl Render for Preferences {
+    fn render(&mut self, _window: &mut Window, cx: &mut Context<Self>) -> impl IntoElement {
+        const SCREENING: &str =
+            "When opening a request, a popup will appear to help you identify the sender.";
+        const AVATAR: &str =
+            "Hide all avatar pictures to improve performance and protect your privacy.";
+        const AUTH: &str = "Authentication before send events for some relays.";
+
+        let screening = AppSettings::get_screening(cx);
+        let hide_avatar = AppSettings::get_hide_avatar(cx);
+        let auth_mode = AppSettings::get_auth_mode(cx);
+
+        v_flex()
+            .gap_4()
+            .child(
+                GroupBox::new()
+                    .id("general")
+                    .title("General")
+                    .fill()
+                    .child(
+                        Switch::new("screening")
+                            .label("Screening")
+                            .description(SCREENING)
+                            .checked(screening)
+                            .on_click(move |_, _window, cx| {
+                                AppSettings::update_screening(!screening, cx);
+                            }),
+                    )
+                    .child(
+                        Switch::new("avatar")
+                            .label("Hide user avatar")
+                            .description(AVATAR)
+                            .checked(hide_avatar)
+                            .on_click(move |_, _window, cx| {
+                                AppSettings::update_hide_avatar(!hide_avatar, cx);
+                            }),
+                    )
+                    .child(
+                        h_flex()
+                            .gap_3()
+                            .justify_between()
+                            .child(
+                                v_flex()
+                                    .child(
+                                        div()
+                                            .text_sm()
+                                            .child(SharedString::from("Relay authentication")),
+                                    )
+                                    .child(
+                                        div()
+                                            .text_xs()
+                                            .text_color(cx.theme().text_muted)
+                                            .child(SharedString::from(AUTH)),
+                                    ),
+                            )
+                            .child(
+                                Button::new("auth")
+                                    .label(auth_mode.to_string())
+                                    .ghost_alt()
+                                    .small()
+                                    .dropdown_menu(|this, _window, _cx| {
+                                        this.min_w(px(256.))
+                                            .item(
+                                                PopupMenuItem::new("Auto authentication").on_click(
+                                                    |_ev, _window, cx| {
+                                                        AppSettings::update_auth_mode(
+                                                            AuthMode::Auto,
+                                                            cx,
+                                                        );
+                                                    },
+                                                ),
+                                            )
+                                            .item(PopupMenuItem::new("Ask every time").on_click(
+                                                |_ev, _window, cx| {
+                                                    AppSettings::update_auth_mode(
+                                                        AuthMode::Manual,
+                                                        cx,
+                                                    );
+                                                },
+                                            ))
+                                    }),
+                            ),
+                    ),
+            )
+            .child(
+                GroupBox::new()
+                    .id("media")
+                    .title("Media Upload Service")
+                    .fill()
+                    .child(
+                        v_flex()
+                            .gap_0p5()
+                            .child(
+                                h_flex()
+                                    .gap_1()
+                                    .child(TextInput::new(&self.file_input).text_xs().small())
+                                    .child(
+                                        Button::new("update-file-server")
+                                            .icon(IconName::Check)
+                                            .ghost()
+                                            .size_8()
+                                            .on_click(cx.listener(move |this, _ev, window, cx| {
+                                                this.update_file_server(window, cx)
+                                            })),
+                                    ),
+                            )
+                            .child(
+                                div()
+                                    .text_size(px(10.))
+                                    .italic()
+                                    .text_color(cx.theme().text_placeholder)
+                                    .child(SharedString::from("Only support blossom service")),
+                            ),
+                    ),
+            )
+    }
+}

crates/coop/src/workspace.rs

@@ -20,6 +20,7 @@ use ui::dock_area::{ClosePanel, DockArea, DockItem};
 use ui::menu::DropdownMenu;
 use ui::{h_flex, v_flex, IconName, Root, Sizable, WindowExtension};
 
+use crate::dialogs::settings;
 use crate::panels::{backup, encryption_key, greeter, messaging_relays, profile, relay_list};
 use crate::sidebar;
 
@@ -187,6 +188,17 @@ impl Workspace {
 
     fn on_command(&mut self, command: &Command, window: &mut Window, cx: &mut Context<Self>) {
         match command {
+            Command::ShowSettings => {
+                let view = settings::init(window, cx);
+
+                window.open_modal(cx, move |this, _window, _cx| {
+                    this.width(px(520.))
+                        .show_close(true)
+                        .pb_4()
+                        .title("Preferences")
+                        .child(view.clone())
+                });
+            }
             Command::ShowProfile => {
                 let nostr = NostrRegistry::global(cx);
                 let signer = nostr.read(cx).signer();
@@ -259,7 +271,7 @@ impl Workspace {
                     this.ensure_messaging_relays(cx);
                 });
             }
-            _ => {}
+            Command::ToggleTheme => {}
         }
     }
 

crates/settings/src/lib.rs

@@ -1,4 +1,5 @@
 use std::collections::{HashMap, HashSet};
+use std::fmt::Display;
 
 use anyhow::{anyhow, Error};
 use common::config_dir;
@@ -49,6 +50,15 @@ pub enum AuthMode {
     Manual,
 }
 
+impl Display for AuthMode {
+    fn fmt(&self, f: &mut std::fmt::Formatter<'_>) -> std::fmt::Result {
+        match self {
+            AuthMode::Auto => write!(f, "Auto authentication"),
+            AuthMode::Manual => write!(f, "Ask every time"),
+        }
+    }
+}
+
 /// Signer kind
 #[derive(Debug, Clone, Default, Serialize, Deserialize, PartialEq, Eq, PartialOrd, Ord)]
 pub enum SignerKind {

crates/ui/src/group_box.rs

@@ -0,0 +1,177 @@
+use std::str::FromStr;
+
+use gpui::prelude::FluentBuilder;
+use gpui::{
+    div, relative, AnyElement, App, ElementId, InteractiveElement as _, IntoElement, ParentElement,
+    RenderOnce, StyleRefinement, Styled, Window,
+};
+use smallvec::SmallVec;
+use theme::ActiveTheme;
+
+use crate::{v_flex, StyledExt as _};
+
+/// The variant of the GroupBox.
+#[derive(Debug, Clone, Default, Copy, PartialEq, Eq, Hash)]
+pub enum GroupBoxVariant {
+    #[default]
+    Normal,
+    Fill,
+}
+
+/// Trait to add GroupBox variant methods to elements.
+pub trait GroupBoxVariants: Sized {
+    /// Set the variant of the [`GroupBox`].
+    #[must_use]
+    fn with_variant(self, variant: GroupBoxVariant) -> Self;
+
+    /// Set to use [`GroupBoxVariant::Normal`] to GroupBox.
+    #[must_use]
+    fn normal(self) -> Self {
+        self.with_variant(GroupBoxVariant::Normal)
+    }
+
+    /// Set to use [`GroupBoxVariant::Fill`] to GroupBox.
+    #[must_use]
+    fn fill(self) -> Self {
+        self.with_variant(GroupBoxVariant::Fill)
+    }
+}
+
+impl GroupBoxVariant {
+    /// Convert the GroupBoxVariant to a string.
+    pub const fn as_str(&self) -> &str {
+        match self {
+            GroupBoxVariant::Normal => "normal",
+            GroupBoxVariant::Fill => "fill",
+        }
+    }
+}
+
+impl FromStr for GroupBoxVariant {
+    type Err = ();
+
+    fn from_str(s: &str) -> Result<Self, Self::Err> {
+        match s.to_lowercase().as_str() {
+            "fill" => Ok(GroupBoxVariant::Fill),
+            _ => Ok(GroupBoxVariant::Normal),
+        }
+    }
+}
+
+/// GroupBox is a styled container element that with
+/// an optional title to groups related content together.
+#[derive(IntoElement)]
+pub struct GroupBox {
+    id: Option<ElementId>,
+    variant: GroupBoxVariant,
+    style: StyleRefinement,
+    title_style: StyleRefinement,
+    title: Option<AnyElement>,
+    content_style: StyleRefinement,
+    children: SmallVec<[AnyElement; 1]>,
+}
+
+impl GroupBox {
+    /// Create a new GroupBox.
+    pub fn new() -> Self {
+        Self {
+            id: None,
+            variant: GroupBoxVariant::default(),
+            style: StyleRefinement::default(),
+            title_style: StyleRefinement::default(),
+            content_style: StyleRefinement::default(),
+            title: None,
+            children: SmallVec::new(),
+        }
+    }
+
+    /// Set the id of the group box, default is None.
+    #[must_use]
+    pub fn id(mut self, id: impl Into<ElementId>) -> Self {
+        self.id = Some(id.into());
+        self
+    }
+
+    /// Set the title of the group box, default is None.
+    #[must_use]
+    pub fn title(mut self, title: impl IntoElement) -> Self {
+        self.title = Some(title.into_any_element());
+        self
+    }
+
+    /// Set the style of the title of the group box to override the default style, default is None.
+    #[must_use]
+    pub fn title_style(mut self, style: StyleRefinement) -> Self {
+        self.title_style = style;
+        self
+    }
+
+    /// Set the style of the content of the group box to override the default style, default is None.
+    #[must_use]
+    pub fn content_style(mut self, style: StyleRefinement) -> Self {
+        self.content_style = style;
+        self
+    }
+}
+
+impl Default for GroupBox {
+    fn default() -> Self {
+        Self::new()
+    }
+}
+
+impl ParentElement for GroupBox {
+    fn extend(&mut self, elements: impl IntoIterator<Item = AnyElement>) {
+        self.children.extend(elements);
+    }
+}
+
+impl Styled for GroupBox {
+    fn style(&mut self) -> &mut StyleRefinement {
+        &mut self.style
+    }
+}
+
+impl GroupBoxVariants for GroupBox {
+    fn with_variant(mut self, variant: GroupBoxVariant) -> Self {
+        self.variant = variant;
+        self
+    }
+}
+
+impl RenderOnce for GroupBox {
+    fn render(self, _: &mut Window, cx: &mut App) -> impl IntoElement {
+        let (bg, has_paddings) = match self.variant {
+            GroupBoxVariant::Normal => (None, false),
+            GroupBoxVariant::Fill => (Some(cx.theme().surface_background), true),
+        };
+
+        v_flex()
+            .id(self.id.unwrap_or("group-box".into()))
+            .w_full()
+            .when(has_paddings, |this| this.gap_3())
+            .when(!has_paddings, |this| this.gap_4())
+            .refine_style(&self.style)
+            .when_some(self.title, |this, title| {
+                this.child(
+                    div()
+                        .text_color(cx.theme().text_muted)
+                        .line_height(relative(1.))
+                        .refine_style(&self.title_style)
+                        .text_sm()
+                        .font_semibold()
+                        .child(title),
+                )
+            })
+            .child(
+                v_flex()
+                    .when_some(bg, |this, bg| this.bg(bg))
+                    .text_color(cx.theme().text)
+                    .when(has_paddings, |this| this.p_2())
+                    .gap_4()
+                    .rounded(cx.theme().radius_lg)
+                    .refine_style(&self.content_style)
+                    .children(self.children),
+            )
+    }
+}

crates/ui/src/lib.rs

@@ -19,6 +19,7 @@ pub mod button;
 pub mod checkbox;
 pub mod divider;
 pub mod dock_area;
+pub mod group_box;
 pub mod history;
 pub mod indicator;
 pub mod input;

crates/ui/src/switch.rs

@@ -233,7 +233,7 @@ impl Element for Switch {
                         .when_some(self.description.clone(), |this, description| {
                             this.child(
                                 div()
-                                    .pr_2()
+                                    .pr_3()
                                     .text_xs()
                                     .text_color(cx.theme().text_muted)
                                     .child(description),