scroll the browse panel header with the group cards

This commit is contained in:
2026-10-08 04:27:26 +07:00
parent 64b49443ff
commit 65c617aff1
+145 -134
View File
@@ -4,8 +4,9 @@ use std::rc::Rc;
use gpui::prelude::FluentBuilder;
use gpui::{
AnyElement, App, AppContext, Context, Entity, EventEmitter, FocusHandle, Focusable,
IntoElement, ParentElement, Render, ScrollStrategy, SharedString, Styled, Subscription, Task,
WeakEntity, Window, div, px, relative, size,
InteractiveElement, IntoElement, ParentElement, Render, ScrollStrategy, SharedString,
StatefulInteractiveElement, Styled, Subscription, Task, WeakEntity, Window, div, px, relative,
size,
};
use gpui_base::{VirtualListScrollHandle, v_virtual_list};
use nip29::{Discovery, GroupCandidate, GroupKey, GroupsEvent, GroupsRegistry};
@@ -23,6 +24,7 @@ use ui::{Disableable, Icon, IconName, Sizable, StyledExt, WindowExtension, h_fle
const TITLE: &str = "Browse";
const INPUT_PLACEHOLDER: &str = "wss://relay.example.com";
const HEADER_HEIGHT: f32 = 96.0;
const CARD_HEIGHT: f32 = 164.0;
const NO_DESCRIPTION: &str = "No description";
@@ -43,7 +45,7 @@ pub struct BrowsePanel {
discovery: Discovery,
/// Whether the discovery sync is still running
discovering: bool,
/// The scroll position of the group list
/// The scroll position of the panel
scroll_handle: VirtualListScrollHandle,
/// Whether the relay is still answering
loading: bool,
@@ -222,8 +224,7 @@ impl BrowsePanel {
}
/// Join a browsed group and open it.
fn join(&self, key: GroupKey, window: &mut Window, cx: &mut App) {
let dock = self.dock.clone();
fn join(dock: &WeakEntity<DockArea>, key: GroupKey, window: &mut Window, cx: &mut App) {
let registry = GroupsRegistry::global(cx);
registry.update(cx, |registry, cx| {
@@ -235,7 +236,7 @@ impl BrowsePanel {
};
ui::dock::add_panel_to(
&dock,
dock,
PanelHandle::new(nip29_ui::init(group, window, cx)),
DockPlacement::Center,
window,
@@ -243,67 +244,114 @@ impl BrowsePanel {
);
}
fn render_discovered_rows(
&mut self,
range: Range<usize>,
cx: &mut Context<Self>,
) -> Vec<AnyElement> {
let registry = GroupsRegistry::global(cx);
let joined: Vec<GroupKey> = registry
/// The discovered groups the user has not joined yet.
fn discovered_cards(&self, cx: &App) -> Vec<GroupCandidate> {
let joined: Vec<GroupKey> = GroupsRegistry::global(cx)
.read(cx)
.groups()
.iter()
.map(|group| group.read(cx).key().clone())
.collect();
let cards: Vec<GroupCandidate> = self
.discovery
self.discovery
.discovered()
.iter()
.filter(|candidate| !joined.contains(&candidate.key))
.skip(range.start * 2)
.take((range.end - range.start) * 2)
.cloned()
.collect();
self.render_card_rows(&cards, cx)
.collect()
}
fn render_browse_rows(
&mut self,
range: Range<usize>,
cx: &mut Context<Self>,
) -> Vec<AnyElement> {
let start = range.start * 2;
let end = (range.end * 2).min(self.candidates.len());
let cards = self.candidates.get(start..end).unwrap_or(&[]);
self.render_card_rows(cards, cx)
}
fn render_card_rows(
&self,
cards: &[GroupCandidate],
cx: &mut Context<Self>,
) -> Vec<AnyElement> {
cards
.chunks(2)
.map(|pair| {
let first = pair.first();
let second = pair.get(1);
/// The panel header, item 0 of the list so it scrolls with the cards.
fn render_header(&self, cx: &Context<Self>) -> AnyElement {
h_flex()
.w_full()
.px_4()
.h_24()
.flex_shrink_0()
.justify_between()
.child(
v_flex()
.min_w_0()
.child(
div()
.text_sm()
.font_semibold()
.line_height(relative(1.2))
.child("Public Groups"),
)
.child(
div()
.truncate()
.text_xs()
.text_color(cx.theme().text_muted)
.map(|this| match &self.relay {
Some(relay) => {
this.child(SharedString::from(relay.as_str().to_owned()))
}
None => this.child(SharedString::from(
"Hosted on current connected relays",
)),
}),
),
)
.child(
h_flex()
.gap_1()
.w_full()
.h(px(CARD_HEIGHT))
.p_2()
.gap_2()
.children(first.map(|card| self.render_card(card, cx)))
.child(match second {
Some(card) => self.render_card(card, cx),
None => div().flex_1().into_any_element(),
})
.into_any_element()
.max_w_64()
.px_1()
.rounded(cx.theme().radius)
.bg(cx.theme().surface_background)
.child(
Input::new(&self.input)
.appearance(false)
.small()
.text_sm()
.flex_1(),
)
.child(
Button::new("relay-browse")
.icon(IconName::ArrowRight)
.tooltip("Browse by Relay")
.ghost()
.small()
.on_click(cx.listener(|this, _event, window, cx| {
this.browse(window, cx);
})),
),
)
.into_any_element()
}
fn render_list_rows(&mut self, range: Range<usize>, cx: &mut Context<Self>) -> Vec<AnyElement> {
let discover = self.relay.is_none();
let cards: Vec<GroupCandidate> = if discover {
self.discovered_cards(cx)
} else {
self.candidates.clone()
};
range
.map(|ix| {
if ix == 0 {
self.render_header(cx)
} else {
let pair = cards.chunks(2).nth(ix - 1).unwrap_or(&[]);
h_flex()
.w_full()
.h(px(CARD_HEIGHT))
.px_4()
.pb_4()
.gap_4()
.children(pair.first().map(|card| self.render_card(card, cx)))
.child(match pair.get(1) {
Some(card) => self.render_card(card, cx),
None => div().flex_1().into_any_element(),
})
.into_any_element()
}
})
.collect()
}
@@ -337,6 +385,7 @@ impl BrowsePanel {
.into_any_element()
} else {
let panel = cx.entity().downgrade();
let dock = self.dock.clone();
let clicked = key;
Button::new(format!("join-{seed}"))
@@ -344,9 +393,9 @@ impl BrowsePanel {
.small()
.ghost()
.on_click(move |_event, window, cx| {
let _ = panel.update(cx, |panel, cx| {
panel.join(clicked.clone(), window, cx);
});
Self::join(&dock, clicked.clone(), window, cx);
let _ = panel.update(cx, |_, cx| cx.notify());
})
.into_any_element()
};
@@ -435,7 +484,8 @@ impl Panel for BrowsePanel {
fn title(&self, cx: &App) -> AnyElement {
h_flex()
.gap_1p5()
.gap_1()
.text_xs()
.child(
Icon::new(IconName::Compass)
.small()
@@ -456,97 +506,58 @@ impl Focusable for BrowsePanel {
impl Render for BrowsePanel {
fn render(&mut self, _window: &mut Window, cx: &mut Context<Self>) -> impl IntoElement {
let count = self.candidates.len();
let view = cx.entity();
let discover = self.relay.is_none();
let (discovered_count, discovering) = if discover {
let registry = GroupsRegistry::global(cx);
let joined: Vec<GroupKey> = registry
.read(cx)
.groups()
.iter()
.map(|group| group.read(cx).key().clone())
.collect();
let discovered_count = self
.discovery
.discovered()
.iter()
.filter(|candidate| !joined.contains(&candidate.key))
.count();
(discovered_count, self.discovering)
let cards: Vec<GroupCandidate> = if discover {
self.discovered_cards(cx)
} else {
(0, false)
self.candidates.clone()
};
let body = if discover {
if discovered_count > 0 {
let rows = discovered_count.div_ceil(2);
let item_sizes = Rc::new(vec![size(px(0.), px(CARD_HEIGHT)); rows]);
let rows = cards.len().div_ceil(2);
v_virtual_list(
cx.entity(),
"discovered",
item_sizes,
|this, range, _, cx| this.render_discovered_rows(range, cx),
)
.track_scroll(&self.scroll_handle)
.h_full()
.into_any_element()
} else if discovering {
notice("Discovering groups…", cx)
} else {
notice("No groups found.", cx)
}
} else if count > 0 {
let rows = count.div_ceil(2);
let item_sizes = Rc::new(vec![size(px(0.), px(CARD_HEIGHT)); rows]);
let content: AnyElement = if rows > 0 {
let mut item_sizes = vec![size(px(0.), px(HEADER_HEIGHT))];
item_sizes.resize(rows + 1, size(px(0.), px(CARD_HEIGHT)));
v_virtual_list(cx.entity(), "groups", item_sizes, |this, range, _, cx| {
this.render_browse_rows(range, cx)
})
v_virtual_list(
view,
"groups",
Rc::new(item_sizes),
|this, range, _window, cx| this.render_list_rows(range, cx),
)
.track_scroll(&self.scroll_handle)
.h_full()
.into_any_element()
} else if self.loading {
notice("Loading groups…", cx)
} else {
notice("No groups found.", cx)
let text = if discover {
if self.discovering {
"Discovering groups…"
} else {
"No groups found."
}
} else if self.loading {
"Loading groups…"
} else {
"No groups found."
};
v_flex()
.id("browse-content")
.size_full()
.overflow_y_scroll()
.track_scroll(&self.scroll_handle)
.child(self.render_header(cx))
.child(notice(text, cx))
.into_any_element()
};
v_flex()
div()
.size_full()
.child(
v_flex()
.h_32()
.flex_shrink_0()
.items_center()
.justify_center()
.bg(cx.theme().surface_background)
.child(
h_flex()
.w_full()
.max_w_56()
.gap_1()
.child(Input::new(&self.input).cleanable(true).flex_1())
.child(Button::new("browse-go").label("Go").primary().on_click(
cx.listener(|this, _event, window, cx| {
this.browse(window, cx);
}),
)),
),
)
.child(
div()
.flex_1()
.min_h_0()
.relative()
.px_2()
.child(body)
.child(Scrollbar::vertical(&self.scroll_handle)),
)
.relative()
.child(content)
.child(Scrollbar::vertical(&self.scroll_handle))
}
}