MainWindow: use Adw.NavigationView

README.md

@@ -9,9 +9,9 @@ GitHub Issue Reporter
 
 You'll need the following dependencies:
 * libappstream-dev (>=1.0.0)
-* libgranite-7-dev (>=7.0.0)
+* libgranite-7-dev (>=7.7.0)
 * libgtk-4-dev (>=4.10)
-* libadwaita-1-dev (>=1.0.0)
+* libadwaita-1-dev (>=1.4.0)
 * meson
 * valac
 

meson.build

@@ -32,9 +32,9 @@ executable(
         appstream_dep,
         dependency('glib-2.0'),
         dependency('gobject-2.0'),
-        dependency('granite-7', version: '>=7.0.0'),
+        dependency('granite-7', version: '>=7.7.0'),
         dependency('gtk4', version: '>= 4.10'),
-        dependency('libadwaita-1', version: '>=1.0.0')
+        dependency('libadwaita-1', version: '>=1.4.0')
     ],
     install : true
 )

src/MainWindow.vala

@@ -71,13 +71,14 @@ public class Feedback.MainWindow : Gtk.ApplicationWindow {
         category_list.append (settings_category);
         category_list.append (system_category);
 
-        var back_button = new Gtk.Button.with_label (_("Categories")) {
+        var category_page = new Adw.NavigationPage (category_list, _("Categories"));
+
+        var back_button = new Granite.BackButton (_("Categories")) {
             halign = Gtk.Align.START,
             margin_top = 6,
             margin_bottom = 6,
             margin_start = 6
         };
-        back_button.add_css_class (Granite.STYLE_CLASS_BACK_BUTTON);
 
         var category_title = new Gtk.Label ("") {
             hexpand = true,
@@ -204,17 +205,15 @@ public class Feedback.MainWindow : Gtk.ApplicationWindow {
         repo_list_box.append (new Gtk.Separator (Gtk.Orientation.HORIZONTAL));
         repo_list_box.append (scrolled);
 
-        var leaflet = new Adw.Leaflet () {
-            can_navigate_back = true,
-            can_unfold = false,
-            hexpand = true,
+        var components_page = new Adw.NavigationPage (repo_list_box , _("Components"));
+
+        var navigation_view = new Adw.NavigationView () {
             vexpand = true
         };
-        leaflet.append (category_list);
-        leaflet.append (repo_list_box);
+        navigation_view.add (category_page);
 
         var frame = new Gtk.Frame (null) {
-            child = leaflet,
+            child = navigation_view,
             margin_top = 12
         };
 
@@ -273,18 +272,21 @@ public class Feedback.MainWindow : Gtk.ApplicationWindow {
             gtk_settings.gtk_application_prefer_dark_theme = granite_settings.prefers_color_scheme == Granite.Settings.ColorScheme.DARK;
         });
 
+        components_page.bind_property ("title", category_title, "label", SYNC_CREATE);
+
         category_list.row_activated.connect ((row) => {
-            leaflet.visible_child = repo_list_box;
+            navigation_view.push (components_page);
+
             category_filter = ((CategoryRow) row).category;
-            category_title.label = category_filter.to_string ();
+            components_page.title = category_filter.to_string ();
+
             listbox.invalidate_filter ();
             var adjustment = scrolled.get_vadjustment ();
             adjustment.set_value (adjustment.lower);
         });
 
         back_button.clicked.connect (() => {
             category_list.select_row (null);
-            leaflet.navigate (BACK);
         });
 
         listbox.selected_rows_changed.connect (() => {
@@ -311,22 +313,23 @@ public class Feedback.MainWindow : Gtk.ApplicationWindow {
         search_entry.search_changed.connect (() => {
             if (search_entry.text != "") {
                 placeholder.title = _("No results found for “%s”").printf (search_entry.text);
-                leaflet.visible_child = repo_list_box;
-                category_title.label = "";
+                components_page.title = _("Search Results");
+
+                if (navigation_view.visible_page != components_page) {
+                    navigation_view.push (components_page);
+                }
             } else if (category_list.get_selected_row () == null) {
-                leaflet.visible_child = category_list;
+                navigation_view.pop ();
             } else if (category_filter != null) {
-                category_title.label = category_filter.to_string ();
+                components_page.title = category_filter.to_string ();
             }
 
             listbox.invalidate_filter ();
         });
 
-        leaflet.notify["child-transition-running"].connect (() => {
-            if (!leaflet.child_transition_running && leaflet.visible_child == category_list) {
-                listbox.select_row (null);
-                search_entry.text = "";
-            }
+        navigation_view.popped.connect (() => {
+            listbox.select_row (null);
+            search_entry.text = "";
         });
     }