FirmwareView: use Adw.NavigationView (#381)

Author: danirabbit

src/Views/FirmwareReleaseView.vala

@@ -1,11 +1,11 @@
 /*
  * SPDX-License-Identifier: GPL-3.0-or-later
- * SPDX-FileCopyrightText: 2021-2023 elementary, Inc. (https://elementary.io)
+ * SPDX-FileCopyrightText: 2021-2025 elementary, Inc. (https://elementary.io)
  *
  * Authored by: Marius Meisenzahl <mariusmeisenzahl@gmail.com>
  */
 
-public class About.FirmwareReleaseView : Gtk.Box {
+public class About.FirmwareReleaseView : Adw.NavigationPage {
     public signal void update (Fwupd.Device device, Fwupd.Release release);
 
     private Fwupd.Device device;
@@ -22,29 +22,22 @@ public class About.FirmwareReleaseView : Gtk.Box {
     private Gtk.Label vendor_value_label;
     private Gtk.Label size_value_label;
     private Gtk.Label install_duration_value_label;
-    private Adw.Leaflet? deck;
 
     construct {
         var back_button = new Gtk.Button.with_label (_("All Updates")) {
-            halign = START,
-            margin_top = 6,
-            margin_end = 6,
-            margin_bottom = 6,
-            margin_start = 6,
+            action_name = "navigation.pop",
+            halign = START
         };
         back_button.add_css_class (Granite.STYLE_CLASS_BACK_BUTTON);
 
         title_label = new Gtk.Label ("") {
             ellipsize = END,
             use_markup = true
         };
+        title_label.add_css_class ("title");
 
         update_button = new Gtk.Button.with_label ("") {
             halign = END,
-            margin_top = 6,
-            margin_end = 6,
-            margin_bottom = 6,
-            margin_start = 6,
             sensitive = false
         };
         update_button.add_css_class (Granite.STYLE_CLASS_SUGGESTED_ACTION);
@@ -53,12 +46,13 @@ public class About.FirmwareReleaseView : Gtk.Box {
             child = update_button
         };
 
-        var header_box = new Gtk.CenterBox () {
+        var header_bar = new Gtk.HeaderBar () {
             hexpand = true,
-            start_widget = back_button,
-            center_widget = title_label,
-            end_widget = update_button_revealer
+            show_title_buttons = false,
+            title_widget = title_label
         };
+        header_bar.pack_start (back_button);
+        header_bar.pack_end (update_button_revealer);
 
         summary_label = new Gtk.Label ("") {
             halign = START,
@@ -151,20 +145,20 @@ public class About.FirmwareReleaseView : Gtk.Box {
         stack.add_child (placeholder);
         stack.add_child (scrolled_window);
 
-        orientation = VERTICAL;
-        add_css_class (Granite.STYLE_CLASS_VIEW);
-        append (header_box);
-        append (new Gtk.Separator (HORIZONTAL));
-        append (stack);
+        var toolbarview = new Adw.ToolbarView () {
+            content = stack,
+            top_bar_style = RAISED_BORDER
+        };
+        toolbarview.add_top_bar (header_bar);
 
-        back_button.clicked.connect (() => {
-            go_back ();
-        });
+        child = toolbarview;
 
         update_button.clicked.connect (() => {
-            go_back ();
+            activate_action ("navigation.pop", null);
             update (device, release);
         });
+
+        bind_property ("title", title_label, "label");
     }
 
     public void update_view (Fwupd.Device device, Fwupd.Release? release) {
@@ -173,7 +167,7 @@ public class About.FirmwareReleaseView : Gtk.Box {
 
         var device_name = device.get_name ();
 
-        title_label.label = "<b>%s</b>".printf (device_name);
+        title = device_name;
         update_button_revealer.reveal_child = release != null;
 
         if (release == null) {
@@ -233,12 +227,4 @@ public class About.FirmwareReleaseView : Gtk.Box {
             ).printf (duration_minutes);
         }
     }
-
-    private void go_back () {
-        if (deck == null) {
-            deck = (Adw.Leaflet) get_ancestor (typeof (Adw.Leaflet));
-        }
-
-        deck.navigate (BACK);
-    }
 }

src/Views/FirmwareView.vala

@@ -21,7 +21,7 @@
 
 public class About.FirmwareView : Switchboard.SettingsPage {
     private Gtk.Stack stack;
-    private Adw.Leaflet deck;
+    private Adw.NavigationView navigation_view;
     private FirmwareReleaseView firmware_release_view;
     private Granite.Placeholder progress_alert_view;
     private Granite.Placeholder placeholder_alert_view;
@@ -60,20 +60,18 @@ public class About.FirmwareView : Switchboard.SettingsPage {
             child = update_list
         };
 
+        var update_page = new Adw.NavigationPage (update_scrolled, _("All Updates"));
+
         firmware_release_view = new FirmwareReleaseView ();
 
-        deck = new Adw.Leaflet () {
-            can_navigate_back = true,
-            can_unfold = false
-        };
-        deck.append (update_scrolled);
-        deck.append (firmware_release_view);
-        deck.visible_child = update_scrolled;
+        navigation_view = new Adw.NavigationView ();
+        navigation_view.add (update_page);
+        navigation_view.add_css_class (Granite.STYLE_CLASS_VIEW);
 
         stack = new Gtk.Stack () {
             transition_type = Gtk.StackTransitionType.SLIDE_LEFT_RIGHT
         };
-        stack.add_child (deck);
+        stack.add_child (navigation_view);
         stack.add_child (progress_alert_view);
 
         var frame = new Gtk.Frame (null) {
@@ -120,7 +118,7 @@ public class About.FirmwareView : Switchboard.SettingsPage {
             placeholder_alert_view.description = _("Please make sure “fwupd” is installed and enabled.");
         }
 
-        stack.visible_child = deck;
+        stack.visible_child = navigation_view;
     }
 
     private void add_device (Fwupd.Device device) {
@@ -161,7 +159,7 @@ public class About.FirmwareView : Switchboard.SettingsPage {
         if (widget is Widgets.FirmwareUpdateRow) {
             var row = (Widgets.FirmwareUpdateRow) widget;
             firmware_release_view.update_view (row.device, row.release);
-            deck.visible_child = firmware_release_view;
+            navigation_view.push (firmware_release_view);
         }
     }
 
@@ -170,7 +168,7 @@ public class About.FirmwareView : Switchboard.SettingsPage {
 
         add_device (device);
 
-        stack.visible_child = deck;
+        stack.visible_child = navigation_view;
     }
 
     private void on_device_removed (Fwupd.Client client, Fwupd.Device device) {
@@ -245,7 +243,7 @@ public class About.FirmwareView : Switchboard.SettingsPage {
                 if (response == Gtk.ResponseType.ACCEPT) {
                     continue_update.begin (device, release);
                 } else {
-                    stack.visible_child = deck;
+                    stack.visible_child = navigation_view;
                     return;
                 }
             });
@@ -293,7 +291,7 @@ public class About.FirmwareView : Switchboard.SettingsPage {
             show_error_dialog (device, e.message);
         }
 
-        stack.visible_child = deck;
+        stack.visible_child = navigation_view;
         update_list_view.begin ();
     }