Merge 'Accounts and Relay nav #307'

Now that we've refactored everything, column routing is trivial. This
adds account management and relay nav to the sidebar.

https://cdn.jb55.com/s/notedeck-router.mp4

William Casarin (5):
      accounts: use column nav for account management
      cleanup: remove account switcher widget
      nav: fix accounts nav animations
      ui: hook up relay management view
This commit is contained in:
William Casarin
2024-09-17 09:28:04 -07:00
8 changed files with 78 additions and 303 deletions

View File

@@ -38,10 +38,7 @@ fn open_thread(
threads: &mut Threads,
selected_note: &[u8; 32],
) -> Option<BarResult> {
{
router.route_to(Route::thread(NoteId::new(selected_note.to_owned())));
router.navigating = true;
}
router.route_to(Route::thread(NoteId::new(selected_note.to_owned())));
let root_id = crate::note::root_note_id_from_selected_id(ndb, note_cache, txn, selected_note);
let thread_res = threads.thread_mut(ndb, txn, root_id);

View File

@@ -3,7 +3,7 @@ use crate::{
app_creation::setup_cc,
app_style::user_requested_visuals_change,
args::Args,
column::Columns,
column::{Column, Columns},
draft::Drafts,
error::{Error, FilterError},
filter,
@@ -14,10 +14,11 @@ use crate::{
nav,
note::NoteRef,
notecache::{CachedNote, NoteCache},
route::Route,
subscriptions::{SubKind, Subscriptions},
thread::Threads,
timeline::{Timeline, TimelineKind, ViewFilter},
ui::{self, AccountSelectionWidget, DesktopSidePanel},
ui::{self, DesktopSidePanel},
unknowns::UnknownIds,
view_state::ViewState,
Result,
@@ -64,7 +65,6 @@ pub struct Damus {
pub debug: bool,
pub since_optimize: bool,
pub textmode: bool,
pub show_account_switcher: bool,
}
fn relay_setup(pool: &mut RelayPool, ctx: &egui::Context) {
@@ -697,7 +697,6 @@ impl Damus {
ndb,
accounts,
frame_history: FrameHistory::default(),
show_account_switcher: false,
view_state: ViewState::default(),
}
}
@@ -776,7 +775,6 @@ impl Damus {
ndb: Ndb::new(data_path.as_ref().to_str().expect("db path ok"), &config).expect("ndb"),
accounts: AccountManager::new(None, KeyStorageType::None),
frame_history: FrameHistory::default(),
show_account_switcher: false,
view_state: ViewState::default(),
}
}
@@ -941,7 +939,6 @@ fn render_damus_desktop(ctx: &egui::Context, app: &mut Damus) {
main_panel(&ctx.style(), ui::is_narrow(ctx)).show(ctx, |ui| {
ui.spacing_mut().item_spacing.x = 0.0;
AccountSelectionWidget::ui(app, ui);
if need_scroll {
egui::ScrollArea::horizontal().show(ui, |ui| {
timelines_view(ui, panel_sizes, app, app.columns.columns().len());
@@ -962,11 +959,23 @@ fn timelines_view(ui: &mut egui::Ui, sizes: Size, app: &mut Damus, columns: usiz
let rect = ui.available_rect_before_wrap();
let side_panel = DesktopSidePanel::new(app).show(ui);
if side_panel.response.clicked() {
info!("clicked {:?}", side_panel.action);
}
let router = if let Some(router) = app
.columns
.columns_mut()
.get_mut(0)
.map(|c: &mut Column| c.router_mut())
{
router
} else {
// TODO(jb55): Maybe we should have an empty column route?
let columns = app.columns.columns_mut();
columns.push(Column::new(vec![Route::accounts()]));
columns[0].router_mut()
};
DesktopSidePanel::perform_action(app, side_panel.action);
if side_panel.response.clicked() {
DesktopSidePanel::perform_action(router, side_panel.action);
}
// vertical sidebar line
ui.painter().vline(

View File

@@ -11,6 +11,7 @@ use crate::{
use egui_nav::{Nav, NavAction};
pub fn render_nav(show_postbox: bool, col: usize, app: &mut Damus, ui: &mut egui::Ui) {
// TODO(jb55): clean up this router_mut mess by using Router<R> in egui-nav directly
let nav_response = Nav::new(app.columns().column(col).router().routes().clone())
.navigating(app.columns_mut().column_mut(col).router_mut().navigating)
.returning(app.columns_mut().column_mut(col).router_mut().returning)
@@ -67,7 +68,7 @@ pub fn render_nav(show_postbox: bool, col: usize, app: &mut Damus, ui: &mut egui
}
if let Some(NavAction::Returned) = nav_response.action {
let r = app.columns_mut().column_mut(col).router_mut().go_back();
let r = app.columns_mut().column_mut(col).router_mut().pop();
if let Some(Route::Timeline(TimelineRoute::Thread(id))) = r {
thread_unsubscribe(
&app.ndb,
@@ -77,7 +78,6 @@ pub fn render_nav(show_postbox: bool, col: usize, app: &mut Damus, ui: &mut egui
id.bytes(),
);
}
app.columns_mut().column_mut(col).router_mut().returning = false;
} else if let Some(NavAction::Navigated) = nav_response.action {
app.columns_mut().column_mut(col).router_mut().navigating = false;
}

View File

@@ -27,6 +27,10 @@ impl Route {
}
}
pub fn relays() -> Self {
Route::Relays
}
pub fn thread(thread_root: NoteId) -> Self {
Route::Timeline(TimelineRoute::Thread(thread_root))
}
@@ -68,13 +72,25 @@ impl<R: Clone> Router<R> {
}
pub fn route_to(&mut self, route: R) {
self.navigating = true;
self.routes.push(route);
}
/// Go back, start the returning process
pub fn go_back(&mut self) -> Option<R> {
if self.returning || self.routes.len() == 1 {
return None;
}
self.returning = true;
self.routes.get(self.routes.len() - 2).cloned()
}
/// Pop a route, should only be called on a NavRespose::Returned reseponse
pub fn pop(&mut self) -> Option<R> {
if self.routes.len() == 1 {
return None;
}
self.returning = false;
self.routes.pop()
}

View File

@@ -1,272 +0,0 @@
use crate::{
colors::PINK, profile::DisplayName, ui, ui::profile_preview_controller,
user_account::UserAccount, Damus, Result,
};
use nostrdb::Ndb;
use egui::{
Align, Button, Color32, Frame, Id, Image, Layout, Margin, RichText, Rounding, ScrollArea,
Sense, Vec2,
};
use super::profile::preview::SimpleProfilePreview;
pub struct AccountSelectionWidget {}
enum AccountSelectAction {
RemoveAccount { _index: usize },
SelectAccount { _index: usize },
}
#[derive(Default)]
struct AccountSelectResponse {
action: Option<AccountSelectAction>,
}
impl AccountSelectionWidget {
pub fn ui(app: &mut Damus, ui: &mut egui::Ui) {
if !app.show_account_switcher {
return;
}
if ui::is_narrow(ui.ctx()) {
Self::show_mobile(ui);
} else {
account_switcher_window(&mut app.show_account_switcher.clone()).show(
ui.ctx(),
|ui: &mut egui::Ui| {
let (account_selection_response, response) = Self::show(app, ui);
if let Some(action) = account_selection_response.action {
Self::perform_action(app, action);
}
response
},
);
}
}
fn perform_action(app: &mut Damus, action: AccountSelectAction) {
match action {
AccountSelectAction::RemoveAccount { _index } => {
app.accounts_mut().remove_account(_index)
}
AccountSelectAction::SelectAccount { _index } => {
app.show_account_switcher = false;
app.accounts_mut().select_account(_index);
}
}
}
fn show(app: &mut Damus, ui: &mut egui::Ui) -> (AccountSelectResponse, egui::Response) {
let mut res = AccountSelectResponse::default();
let mut selected_index = app.accounts().get_selected_account_index();
let response = Frame::none()
.outer_margin(8.0)
.show(ui, |ui| {
res = top_section_widget(ui);
scroll_area().show(ui, |ui| {
if let Some(_index) = Self::show_accounts(app, ui) {
selected_index = Some(_index);
res.action = Some(AccountSelectAction::SelectAccount { _index });
}
});
ui.add_space(8.0);
ui.add(add_account_button());
if let Some(_index) = selected_index {
if let Some(account) = app.accounts().get_account(_index) {
ui.add_space(8.0);
if Self::handle_sign_out(app.ndb(), ui, account) {
res.action = Some(AccountSelectAction::RemoveAccount { _index })
}
}
}
ui.add_space(8.0);
})
.response;
(res, response)
}
fn handle_sign_out(ndb: &Ndb, ui: &mut egui::Ui, account: &UserAccount) -> bool {
if let Ok(response) = Self::sign_out_button(ndb, ui, account) {
response.clicked()
} else {
false
}
}
fn show_mobile(ui: &mut egui::Ui) -> egui::Response {
let _ = ui;
todo!()
}
fn show_accounts(app: &mut Damus, ui: &mut egui::Ui) -> Option<usize> {
profile_preview_controller::view_profile_previews(app, ui, account_switcher_card_ui)
}
fn sign_out_button(
ndb: &Ndb,
ui: &mut egui::Ui,
account: &UserAccount,
) -> Result<egui::Response> {
profile_preview_controller::show_with_nickname(
ndb,
ui,
account.pubkey.bytes(),
|ui: &mut egui::Ui, username: &DisplayName| {
let img_data = egui::include_image!("../../assets/icons/signout_icon_4x.png");
let img = Image::new(img_data).fit_to_exact_size(Vec2::new(16.0, 16.0));
let button = egui::Button::image_and_text(
img,
RichText::new(format!(" Sign out @{}", username.username()))
.color(PINK)
.size(16.0),
)
.frame(false);
ui.add(button)
},
)
}
}
fn account_switcher_card_ui(
ui: &mut egui::Ui,
preview: SimpleProfilePreview,
width: f32,
is_selected: bool,
index: usize,
) -> bool {
let resp = ui.add_sized(Vec2::new(width, 50.0), |ui: &mut egui::Ui| {
Frame::none()
.show(ui, |ui| {
ui.add_space(8.0);
ui.horizontal(|ui| {
if is_selected {
Frame::none()
.rounding(Rounding::same(8.0))
.inner_margin(Margin::same(8.0))
.fill(Color32::from_rgb(0x45, 0x1B, 0x59))
.show(ui, |ui| {
ui.add(preview);
ui.with_layout(Layout::right_to_left(Align::Center), |ui| {
ui.add(selection_widget());
});
});
} else {
ui.add_space(8.0);
ui.add(preview);
}
});
})
.response
});
ui.interact(resp.rect, Id::new(index), Sense::click())
.clicked()
}
fn account_switcher_window(open: &'_ mut bool) -> egui::Window<'_> {
egui::Window::new("account switcher")
.title_bar(false)
.collapsible(false)
.anchor(egui::Align2::LEFT_BOTTOM, Vec2::new(4.0, -44.0))
.fixed_size(Vec2::new(360.0, 406.0))
.open(open)
.movable(false)
}
fn selection_widget() -> impl egui::Widget {
|ui: &mut egui::Ui| {
let img_data: egui::ImageSource =
egui::include_image!("../../assets/icons/select_icon_3x.png");
let img = Image::new(img_data).max_size(Vec2::new(16.0, 16.0));
ui.add(img)
}
}
fn top_section_widget(ui: &mut egui::Ui) -> AccountSelectResponse {
ui.horizontal(|ui| {
let resp = AccountSelectResponse::default();
ui.allocate_ui_with_layout(
Vec2::new(ui.available_size_before_wrap().x, 32.0),
Layout::left_to_right(egui::Align::Center),
|ui| ui.add(account_switcher_title()),
);
ui.allocate_ui_with_layout(
Vec2::new(ui.available_size_before_wrap().x, 32.0),
Layout::right_to_left(egui::Align::Center),
|ui| {
if ui.add(manage_accounts_button()).clicked() {
// resp.action = Some(AccountSelectAction::OpenAccountManagement); TODO implement after temporary column impl is finished
}
},
);
resp
})
.inner
}
fn manage_accounts_button() -> egui::Button<'static> {
Button::new(RichText::new("Manage").color(PINK).size(16.0)).frame(false)
}
fn account_switcher_title() -> impl egui::Widget {
|ui: &mut egui::Ui| ui.label(RichText::new("Account switcher").size(20.0).strong())
}
fn scroll_area() -> ScrollArea {
egui::ScrollArea::vertical()
.scroll_bar_visibility(egui::scroll_area::ScrollBarVisibility::AlwaysHidden)
.auto_shrink([false; 2])
}
fn add_account_button() -> egui::Button<'static> {
let img_data = egui::include_image!("../../assets/icons/plus_icon_4x.png");
let img = Image::new(img_data).fit_to_exact_size(Vec2::new(16.0, 16.0));
Button::image_and_text(img, RichText::new(" Add account").size(16.0).color(PINK)).frame(false)
}
mod previews {
use crate::{
test_data,
ui::{Preview, PreviewConfig, View},
Damus,
};
use super::AccountSelectionWidget;
pub struct AccountSelectionPreview {
app: Damus,
}
impl AccountSelectionPreview {
fn new() -> Self {
let app = test_data::test_app();
AccountSelectionPreview { app }
}
}
impl View for AccountSelectionPreview {
fn ui(&mut self, ui: &mut egui::Ui) {
AccountSelectionWidget::ui(&mut self.app, ui);
}
}
impl Preview for AccountSelectionWidget {
type Prev = AccountSelectionPreview;
fn preview(_cfg: PreviewConfig) -> Self::Prev {
AccountSelectionPreview::new()
}
}
}

View File

@@ -1,6 +1,5 @@
pub mod account_login_view;
pub mod account_management;
pub mod account_switcher;
pub mod anim;
pub mod mention;
pub mod note;
@@ -13,7 +12,6 @@ pub mod timeline;
pub mod username;
pub use account_management::AccountsView;
pub use account_switcher::AccountSelectionWidget;
pub use mention::Mention;
pub use note::{NoteResponse, NoteView, PostReplyView, PostView};
pub use preview::{Preview, PreviewApp, PreviewConfig};

View File

@@ -1,6 +1,12 @@
use egui::{Button, Layout, SidePanel, Vec2, Widget};
use crate::{ui::profile_preview_controller, Damus};
use crate::{
account_manager::AccountsRoute,
column::Column,
route::{Route, Router},
ui::profile_preview_controller,
Damus,
};
use super::{ProfilePic, View};
@@ -80,11 +86,29 @@ impl<'a> DesktopSidePanel<'a> {
}
}
pub fn perform_action(app: &mut Damus, action: SidePanelAction) {
pub fn perform_action(router: &mut Router<Route>, action: SidePanelAction) {
match action {
SidePanelAction::Panel => {} // TODO
SidePanelAction::Account => app.show_account_switcher = !app.show_account_switcher,
SidePanelAction::Settings => {} // TODO
SidePanelAction::Account => {
if router
.routes()
.iter()
.any(|&r| r == Route::Accounts(AccountsRoute::Accounts))
{
// return if we are already routing to accounts
router.go_back();
} else {
router.route_to(Route::accounts());
}
}
SidePanelAction::Settings => {
if router.routes().iter().any(|&r| r == Route::Relays) {
// return if we are already routing to accounts
router.go_back();
} else {
router.route_to(Route::relays());
}
}
SidePanelAction::Columns => (), // TODO
}
}
@@ -127,7 +151,7 @@ mod preview {
use crate::{
test_data,
ui::{AccountSelectionWidget, Preview, PreviewConfig},
ui::{Preview, PreviewConfig},
};
use super::*;
@@ -138,7 +162,10 @@ mod preview {
impl DesktopSidePanelPreview {
fn new() -> Self {
let app = test_data::test_app();
let mut app = test_data::test_app();
app.columns
.columns_mut()
.push(Column::new(vec![Route::accounts()]));
DesktopSidePanelPreview { app }
}
}
@@ -153,11 +180,13 @@ mod preview {
strip.cell(|ui| {
let mut panel = DesktopSidePanel::new(&mut self.app);
let response = panel.show(ui);
DesktopSidePanel::perform_action(&mut self.app, response.action);
DesktopSidePanel::perform_action(
self.app.columns.columns_mut()[0].router_mut(),
response.action,
);
});
});
AccountSelectionWidget::ui(&mut self.app, ui);
}
}

View File

@@ -2,9 +2,8 @@ use notedeck::app_creation::{
generate_mobile_emulator_native_options, generate_native_options, setup_cc,
};
use notedeck::ui::{
account_login_view::AccountLoginView, account_management::AccountsView, AccountSelectionWidget,
DesktopSidePanel, PostView, Preview, PreviewApp, PreviewConfig, ProfilePic, ProfilePreview,
RelayView,
account_login_view::AccountLoginView, account_management::AccountsView, DesktopSidePanel,
PostView, Preview, PreviewApp, PreviewConfig, ProfilePic, ProfilePreview, RelayView,
};
use std::env;
@@ -101,7 +100,6 @@ async fn main() {
ProfilePreview,
ProfilePic,
AccountsView,
AccountSelectionWidget,
DesktopSidePanel,
PostView,
);