reyaandGitHub
a53b2181ab
* chore: refactor account registry * wip: nip4e * chore: rename account to device * feat: nip44 encryption with master signer * update * refactor * feat: unwrap with device keys * chore: improve handler * chore: fix rustls * chore: refactor onboarding * chore: fix compose * chore: fix send message * chore: fix forgot to request device * fix send message * chore: fix deadlock * chore: small fixes * chore: improve * fix * refactor * refactor * refactor * fix * add fetch request * save keys * fix * update * update * update
348 lines
13 KiB
Rust
348 lines
13 KiB
Rust
use chats::{registry::ChatRegistry, room::Room};
|
|
use compose::Compose;
|
|
use gpui::{
|
|
div, img, percentage, prelude::FluentBuilder, px, relative, uniform_list, AnyElement, App,
|
|
AppContext, Context, Div, Empty, Entity, EventEmitter, FocusHandle, Focusable,
|
|
InteractiveElement, IntoElement, ParentElement, Render, SharedString, Stateful,
|
|
StatefulInteractiveElement, Styled, Window,
|
|
};
|
|
use ui::{
|
|
button::{Button, ButtonRounded, ButtonVariants},
|
|
dock_area::panel::{Panel, PanelEvent},
|
|
popup_menu::PopupMenu,
|
|
skeleton::Skeleton,
|
|
theme::{scale::ColorScaleStep, ActiveTheme},
|
|
ContextModal, Disableable, Icon, IconName, Sizable, StyledExt,
|
|
};
|
|
|
|
use super::app::AddPanel;
|
|
|
|
mod compose;
|
|
|
|
pub fn init(window: &mut Window, cx: &mut App) -> Entity<Sidebar> {
|
|
Sidebar::new(window, cx)
|
|
}
|
|
|
|
pub struct Sidebar {
|
|
name: SharedString,
|
|
focus_handle: FocusHandle,
|
|
label: SharedString,
|
|
is_collapsed: bool,
|
|
}
|
|
|
|
impl Sidebar {
|
|
pub fn new(window: &mut Window, cx: &mut App) -> Entity<Self> {
|
|
cx.new(|cx| Self::view(window, cx))
|
|
}
|
|
|
|
fn view(_window: &mut Window, cx: &mut Context<Self>) -> Self {
|
|
let focus_handle = cx.focus_handle();
|
|
let label = SharedString::from("Inbox");
|
|
|
|
Self {
|
|
name: "Sidebar".into(),
|
|
is_collapsed: false,
|
|
focus_handle,
|
|
label,
|
|
}
|
|
}
|
|
|
|
fn render_compose(&mut self, window: &mut Window, cx: &mut Context<Self>) {
|
|
let compose = cx.new(|cx| Compose::new(window, cx));
|
|
|
|
window.open_modal(cx, move |modal, window, cx| {
|
|
let label = compose.read(cx).label(window, cx);
|
|
let is_submitting = compose.read(cx).is_submitting();
|
|
|
|
modal
|
|
.title("Direct Messages")
|
|
.width(px(420.))
|
|
.child(compose.clone())
|
|
.footer(
|
|
div()
|
|
.p_2()
|
|
.border_t_1()
|
|
.border_color(cx.theme().base.step(cx, ColorScaleStep::FIVE))
|
|
.child(
|
|
Button::new("create_dm_btn")
|
|
.label(label)
|
|
.primary()
|
|
.bold()
|
|
.rounded(ButtonRounded::Large)
|
|
.w_full()
|
|
.loading(is_submitting)
|
|
.disabled(is_submitting)
|
|
.on_click(window.listener_for(&compose, |this, _, window, cx| {
|
|
this.compose(window, cx)
|
|
})),
|
|
),
|
|
)
|
|
})
|
|
}
|
|
|
|
fn render_room(&self, ix: usize, room: &Entity<Room>, cx: &Context<Self>) -> Stateful<Div> {
|
|
let room = room.read(cx);
|
|
|
|
div()
|
|
.id(ix)
|
|
.px_1()
|
|
.h_8()
|
|
.w_full()
|
|
.flex()
|
|
.items_center()
|
|
.justify_between()
|
|
.text_xs()
|
|
.rounded(px(cx.theme().radius))
|
|
.hover(|this| this.bg(cx.theme().base.step(cx, ColorScaleStep::FOUR)))
|
|
.child(div().flex_1().truncate().font_medium().map(|this| {
|
|
if room.is_group() {
|
|
this.flex()
|
|
.items_center()
|
|
.gap_2()
|
|
.child(
|
|
div()
|
|
.flex()
|
|
.justify_center()
|
|
.items_center()
|
|
.size_6()
|
|
.rounded_full()
|
|
.bg(cx.theme().accent.step(cx, ColorScaleStep::THREE))
|
|
.child(Icon::new(IconName::GroupFill).size_3().text_color(
|
|
cx.theme().accent.step(cx, ColorScaleStep::TWELVE),
|
|
)),
|
|
)
|
|
.when_some(room.name(), |this, name| this.child(name))
|
|
} else {
|
|
this.when_some(room.first_member(), |this, member| {
|
|
this.flex()
|
|
.items_center()
|
|
.gap_2()
|
|
.child(
|
|
img(member.avatar.clone())
|
|
.size_6()
|
|
.rounded_full()
|
|
.flex_shrink_0(),
|
|
)
|
|
.child(member.name.clone())
|
|
})
|
|
}
|
|
}))
|
|
.child(
|
|
div()
|
|
.flex_shrink_0()
|
|
.text_color(cx.theme().base.step(cx, ColorScaleStep::ELEVEN))
|
|
.child(room.ago()),
|
|
)
|
|
.on_click({
|
|
let id = room.id;
|
|
|
|
cx.listener(move |this, _, window, cx| {
|
|
this.open(id, window, cx);
|
|
})
|
|
})
|
|
}
|
|
|
|
fn render_skeleton(&self, total: i32) -> impl IntoIterator<Item = impl IntoElement> {
|
|
(0..total).map(|_| {
|
|
div()
|
|
.h_8()
|
|
.w_full()
|
|
.px_1()
|
|
.flex()
|
|
.items_center()
|
|
.gap_2()
|
|
.child(Skeleton::new().flex_shrink_0().size_6().rounded_full())
|
|
.child(Skeleton::new().w_20().h_3().rounded_sm())
|
|
})
|
|
}
|
|
|
|
fn open(&self, id: u64, window: &mut Window, cx: &mut Context<Self>) {
|
|
window.dispatch_action(
|
|
Box::new(AddPanel::new(
|
|
super::app::PanelKind::Room(id),
|
|
ui::dock_area::dock::DockPlacement::Center,
|
|
)),
|
|
cx,
|
|
);
|
|
}
|
|
}
|
|
|
|
impl Panel for Sidebar {
|
|
fn panel_id(&self) -> SharedString {
|
|
"Sidebar".into()
|
|
}
|
|
|
|
fn title(&self, _cx: &App) -> AnyElement {
|
|
self.name.clone().into_any_element()
|
|
}
|
|
|
|
fn popup_menu(&self, menu: PopupMenu, _cx: &App) -> PopupMenu {
|
|
menu.track_focus(&self.focus_handle)
|
|
}
|
|
|
|
fn toolbar_buttons(&self, _window: &Window, _cx: &App) -> Vec<Button> {
|
|
vec![]
|
|
}
|
|
}
|
|
|
|
impl EventEmitter<PanelEvent> for Sidebar {}
|
|
|
|
impl Focusable for Sidebar {
|
|
fn focus_handle(&self, _: &App) -> gpui::FocusHandle {
|
|
self.focus_handle.clone()
|
|
}
|
|
}
|
|
|
|
impl Render for Sidebar {
|
|
fn render(&mut self, _window: &mut Window, cx: &mut Context<Self>) -> impl IntoElement {
|
|
let entity = cx.entity();
|
|
|
|
div()
|
|
.flex()
|
|
.flex_col()
|
|
.size_full()
|
|
.child(
|
|
div()
|
|
.px_2()
|
|
.py_3()
|
|
.w_full()
|
|
.flex_shrink_0()
|
|
.flex()
|
|
.flex_col()
|
|
.gap_1()
|
|
.child(
|
|
div()
|
|
.id("new_message")
|
|
.flex()
|
|
.items_center()
|
|
.gap_2()
|
|
.px_1()
|
|
.h_7()
|
|
.text_xs()
|
|
.font_semibold()
|
|
.rounded(px(cx.theme().radius))
|
|
.child(
|
|
div()
|
|
.size_6()
|
|
.flex()
|
|
.items_center()
|
|
.justify_center()
|
|
.rounded_full()
|
|
.bg(cx.theme().accent.step(cx, ColorScaleStep::NINE))
|
|
.child(
|
|
Icon::new(IconName::ComposeFill)
|
|
.small()
|
|
.text_color(cx.theme().base.darken(cx)),
|
|
),
|
|
)
|
|
.child("New Message")
|
|
.hover(|this| this.bg(cx.theme().base.step(cx, ColorScaleStep::THREE)))
|
|
.on_click(cx.listener(|this, _, window, cx| {
|
|
// Open compose modal
|
|
this.render_compose(window, cx);
|
|
})),
|
|
)
|
|
.child(Empty),
|
|
)
|
|
.child(
|
|
div()
|
|
.px_2()
|
|
.w_full()
|
|
.flex_1()
|
|
.flex()
|
|
.flex_col()
|
|
.gap_1()
|
|
.child(
|
|
div()
|
|
.id("inbox_header")
|
|
.px_1()
|
|
.h_7()
|
|
.flex()
|
|
.items_center()
|
|
.flex_shrink_0()
|
|
.rounded(px(cx.theme().radius))
|
|
.text_xs()
|
|
.font_semibold()
|
|
.child(
|
|
Icon::new(IconName::ChevronDown)
|
|
.size_6()
|
|
.when(self.is_collapsed, |this| {
|
|
this.rotate(percentage(270. / 360.))
|
|
}),
|
|
)
|
|
.child(self.label.clone())
|
|
.hover(|this| this.bg(cx.theme().base.step(cx, ColorScaleStep::THREE)))
|
|
.on_click(cx.listener(move |view, _event, _window, cx| {
|
|
view.is_collapsed = !view.is_collapsed;
|
|
cx.notify();
|
|
})),
|
|
)
|
|
.when(!self.is_collapsed, |this| {
|
|
this.flex_1()
|
|
.w_full()
|
|
.when_some(ChatRegistry::global(cx), |this, state| {
|
|
let is_loading = state.read(cx).is_loading();
|
|
let len = state.read(cx).rooms().len();
|
|
|
|
if is_loading {
|
|
this.children(self.render_skeleton(5))
|
|
} else if state.read(cx).rooms().is_empty() {
|
|
this.child(
|
|
div()
|
|
.px_1()
|
|
.w_full()
|
|
.h_20()
|
|
.flex()
|
|
.flex_col()
|
|
.items_center()
|
|
.justify_center()
|
|
.text_center()
|
|
.rounded(px(cx.theme().radius))
|
|
.bg(cx.theme().base.step(cx, ColorScaleStep::THREE))
|
|
.child(
|
|
div()
|
|
.text_xs()
|
|
.font_semibold()
|
|
.line_height(relative(1.2))
|
|
.child("No chats"),
|
|
)
|
|
.child(
|
|
div()
|
|
.text_xs()
|
|
.text_color(
|
|
cx.theme()
|
|
.base
|
|
.step(cx, ColorScaleStep::ELEVEN),
|
|
)
|
|
.child("Recent chats will appear here."),
|
|
),
|
|
)
|
|
} else {
|
|
this.child(
|
|
uniform_list(
|
|
entity,
|
|
"rooms",
|
|
len,
|
|
move |this, range, _, cx| {
|
|
let mut items = vec![];
|
|
|
|
for ix in range {
|
|
if let Some(room) =
|
|
state.read(cx).rooms().get(ix)
|
|
{
|
|
items.push(this.render_room(ix, room, cx));
|
|
}
|
|
}
|
|
|
|
items
|
|
},
|
|
)
|
|
.size_full(),
|
|
)
|
|
}
|
|
})
|
|
}),
|
|
)
|
|
}
|
|
}
|