reya/coop
1
0
Fork 0
Code Issues Pull Requests Releases Activity

wip: refactor

Browse Source
This commit is contained in:
reya
2024-12-28 09:23:06 +07:00
parent 2ddd2d3b17
commit 1c752accb2
8 changed files with 175 additions and 26 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
assets/icons/chevron-down-small.svg Normal file
View File

@@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24">
<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="m8 10 3.293 3.293a1 1 0 0 0 1.414 0L16 10"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 247 B

3
assets/icons/close.svg Normal file
View File

@@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24">
<path fill="#100" fill-rule="evenodd" d="M4.116 4.116a1.25 1.25 0 0 1 1.768 0L12 10.232l6.116-6.116a1.25 1.25 0 0 1 1.768 1.768L13.768 12l6.116 6.116a1.25 1.25 0 0 1-1.768 1.768L12 13.768l-6.116 6.116a1.25 1.25 0 0 1-1.768-1.768L10.232 12 4.116 5.884a1.25 1.25 0 0 1 0-1.768Z" clip-rule="evenodd"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 404 B

87
crates/app/src/views/account.rs Normal file
View File

@@ -0,0 +1,87 @@
use coop_ui::{
button::{Button, ButtonVariants},
Icon, IconName, Sizable,
};
use gpui::*;
use nostr_sdk::prelude::*;
use prelude::FluentBuilder;
use crate::{
constants::IMAGE_SERVICE,
get_client,
states::{metadata::MetadataRegistry, signal::SignalRegistry},
};
pub struct Account {
public_key: PublicKey,
metadata: Model<Option<Metadata>>,
}
impl Account {
pub fn new(public_key: PublicKey, cx: &mut ViewContext<'_, Self>) -> Self {
let metadata = cx.new_model(|_| None);
// Request metadata
_ = cx.global::<SignalRegistry>().tx.send(public_key);
// Reload when received metadata
cx.observe_global::<MetadataRegistry>(|chat, cx| {
chat.load_metadata(cx);
})
.detach();
Self {
public_key,
metadata,
}
}
pub fn load_metadata(&mut self, cx: &mut ViewContext<Self>) {
let public_key = self.public_key;
let async_metadata = self.metadata.clone();
let mut async_cx = cx.to_async();
cx.foreground_executor()
.spawn(async move {
let client = get_client();
let query = async_cx
.background_executor()
.spawn(async move { client.database().metadata(public_key).await })
.await;
if let Ok(metadata) = query {
_ = async_cx.update_model(&async_metadata, |a, b| {
*a = metadata;
b.notify();
});
};
})
.detach();
}
}
impl Render for Account {
fn render(&mut self, cx: &mut ViewContext<Self>) -> impl IntoElement {
Button::new("account")
.small()
.compact()
.reverse()
.ghost()
.icon(Icon::new(IconName::ChevronDownSmall))
.when_some(self.metadata.read(cx).as_ref(), |this, metadata| {
this.map(|this| {
if let Some(picture) = metadata.picture.clone() {
this.flex_shrink_0().child(
img(format!("{}/?url={}&w=72&h=72&n=-1", IMAGE_SERVICE, picture))
.size_5()
.rounded_full()
.object_fit(ObjectFit::Cover),
)
} else {
this.flex_shrink_0()
.child(img("brand/avatar.png").size_6().rounded_full())
}
})
})
}
}

73
crates/app/src/views/app.rs
View File

