Merge #1606: gui: reformat Settings > Import/Export view

45bc1b3b655471e86b19511811b7cd3c1842d3cf gui: reformat Settings > Import/Export view (pythcoiner)

Pull request description:

  fixes #1603

  ![image](https://github.com/user-attachments/assets/61254373-1691-453c-a495-94792f2b0447)

ACKs for top commit:
  edouardparis:
    ACK 45bc1b3b655471e86b19511811b7cd3c1842d3cf

Tree-SHA512: 4fd61b889954b19be06ec072b0296763aa5942dc69eb3e07029c1530f0b4890092160961d1b8f408866000e0bd62fd783e979c568c43712d1f36eb091efe0509

liana-gui/src/app/view/settings.rs

@@ -1,6 +1,8 @@
 use std::collections::{HashMap, HashSet};
 use std::str::FromStr;
 
+use iced::alignment::Vertical;
+use iced::widget::{Column, Rule};
 use iced::{
     alignment,
     widget::{radio, scrollable, tooltip as iced_tooltip, Space},
@@ -80,6 +82,34 @@ fn settings_section(
     .style(theme::card::simple)
 }
 
+fn export_section(
+    title: &str,
+    description: &str,
+    icon: liana_ui::widget::Text<'static>,
+    msg: Message,
+) -> Container<'static, Message> {
+    Container::new(
+        Button::new(
+            Row::new()
+                .push(badge::badge(icon))
+                .push(
+                    Column::new()
+                        .push(text(title).bold())
+                        .push(caption(description)),
+                )
+                .padding(10)
+                .spacing(20)
+                .align_y(Alignment::Center)
+                .width(Length::Fill),
+        )
+        .width(Length::Fill)
+        .style(theme::button::transparent_border)
+        .on_press(msg),
+    )
+    .width(Length::Fill)
+    .style(theme::card::simple)
+}
+
 pub fn list(cache: &Cache, is_remote_backend: bool) -> Element<Message> {
     let header = Button::new(text("Settings").size(30).bold())
         .style(theme::button::transparent)
@@ -164,41 +194,56 @@ pub fn bitcoind_settings<'a>(
 pub fn import_export<'a>(cache: &'a Cache, warning: Option<&Error>) -> Element<'a, Message> {
     let header = header("Import/Export", SettingsMessage::ImportExportSection);
 
-    let export_descriptor = settings_section(
-        "Export descriptor",
-        None,
+    let description = Row::new()
+        .push(Space::with_width(15))
+        .push(text(
+            "A collection of the export and import functions present in Liana.",
+        ))
+        .push(Space::with_width(Length::Fill));
+
+    let export_descriptor = export_section(
+        "Descriptor only",
+        "Descriptor file only, to use with other wallets.",
         icon::backup_icon(),
         Message::Settings(SettingsMessage::ExportDescriptor),
     );
 
-    let export_transactions = settings_section(
-        "Export transactions",
-        None,
+    let export_transactions = export_section(
+        "Transactions table",
+        ".CSV file of past transactions, for accounting purposes.",
         icon::backup_icon(),
         Message::Settings(SettingsMessage::ExportTransactions),
     );
 
-    let export_labels = settings_section(
-        "Export labels",
-        None,
+    let export_labels = export_section(
+        "BIP 329 labels",
+        "Bip 329 label export, compatible with other wallets.",
         icon::backup_icon(),
         Message::Settings(SettingsMessage::ExportLabels),
     );
 
-    let export_wallet = settings_section(
+    let export_wallet = export_section(
         "Back up wallet",
-        None,
+        "File with wallet info needed to restore on other devices (no private keys).",
         icon::backup_icon(),
         Message::Settings(SettingsMessage::ExportWallet),
     );
 
-    let import_wallet = settings_section(
+    let import_wallet = export_section(
         "Restore wallet",
-        None,
+        "Upload a backup file to update wallet info.",
         icon::restore_icon(),
         Message::Settings(SettingsMessage::ImportWallet),
     );
 
+    let separator = Row::new()
+        .push(Space::with_width(30))
+        .push(text("Other formats"))
+        .push(Space::with_width(15))
+        .push(Rule::horizontal(2))
+        .push(Space::with_width(30))
+        .align_y(Vertical::Center);
+
     dashboard(
         &Menu::Settings,
         cache,
@@ -206,11 +251,13 @@ pub fn import_export<'a>(cache: &'a Cache, warning: Option<&Error>) -> Element<'
         Column::new()
             .spacing(20)
             .push(header)
-            .push(export_descriptor)
-            .push(export_transactions)
-            .push(export_labels)
+            .push(description)
             .push(export_wallet)
             .push(import_wallet)
+            .push(separator)
+            .push(export_labels)
+            .push(export_transactions)
+            .push(export_descriptor)
             .width(Length::Fill),
     )
 }

liana-ui/src/theme/mod.rs

@@ -12,6 +12,7 @@ pub mod pill;
 pub mod progress_bar;
 pub mod qr_code;
 pub mod radio;
+pub mod rule;
 pub mod scrollable;
 pub mod slider;
 pub mod svg;

liana-ui/src/theme/palette.rs

@@ -15,6 +15,7 @@ pub struct Palette {
     pub radio_buttons: RadioButtons,
     pub sliders: Sliders,
     pub progress_bars: ProgressBars,
+    pub rule: iced::Color,
 }
 
 #[derive(Debug, Copy, Clone, PartialEq)]
@@ -503,6 +504,7 @@ impl std::default::Default for Palette {
                 border: color::TRANSPARENT.into(),
                 background: color::GREY_6,
             },
+            rule: color::GREY_1,
         }
     }
 }

liana-ui/src/theme/rule.rs

@@ -0,0 +1,25 @@
+use iced::widget::rule::{Catalog, FillMode, Style, StyleFn};
+
+use super::Theme;
+
+impl Catalog for Theme {
+    type Class<'a> = StyleFn<'a, Self>;
+
+    fn default<'a>() -> Self::Class<'a> {
+        Box::new(default)
+    }
+
+    fn style(&self, class: &Self::Class<'_>) -> Style {
+        class(self)
+    }
+}
+
+/// The default styling of a [`Rule`].
+pub fn default(theme: &Theme) -> Style {
+    Style {
+        color: theme.colors.rule,
+        width: 2,
+        radius: 0.0.into(),
+        fill_mode: FillMode::Full,
+    }
+}