aljaz/notedeck
1
0
Fork 0
mirror of https://github.com/aljazceru/notedeck.git synced 2025-12-20 09:54:19 +01:00
Code Issues Packages Projects Releases Wiki Activity

ui: reactions closer approximation of iOS design

Browse Source 
Signed-off-by: kernelkind <kernelkind@gmail.com>
This commit is contained in:
kernelkind
2025-08-25 20:00:17 -04:00
parent 30af03cfcc
commit 529377a706
4 changed files with 138 additions and 111 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
crates/notedeck_columns/src/ui/timeline.rs
View File

@@ -1,5 +1,5 @@
use egui::containers::scroll_area::ScrollBarVisibility;
use egui::{vec2, Direction, Layout, Pos2, ScrollArea, Sense, Stroke};
use egui::{vec2, Direction, Layout, Margin, Pos2, ScrollArea, Sense, Stroke};
use egui_tabs::TabColor;
use enostr::Pubkey;
use nostrdb::{ProfileRecord, Transaction};
@@ -7,7 +7,7 @@ use notedeck::name::get_display_name;
use notedeck::ui::is_narrow;
use notedeck::{JobsCache, Muted, NoteRef};
use notedeck_ui::app_images::like_image;
use notedeck_ui::{padding, ProfilePic};
use notedeck_ui::ProfilePic;
use std::f32::consts::PI;
use tracing::{error, warn};
@@ -540,14 +540,16 @@ fn render_reaction_cluster(
let num_profiles_other = profiles_to_show.len() - 1;
let mut action = None;
padding(8.0, ui, |ui| {
egui::Frame::new()
.inner_margin(Margin::symmetric(8, 4))
.show(ui, |ui| {
ui.allocate_ui_with_layout(
vec2(ui.available_width(), 32.0),
Layout::left_to_right(egui::Align::Center),
|ui| {
ui.vertical(|ui| {
ui.add_space(16.0);
ui.add_sized(vec2(32.0, 32.0), like_image());
ui.add_space(4.0);
ui.add_sized(vec2(28.0, 28.0), like_image());
});
ui.add_space(16.0);
@@ -562,6 +564,7 @@ fn render_reaction_cluster(
note_context.img_cache,
entry.record.as_ref(),
)
.size(24.0)
.sense(Sense::click()),
);
@@ -606,7 +609,10 @@ fn render_reaction_cluster(
ui.horizontal(|ui| {
ui.add_space(48.0);
let resp = NoteView::new(note_context, &reacted_to_note, note_options, jobs).show(ui);
let options = note_options
.difference(NoteOptions::ActionBar | NoteOptions::OptionsButton)
.union(NoteOptions::NotificationPreview);
let resp = NoteView::new(note_context, &reacted_to_note, options, jobs).show(ui);
if let Some(note_action) = resp.action {
action = Some(note_action);

16
crates/notedeck_ui/src/note/contents.rs
View File

@@ -334,14 +334,14 @@ fn render_undecorated_note_contents<'a>(
.selectable(selectable),
);
} else {
ui.add(
Label::new(
RichText::new(block_str)
.text_style(NotedeckTextStyle::NoteBody.text_style()),
)
.wrap()
.selectable(selectable),
);
let mut richtext = RichText::new(block_str)
.text_style(NotedeckTextStyle::NoteBody.text_style());
if options.contains(NoteOptions::NotificationPreview) {
richtext = richtext.color(egui::Color32::from_rgb(0x87, 0x87, 0x8D));
}
ui.add(Label::new(richtext).wrap().selectable(selectable));
}
// don't render any more blocks
if truncate {

52
crates/notedeck_ui/src/note/mod.rs
View File

@@ -426,16 +426,19 @@ impl<'a, 'd> NoteView<'a, 'd> {
) -> egui::InnerResponse<NoteUiResponse> {
ui.with_layout(egui::Layout::top_down(egui::Align::LEFT), |ui| {
let mut note_action: Option<NoteAction> = None;
let pfp_rect = ui
.horizontal(|ui| {
let mut pfp_rect = None;
if !self.flags.contains(NoteOptions::NotificationPreview) {
ui.horizontal(|ui| {
let pfp_resp = self.pfp(note_key, profile, ui);
let pfp_rect = pfp_resp.bounding_rect;
pfp_rect = Some(pfp_resp.bounding_rect);
note_action = pfp_resp
.into_action(self.note.pubkey())
.or(note_action.take());
let size = ui.available_size();
ui.vertical(|ui| 's: {
ui.vertical(|ui| {
ui.add_sized(
[size.x, self.options().pfp_size() as f32],
|ui: &mut egui::Ui| {
@@ -460,7 +463,7 @@ impl<'a, 'd> NoteView<'a, 'd> {
.borrow(self.note.tags());
if note_reply.reply().is_none() {
break 's;
return;
}
ui.horizontal_wrapped(|ui| {
@@ -477,10 +480,8 @@ impl<'a, 'd> NoteView<'a, 'd> {
.or(note_action.take());
});
});
pfp_rect
})
.inner;
});
}
let mut contents =
NoteContents::new(self.note_context, txn, self.note, self.flags, self.jobs);
@@ -530,14 +531,27 @@ impl<'a, 'd> NoteView<'a, 'd> {
) -> egui::InnerResponse<NoteUiResponse> {
// main design
ui.with_layout(egui::Layout::left_to_right(egui::Align::TOP), |ui| {
let (mut note_action, pfp_rect) =
if self.flags.contains(NoteOptions::NotificationPreview) {
// do not render pfp
(None, None)
} else {
let pfp_resp = self.pfp(note_key, profile, ui);
let pfp_rect = pfp_resp.bounding_rect;
let mut note_action: Option<NoteAction> = pfp_resp.into_action(self.note.pubkey());
(pfp_resp.into_action(self.note.pubkey()), Some(pfp_rect))
};
ui.with_layout(egui::Layout::top_down(egui::Align::LEFT), |ui| {
NoteView::note_header(ui, self.note_context.i18n, self.note, profile, self.flags);
if !self.flags.contains(NoteOptions::NotificationPreview) {
NoteView::note_header(
ui,
self.note_context.i18n,
self.note,
profile,
self.flags,
);
ui.horizontal_wrapped(|ui| 's: {
ui.horizontal_wrapped(|ui| {
ui.spacing_mut().item_spacing.x = 1.0;
let note_reply = self
@@ -548,7 +562,7 @@ impl<'a, 'd> NoteView<'a, 'd> {
.borrow(self.note.tags());
if note_reply.reply().is_none() {
break 's;
return;
}
note_action = reply_desc(
@@ -561,6 +575,7 @@ impl<'a, 'd> NoteView<'a, 'd> {
)
.or(note_action.take());
});
}
let mut contents =
NoteContents::new(self.note_context, txn, self.note, self.flags, self.jobs);
@@ -639,9 +654,12 @@ impl<'a, 'd> NoteView<'a, 'd> {
.then_some(NoteAction::note(NoteId::new(*self.note.id())))
.or(note_action);
NoteResponse::new(response.response)
.with_action(note_action)
.with_pfp(note_ui_resp.pfp_rect)
let mut resp = NoteResponse::new(response.response).with_action(note_action);
if let Some(pfp_rect) = note_ui_resp.pfp_rect {
resp = resp.with_pfp(pfp_rect);
}
resp
}
}
@@ -687,7 +705,7 @@ fn get_reposted_note<'a>(ndb: &Ndb, txn: &'a Transaction, note: &Note) -> Option
struct NoteUiResponse {
action: Option<NoteAction>,
pfp_rect: egui::Rect,
pfp_rect: Option<egui::Rect>,
}
struct PfpResponse {

3
crates/notedeck_ui/src/note/options.rs
View File

@@ -38,6 +38,9 @@ bitflags! {
/// no animation override (accessibility)
const NoAnimations = 1 << 17;
/// Styled for a notification preview
const NotificationPreview = 1 << 18;
}
}