@@ -1,8 +1,8 @@
use coop_ui::{
button::{Button, ButtonVariants},
button::{Button, ButtonCustomVariant, ButtonRounded, ButtonVariants},
dock::{DockArea, DockItem, DockPlacement},
theme::{ActiveTheme, Theme, ThemeMode},
IconName, Root, Sizable, TitleBar,
ContextModal, IconName, Root, Sizable, TitleBar,
};
use gpui::*;
use prelude::FluentBuilder;
@@ -10,6 +10,7 @@ use serde::Deserialize;
use std::sync::Arc;
use super::{
account::Account,
dock::{chat::ChatPanel, left_dock::LeftDock, welcome::WelcomePanel},
onboarding::Onboarding,
};
@@ -34,6 +35,7 @@ pub const DOCK_AREA: DockAreaTab = DockAreaTab {
};
pub struct AppView {
account: Model<Option<View<Account>>>,
onboarding: View<Onboarding>,
dock: View<DockArea>,
}
@@ -46,21 +48,36 @@ impl AppView {
})
.detach();
// Account
let account = cx.new_model(|_| None);
let async_account = account.clone();
// Onboarding
let onboarding = cx.new_view(Onboarding::new);
// Dock
let dock = cx.new_view(|cx| DockArea::new(DOCK_AREA.id, Some(DOCK_AREA.version), cx));
cx.observe_global::<AccountRegistry>(|view, cx| {
if cx.global::<AccountRegistry>().is_user_logged_in() {
// TODO: save dock state and load previous state on startup
cx.observe_global::<AccountRegistry>(move |view, cx| {
if let Some(public_key) = cx.global::<AccountRegistry>().get() {
Self::init_layout(view.dock.downgrade(), cx);
// TODO: save dock state and load previous state on startup
let view = cx.new_view(|cx| Account::new(public_key, cx));
cx.update_model(&async_account, |model, cx| {
*model = Some(view);
cx.notify();
});
}
})
.detach();
AppView { onboarding, dock }
AppView {
account,
onboarding,
dock,
}
}
fn change_theme_mode(&mut self, _: &ClickEvent, cx: &mut ViewContext<Self>) {
@@ -125,18 +142,45 @@ impl Render for AppView {
let modal_layer = Root::render_modal_layer(cx);
let notification_layer = Root::render_notification_layer(cx);
let mut content = div();
let mut content = div().size_full().flex().flex_col();
if cx.global::<AccountRegistry>().is_user_logged_in() {
content = content
.on_action(cx.listener(Self::on_action_add_panel))
.size_full()
.flex()
.flex_col()
.child(
TitleBar::new()
// Left side
.child(div())
.child(
div()
.flex()
.items_center()
.gap_2()
.child(
div().when_some(
self.account.read(cx).as_ref(),
|this, account| this.child(account.clone()),
),
)
.child(
Button::new("new")
.custom(
ButtonCustomVariant::new(cx)
.shadow(false)
.color(cx.theme().primary)
.border(cx.theme().primary)
.foreground(cx.theme().primary_foreground)
.active(cx.theme().primary_active)
.hover(cx.theme().primary_hover),
)
.xsmall()
.rounded(ButtonRounded::Size(px(24.)))
.label("Compose")
.on_click(move |_, cx| {
cx.open_modal(move |modal, _| {
modal.title("Compose").child("TODO").min_h(px(300.))
});
}),
),
)
// Right side
.child(
div()
@@ -161,8 +205,11 @@ impl Render for AppView {
),
)
.child(self.dock.clone())
.on_action(cx.listener(Self::on_action_add_panel))
} else {
content = content.size_full().child(self.onboarding.clone())
content = content
.child(TitleBar::new())
.child(self.onboarding.clone())
}
div()

5
crates/app/src/views/dock/inbox/item.rs
View File

@@ -96,10 +96,7 @@ impl Render for InboxItem {
.map(|this| {
if let Some(picture) = metadata.picture.clone() {
this.flex_shrink_0().child(
img(format!(
"{}/?url={}&w=100&h=100&n=-1",
IMAGE_SERVICE, picture
))
img(format!("{}/?url={}&w=72&h=72&n=-1", IMAGE_SERVICE, picture))
.size_6()
.rounded_full()
.object_fit(ObjectFit::Cover),

1
crates/app/src/views/mod.rs
View File

@@ -1,3 +1,4 @@
pub mod account;
pub mod app;
pub mod dock;
pub mod onboarding;

21
crates/ui/src/button.rs
View File

@@ -5,7 +5,6 @@ use gpui::{
};
use crate::{
h_flex,
indicator::Indicator,
theme::{ActiveTheme, Colorize as _},
tooltip::Tooltip,
@@ -169,6 +168,7 @@ pub struct Button {
border_edges: Edges<bool>,
size: Size,
compact: bool,
reverse: bool,
tooltip: Option<SharedString>,
on_click: OnClick,
pub(crate) stop_propagation: bool,
@@ -200,6 +200,7 @@ impl Button {
on_click: None,
stop_propagation: true,
loading: false,
reverse: false,
compact: false,
children: Vec::new(),
loading_icon: None,
@@ -254,6 +255,12 @@ impl Button {
self
}
/// Set reverse the position between icon and label.
pub fn reverse(mut self) -> Self {
self.reverse = true;
self
}
pub fn on_click(mut self, handler: impl Fn(&ClickEvent, &mut WindowContext) + 'static) -> Self {
self.on_click = Some(Box::new(handler));
self
@@ -352,9 +359,9 @@ impl RenderOnce for Button {
// Normal Button
match self.size {
Size::Size(size) => this.px(size * 0.2),
Size::XSmall => this.h_5().px_1(),
Size::Small => this.h_6().px_3().when(self.compact, |this| this.px_1p5()),
_ => this.h_8().px_4().when(self.compact, |this| this.px_2()),
Size::XSmall => this.h_5().px_2().when(self.compact, |this| this.px_0()),
Size::Small => this.h_6().px_3().when(self.compact, |this| this.px_0p5()),
_ => this.h_8().px_4().when(self.compact, |this| this.px_1()),
}
}
})
@@ -430,13 +437,15 @@ impl RenderOnce for Button {
.shadow_none()
})
.child({
h_flex()
div()
.flex()
.when(self.reverse, |this| this.flex_row_reverse())
.id("label")
.items_center()
.justify_center()
.map(|this| match self.size {
Size::XSmall => this.gap_1().text_xs(),
Size::Small => this.gap_1().text_sm(),
Size::Small => this.gap_1().text_xs(),
_ => this.gap_2().text_base(),
})
.when(!self.loading, |this| {

2
crates/ui/src/icon.rs
View File

@@ -20,6 +20,7 @@ pub enum IconName {
ChartPie,
Check,
ChevronDown,
ChevronDownSmall,
ChevronLeft,
ChevronRight,
ChevronUp,
@@ -99,6 +100,7 @@ impl IconName {
Self::ChartPie => "icons/chart-pie.svg",
Self::Check => "icons/check.svg",
Self::ChevronDown => "icons/chevron-down.svg",
Self::ChevronDownSmall => "icons/chevron-down-small.svg",
Self::ChevronLeft => "icons/chevron-left.svg",
Self::ChevronRight => "icons/chevron-right.svg",
Self::ChevronUp => "icons/chevron-up.svg",