ui: title panel dual content mode, title for wallet tabs

src/gui/views/network/content.rs

@@ -21,7 +21,7 @@ use crate::gui::icons::{CARDHOLDER, DATABASE, DOTS_THREE_OUTLINE_VERTICAL, FACTO
 use crate::gui::platform::PlatformCallbacks;
 use crate::gui::views::{ConnectionsContent, NetworkMetrics, NetworkMining, NetworkNode, NetworkSettings, Root, TitlePanel, View};
 use crate::gui::views::network::types::{NetworkTab, NetworkTabType};
-use crate::gui::views::types::TitleType;
+use crate::gui::views::types::{TitleContentType, TitleType};
 use crate::node::Node;
 use crate::wallet::ExternalConnection;
 
@@ -197,13 +197,13 @@ impl NetworkContent {
         let subtitle_text = Node::get_sync_status_text();
         let not_syncing = Node::not_syncing();
         let title_content = if !show_connections {
-            TitleType::WithSubTitle(title_text, subtitle_text, !not_syncing)
+            TitleContentType::WithSubTitle(title_text, subtitle_text, !not_syncing)
         } else {
-            TitleType::Single(t!("network.connections").to_uppercase(), false)
+            TitleContentType::Title(t!("network.connections").to_uppercase())
         };
 
         // Draw title panel.
-        TitlePanel::ui(title_content, |ui, _| {
+        TitlePanel::ui(TitleType::Single(title_content), |ui, _| {
             if !show_connections {
                 View::title_button(ui, DOTS_THREE_OUTLINE_VERTICAL, || {
                     AppConfig::toggle_show_connections_network_panel();

src/gui/views/title_panel.rs

@@ -14,10 +14,10 @@
 
 use egui::{Color32, Id, lerp, Rgba};
 use egui::style::Margin;
-use egui_extras::{Size, StripBuilder};
+use egui_extras::{Size, Strip, StripBuilder};
 
 use crate::gui::Colors;
-use crate::gui::views::types::TitleType;
+use crate::gui::views::types::{TitleContentType, TitleType};
 use crate::gui::views::{Root, View};
 
 /// Title panel with left/right action buttons and text in the middle.
@@ -32,10 +32,27 @@ impl TitlePanel {
               mut right_content: impl FnMut(&mut egui::Ui, &mut eframe::Frame),
               ui: &mut egui::Ui,
               frame: &mut eframe::Frame) {
-        // Setup identifier and alignment.
+        // Setup identifier and title type.
-        let (id, align_left) = match &title {
+        let (id, dual_title) = match &title {
-            TitleType::Single(text, align_left) => (Id::from(text.clone()), *align_left),
+            TitleType::Single(content) => {
-            TitleType::WithSubTitle(text, _, _) => (Id::from(text.clone()), false)
+                let text = match content {
+                    TitleContentType::Title(text) => text,
+                    TitleContentType::WithSubTitle(text, _, _) => text
+                };
+                (Id::from(text.clone()), false)
+            },
+            TitleType::Dual(first, second) => {
+                let first_text = match first {
+                    TitleContentType::Title(text) => text,
+                    TitleContentType::WithSubTitle(text, _, _) => text
+                };
+                let second_text = match first {
+                    TitleContentType::Title(text) => text,
+                    TitleContentType::WithSubTitle(text, _, _) => text
+                };
+                let id = Id::from(format!("{}_{}", first_text, second_text));
+                (id, true)
+            },
         };
         // Draw title panel.
         egui::TopBottomPanel::top(id)
@@ -49,12 +66,17 @@ impl TitlePanel {
             .show_inside(ui, |ui| {
                 StripBuilder::new(ui)
                     .size(Size::exact(Self::DEFAULT_HEIGHT))
-                    .size(if align_left {
+                    .size(if dual_title {
                         Size::exact(Root::SIDE_PANEL_WIDTH - 2.0 * Self::DEFAULT_HEIGHT)
                     } else {
                         Size::remainder()
                     })
-                    .size(if align_left {
+                    .size(if dual_title {
+                        Size::exact(Self::DEFAULT_HEIGHT * 2.0)
+                    } else {
+                        Size::exact(0.0)
+                    })
+                    .size(if dual_title {
                         Size::remainder()
                     } else {
                         Size::exact(0.0)
@@ -67,22 +89,19 @@ impl TitlePanel {
                                 (left_content)(ui, frame);
                             });
                         });
+                        // Draw title text content.
                         match title {
-                            TitleType::Single(text, _) => {
+                            TitleType::Single(content) => {
-                                strip.cell(|ui| {
+                                Self::title_text_content(&mut strip, content);
-                                    ui.add_space(2.0);
+                                strip.empty();
-                                    ui.centered_and_justified(|ui| {
+                                strip.empty();
-                                        View::ellipsize_text(ui, text, 19.0, Colors::TITLE);
-                                    });
-                                });
                             }
-                            TitleType::WithSubTitle(text, subtitle_text, animate_sub) => {
+                            TitleType::Dual(first, second) => {
-                                strip.strip(|builder| {
+                                Self::title_text_content(&mut strip, first);
-                                    Self::with_sub_title(builder, text, subtitle_text, animate_sub);
+                                strip.empty();
-                                });
+                                Self::title_text_content(&mut strip, second);
                             }
                         }
-                        strip.empty();
                         strip.cell(|ui| {
                             // Draw right panel action content.
                             ui.centered_and_justified(|ui| {
@@ -93,6 +112,25 @@ impl TitlePanel {
             });
     }
 
+    /// Setup title text content.
+    fn title_text_content(strip: &mut Strip, content: TitleContentType) {
+        match content {
+            TitleContentType::Title(text) => {
+                strip.cell(|ui| {
+                    ui.add_space(2.0);
+                    ui.centered_and_justified(|ui| {
+                        View::ellipsize_text(ui, text, 19.0, Colors::TITLE);
+                    });
+                });
+            }
+            TitleContentType::WithSubTitle(text, subtitle, animate) => {
+                strip.strip(|builder| {
+                    Self::with_sub_title(builder, text, subtitle, animate);
+                });
+            }
+        }
+    }
+
     /// Calculate inner margin based on display insets (cutouts).
     fn inner_margin(ui: &mut egui::Ui, frame: &mut eframe::Frame) -> Margin {
         Margin {

src/gui/views/types.rs

@@ -15,11 +15,19 @@
 use crate::gui::platform::PlatformCallbacks;
 use crate::gui::views::Modal;
 
-/// Title content type, can be single title or with animated subtitle.
+/// Title type, can be single or dual title in the row.
 pub enum TitleType {
-    /// Single text with possibility to align text at left side for default panel size width.
+    /// Single title content.
-    Single(String, bool),
+    Single(TitleContentType),
-    /// With animated subtitle text.
+    /// Dual title content, will align first content for default panel size width.
+    Dual(TitleContentType, TitleContentType),
+}
+
+/// Title content type, can be single title or with animated subtitle.
+pub enum TitleContentType {
+    /// Single text.
+    Title(String),
+    /// With optionally animated subtitle text.
     WithSubTitle(String, String, bool)
 }
 

src/gui/views/wallets/content.rs

@@ -21,8 +21,9 @@ use crate::gui::Colors;
 use crate::gui::icons::{ARROW_LEFT, CARET_RIGHT, COMPUTER_TOWER, EYE, EYE_SLASH, FOLDER_LOCK, FOLDER_OPEN, GEAR, GLOBE, GLOBE_SIMPLE, LOCK_KEY, PLUS, SIDEBAR_SIMPLE, SPINNER, SUITCASE, WARNING_CIRCLE};
 use crate::gui::platform::PlatformCallbacks;
 use crate::gui::views::{Modal, Root, TitlePanel, View};
-use crate::gui::views::types::{ModalContainer, ModalPosition, TitleType};
+use crate::gui::views::types::{ModalContainer, ModalPosition, TitleContentType, TitleType};
 use crate::gui::views::wallets::creation::WalletCreation;
+use crate::gui::views::wallets::types::WalletTabType;
 use crate::gui::views::wallets::WalletContent;
 use crate::wallet::{ConnectionsConfig, ExternalConnection, Wallet, WalletList};
 
@@ -231,19 +232,35 @@ impl WalletsContent {
         let show_list = self.show_wallets_at_dual_panel;
 
         // Setup title.
-        let title_text = if create_wallet {
-            t!("wallets.add")
-        } else {
-            t!("wallets.title")
-        };
         let title_content = if self.wallets.is_selected_open() && (!dual_panel
             || (dual_panel && !show_list)) {
-            let title_text = t!("wallets.wallet").to_uppercase();
+            let title_text = self.wallet_content.current_tab.get_type().name().to_uppercase();
-            let subtitle_text = self.wallets.selected_name();
+            if self.wallet_content.current_tab.get_type() == WalletTabType::Settings {
-            TitleType::WithSubTitle(title_text, subtitle_text, false)
+                TitleType::Single(TitleContentType::Title(title_text))
+            } else {
+                let subtitle_text = self.wallets.selected_name();
+                TitleType::Single(TitleContentType::WithSubTitle(title_text, subtitle_text, false))
+            }
         } else {
-            let left_title_align = !create_wallet && show_wallet && dual_panel;
+            let title_text = if create_wallet {
-            TitleType::Single(title_text.to_uppercase(), left_title_align)
+                t!("wallets.add")
+            } else {
+                t!("wallets.title")
+            }.to_uppercase();
+            let dual_title = !create_wallet && show_wallet && dual_panel;
+            if dual_title {
+                let wallet_tab_type = self.wallet_content.current_tab.get_type();
+                let wallet_tab_name = wallet_tab_type.name().to_uppercase();
+                let title_content = if wallet_tab_type == WalletTabType::Settings {
+                    TitleContentType::Title(wallet_tab_name)
+                } else {
+                    let subtitle_text = self.wallets.selected_name();
+                    TitleContentType::WithSubTitle(wallet_tab_name, subtitle_text, false)
+                };
+                TitleType::Dual(TitleContentType::Title(title_text), title_content)
+            } else {
+                TitleType::Single(TitleContentType::Title(title_text))
+            }
         };
 
         // Draw title panel.

src/gui/views/wallets/wallet/types.rs

@@ -35,13 +35,13 @@ pub enum WalletTabType {
 }
 
 impl WalletTabType {
-    /// Identifier representing wallet tab type.
+    /// Name of wallet tab to show at ui.
-    pub fn id(&self) -> String {
+    pub fn name(&self) -> String {
         match *self {
-            WalletTabType::Info => "info".to_owned(),
+            WalletTabType::Info => t!("wallets.wallet"),
-            WalletTabType::Receive => "receive".to_owned(),
+            WalletTabType::Receive => t!("wallets.receive"),
-            WalletTabType::Send => "send".to_owned(),
+            WalletTabType::Send => t!("wallets.send"),
-            WalletTabType::Settings => "settings".to_owned()
+            WalletTabType::Settings => t!("wallets.settings")
         }
     }
 }