Port to Gtk 4

.github/workflows/main.yml

@@ -20,7 +20,7 @@ jobs:
     - name: Install Dependencies
       run: |
         apt update
-        apt install -y gettext libappstream-dev libflatpak-dev libgee-0.8-dev libgranite-dev libgtk-3-dev libhandy-1-dev libjson-glib-dev libpackagekit-glib2-dev libsoup2.4-dev libxml2-dev libxml2-utils libpolkit-gobject-1-dev meson valac
+        apt install -y gettext libadwaita-1-dev libappstream-dev libflatpak-dev libgee-0.8-dev libgranite-7-dev libgtk-4-dev libjson-glib-dev libpackagekit-glib2-dev libsoup2.4-dev libxml2-dev libxml2-utils libpolkit-gobject-1-dev meson valac
     - name: Build
       env:
         DESTDIR: out

README.md

@@ -9,12 +9,12 @@ An open, pay-what-you-want app store for indie developers.
 
 You'll need the following dependencies:
 * gettext
-* libappstream-dev (>= 0.10)
-* libflatpak-dev
+* libadwaita-1-dev
+* libappstream-dev (>= 0.15.2)
+* libflatpak-dev (>= 1.0.7)
 * libgee-0.8-dev
-* libgranite-dev (>=5.2.5)
-* libgtk-3-dev
-* libhandy-1-dev (>=1.3.0)
+* libgranite-7-dev (>=7.1.0)
+* libgtk-4-dev
 * libjson-glib-dev
 * libpackagekit-glib2-dev
 * libpolkit-gobject-1-dev
@@ -32,7 +32,7 @@ Run `meson build` to configure the build environment. Change to the build direct
 
 To install, use `ninja install`, then execute with `io.elementary.appcenter`
 
-    sudo ninja install
+    ninja install
     io.elementary.appcenter
 
 ## Debugging

data/icons/categories.gresource.xml

@@ -1,32 +1,31 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <gresources>
   <gresource prefix="/io/elementary/appcenter/icons">
-    <file alias="applications-accessibility-symbolic.svg" compressed="true" preprocess="xml-stripblanks">applications-accessibility-symbolic.svg</file>
-    <file alias="applications-audio-symbolic.svg" compressed="true" preprocess="xml-stripblanks">applications-audio-symbolic.svg</file>
-    <file alias="applications-games-symbolic.svg" compressed="true" preprocess="xml-stripblanks">applications-games-symbolic.svg</file>
-    <file alias="applications-office-symbolic.svg" compressed="true" preprocess="xml-stripblanks">applications-office-symbolic.svg</file>
-    <file alias="applications-video-rtl-symbolic.svg" compressed="true" preprocess="xml-stripblanks">applications-video-rtl-symbolic.svg</file>
-    <file alias="applications-video-symbolic-rtl.svg" compressed="true" preprocess="xml-stripblanks">applications-video-rtl-symbolic.svg</file>
-    <file alias="applications-video-symbolic.svg" compressed="true" preprocess="xml-stripblanks">applications-video-symbolic.svg</file>
-    <file compressed="true" preprocess="xml-stripblanks">currency-dollar-symbolic.svg</file>
+    <file alias="16x16/categories/applications-accessibility-symbolic.svg" compressed="true" preprocess="xml-stripblanks">applications-accessibility-symbolic.svg</file>
+    <file alias="16x16/categories/applications-audio-symbolic.svg" compressed="true" preprocess="xml-stripblanks">applications-audio-symbolic.svg</file>
+    <file alias="16x16/categories/applications-games-symbolic.svg" compressed="true" preprocess="xml-stripblanks">applications-games-symbolic.svg</file>
+    <file alias="16x16/categories/applications-office-symbolic.svg" compressed="true" preprocess="xml-stripblanks">applications-office-symbolic.svg</file>
+    <file alias="16x16/categories/applications-video-symbolic-rtl.svg" compressed="true" preprocess="xml-stripblanks">applications-video-rtl-symbolic.svg</file>
+    <file alias="16x16/categories/applications-video-symbolic.svg" compressed="true" preprocess="xml-stripblanks">applications-video-symbolic.svg</file>
+    <file alias="16x16/categories/currency-dollar-symbolic.svg" compressed="true" preprocess="xml-stripblanks">currency-dollar-symbolic.svg</file>
     <file alias="online-account-facebook.svg" compressed="true" preprocess="xml-stripblanks">online-account-facebook.svg</file>
-    <file compressed="true" preprocess="xml-stripblanks">internet-mail-symbolic.svg</file>
+    <file alias="16x16/apps/internet-mail-symbolic.svg"compressed="true" preprocess="xml-stripblanks">internet-mail-symbolic.svg</file>
     <file alias="online-account-reddit.svg" compressed="true" preprocess="xml-stripblanks">online-account-reddit.svg</file>
     <file alias="online-account-tumblr.svg" compressed="true" preprocess="xml-stripblanks">online-account-tumblr.svg</file>
     <file alias="online-account-twitter.svg" compressed="true" preprocess="xml-stripblanks">online-account-twitter.svg</file>
     <file alias="online-account-telegram.svg" compressed="true" preprocess="xml-stripblanks">online-account-telegram.svg</file>
-    <file alias="text-x-copying-symbolic.svg" compressed="true" preprocess="xml-stripblanks">text-x-copying-symbolic.svg</file>
+    <file alias="16x16/mimetypes/text-x-copying-symbolic.svg" compressed="true" preprocess="xml-stripblanks">text-x-copying-symbolic.svg</file>
 
-    <file alias="flatpak-eol-symbolic.svg" compressed="true" preprocess="xml-stripblanks">oars/old-runtime.svg</file>
+    <file alias="32x32/categories/flatpak-eol-symbolic.svg" compressed="true" preprocess="xml-stripblanks">oars/old-runtime.svg</file>
 
-    <file alias="oars-chat-symbolic.svg" compressed="true" preprocess="xml-stripblanks">oars/chat.svg</file>
-    <file alias="oars-conflict-symbolic.svg" compressed="true" preprocess="xml-stripblanks">oars/conflict.svg</file>
-    <file alias="oars-gambling-symbolic.svg" compressed="true" preprocess="xml-stripblanks">oars/gambling.svg</file>
-    <file alias="oars-offensive-language-symbolic.svg" compressed="true" preprocess="xml-stripblanks">oars/language.svg</file>
-    <file alias="oars-sex-nudity-symbolic.svg" compressed="true" preprocess="xml-stripblanks">oars/nudity.svg</file>
-    <file alias="oars-socal-info-symbolic.svg" compressed="true" preprocess="xml-stripblanks">oars/social-info.svg</file>
-    <file alias="oars-illicit-substance-symbolic.svg" compressed="true" preprocess="xml-stripblanks">oars/substance.svg</file>
-    <file alias="oars-violence-symbolic.svg" compressed="true" preprocess="xml-stripblanks">oars/violence.svg</file>
+    <file alias="16x16/categories/oars-chat-symbolic.svg" compressed="true" preprocess="xml-stripblanks">oars/chat.svg</file>
+    <file alias="16x16/categories/oars-conflict-symbolic.svg" compressed="true" preprocess="xml-stripblanks">oars/conflict.svg</file>
+    <file alias="16x16/categories/oars-gambling-symbolic.svg" compressed="true" preprocess="xml-stripblanks">oars/gambling.svg</file>
+    <file alias="16x16/categories/oars-offensive-language-symbolic.svg" compressed="true" preprocess="xml-stripblanks">oars/language.svg</file>
+    <file alias="16x16/categories/oars-sex-nudity-symbolic.svg" compressed="true" preprocess="xml-stripblanks">oars/nudity.svg</file>
+    <file alias="32x32/categories/oars-socal-info-symbolic.svg" compressed="true" preprocess="xml-stripblanks">oars/social-info.svg</file>
+    <file alias="16x16/categories/oars-illicit-substance-symbolic.svg" compressed="true" preprocess="xml-stripblanks">oars/substance.svg</file>
+    <file alias="32x32/categories/oars-violence-symbolic.svg" compressed="true" preprocess="xml-stripblanks">oars/violence.svg</file>
   </gresource>
   <gresource prefix="/io/elementary/appcenter/backgrounds">
     <file alias="audio.svg" compressed="true" preprocess="xml-stripblanks">audio.svg</file>

data/io.elementary.appcenter.gschema.xml

@@ -6,10 +6,15 @@
       <summary>Whether the window was maximized on last run</summary>
       <description>Whether the window was maximized on last run</description>
     </key>
-    <key name="window-size" type="(ii)">
-      <default>(1100, 660)</default>
-      <summary>Most recent window size</summary>
-      <description>Most recent window size (width, height)</description>
+    <key name="window-height" type="i">
+      <default>660</default>
+      <summary>Most recent window height</summary>
+      <description>Most recent window height</description>
+    </key>
+    <key name="window-width" type="i">
+      <default>1024</default>
+      <summary>Most recent window width</summary>
+      <description>Most recent window width</description>
     </key>
     <key type="b" name="developer-mode">
       <default>false</default>

data/styles/arrow.css

@@ -29,6 +29,7 @@
     margin: 12px;
     padding: 6px;
     color: @text_color;
+    -gtk-icon-size: 24px;
 }
 
 .arrow:active,

data/styles/categories.css

@@ -604,7 +604,7 @@
         radial-gradient(
             circle,
             alpha(@STRAWBERRY_900, 0) 65%,
-            alpha(shade(@STRAWBERRY_900, 0.6), 0.35) 4%
+            alpha(shade(@STRAWBERRY_900, 0.6), 0.35) 66%
         ),
         linear-gradient(
             to bottom,
@@ -656,19 +656,19 @@
     background-image:
         linear-gradient(
             to right,
-            transparent 42px,
-            alpha(@STRAWBERRY_100, 0.25) 42px,
-            alpha(@STRAWBERRY_100, 0.25) 44px,
-            transparent 44px
+            transparent 1.3em,
+            alpha(@STRAWBERRY_100, 0.25) 1.3em,
+            alpha(@STRAWBERRY_100, 0.25) calc(1.3em + 2px),
+            transparent calc(1.3em + 2px)
         ),
         linear-gradient(
             to bottom,
-            white 90%,
-            alpha(@BLUEBERRY_100, 0.2) 90%
+            transparent 0.9em,
+            alpha(@BLUEBERRY_100, 0.2) 0.9em
         );
-    background-position: center center;
-    background-repeat: repeat-y;
-    background-size: 100% 1em;
+    background-position: center center, center 0.7em;
+    background-repeat: no-repeat, repeat-y;
+    background-size: auto auto, 110% 1em; /* Gtk.CSS bug requiring over 100% width maybe? */
     color: @BLACK_300;
     font-size: 24px;
 }

meson.build

@@ -10,7 +10,6 @@ i18n = import('i18n')
 
 add_project_arguments(
     '-DGETTEXT_PACKAGE="@0@"'.format(gettext_name),
-    '-DHANDY_USE_UNSTABLE_API',
     '-DI_KNOW_THE_PACKAGEKIT_GLIB2_API_IS_SUBJECT_TO_CHANGE',
     language:'c'
 )
@@ -20,9 +19,9 @@ add_project_arguments(['--vapidir', vapi_dir], language: 'vala')
 
 glib = dependency ('glib-2.0')
 gee = dependency ('gee-0.8')
-gtk = dependency ('gtk+-3.0', version: '>=3.10')
-granite = dependency ('granite', version: '>=6.0.0')
-handy = dependency('libhandy-1', version: '>=1.4.0')
+gtk = dependency ('gtk4')
+granite = dependency ('granite-7', version: '>=7.1.0')
+adwaita = dependency('libadwaita-1')
 packagekit = dependency ('packagekit-glib2')
 appstream = dependency ('appstream', version: '>=0.15.2')
 libsoup = dependency ('libsoup-2.4')
@@ -39,7 +38,7 @@ dependencies = [
     gee,
     gtk,
     granite,
-    handy,
+    adwaita,
     packagekit,
     appstream,
     libsoup,

src/Application.vala

@@ -113,8 +113,6 @@ public class AppCenter.App : Gtk.Application {
     protected override void startup () {
         base.startup ();
 
-        Hdy.init ();
-
         var granite_settings = Granite.Settings.get_default ();
         var gtk_settings = Gtk.Settings.get_default ();
 
@@ -126,16 +124,16 @@ public class AppCenter.App : Gtk.Application {
 
         var provider = new Gtk.CssProvider ();
         provider.load_from_resource ("io/elementary/appcenter/application.css");
-        Gtk.StyleContext.add_provider_for_screen (
-            Gdk.Screen.get_default (),
+        Gtk.StyleContext.add_provider_for_display (
+            Gdk.Display.get_default (),
             provider,
             Gtk.STYLE_PROVIDER_PRIORITY_APPLICATION
         );
 
         var fallback_provider = new Gtk.CssProvider ();
         fallback_provider.load_from_resource ("io/elementary/appcenter/fallback.css");
-        Gtk.StyleContext.add_provider_for_screen (
-            Gdk.Screen.get_default (),
+        Gtk.StyleContext.add_provider_for_display (
+            Gdk.Display.get_default (),
             fallback_provider,
             Gtk.STYLE_PROVIDER_PRIORITY_FALLBACK
         );
@@ -214,6 +212,20 @@ public class AppCenter.App : Gtk.Application {
 
             var main_window = new MainWindow (this);
             add_window (main_window);
+
+            /*
+            * This is very finicky. Bind size after present else set_titlebar gives us bad sizes
+            * Set maximize after height/width else window is min size on unmaximize
+            * Bind maximize as SET else get get bad sizes
+            */
+            settings.bind ("window-height", main_window, "default-height", SettingsBindFlags.DEFAULT);
+            settings.bind ("window-width", main_window, "default-width", SettingsBindFlags.DEFAULT);
+
+            if (settings.get_boolean ("window-maximized")) {
+                main_window.maximize ();
+            }
+
+            settings.bind ("window-maximized", main_window, "maximized", SettingsBindFlags.SET);
         }
 
         if (show_updates) {
@@ -284,14 +296,9 @@ public class AppCenter.App : Gtk.Application {
                 if (error == null) {
                     if (package.get_can_launch ()) {
                         // Check if window is focused
-                        if (active_window != null) {
-                            var main_window = (MainWindow) active_window;
-                            var win = main_window.get_window ();
-                            if (win != null && (win.get_state () & Gdk.WindowState.FOCUSED) != 0) {
-                                main_window.send_installed_toast (package);
-
-                                break;
-                            }
+                        if (active_window != null && active_window.is_active) {
+                            ((MainWindow) active_window).send_installed_toast (package);
+                            break;
                         }
 
                         var notification = new Notification (_("The app has been installed"));
@@ -327,8 +334,9 @@ public class AppCenter.App : Gtk.Application {
                 transient_for = active_window
             };
 
-            update_fail_dialog.destroy.connect (() => {
+            update_fail_dialog.close_request.connect (() => {
                 update_fail_dialog = null;
+                return Gdk.EVENT_PROPAGATE;
             });
         }
 

src/Core/Package.vala

@@ -678,13 +678,12 @@ public class AppCenterCore.Package : Object {
         uint current_scale = 0;
         uint pixel_size = size * scale_factor;
 
-        weak GenericArray<AppStream.Icon> icons = component.get_icons ();
-        for (int i = 0; i < icons.length; i++) {
-            weak AppStream.Icon _icon = icons[i];
+        unowned var icons = component.get_icons ();
+        foreach (unowned var _icon in icons) {
             switch (_icon.get_kind ()) {
                 case AppStream.IconKind.STOCK:
                     unowned string icon_name = _icon.get_name ();
-                    if (Gtk.IconTheme.get_default ().has_icon (icon_name)) {
+                    if (Gtk.IconTheme.get_for_display (Gdk.Display.get_default ()).has_icon (icon_name)) {
                         return new ThemedIcon (icon_name);
                     }
 
@@ -709,10 +708,22 @@ public class AppCenterCore.Package : Object {
                     bool is_bigger = (icon_width > current_size && current_size < pixel_size);
                     bool has_better_dpi = (icon_width == current_size && current_scale < icon_scale && scale_factor <= icon_scale);
                     if (is_bigger || has_better_dpi) {
-                        var file = File.new_for_uri (_icon.get_url ());
-                        icon = new FileIcon (file);
-                        current_size = icon_width;
-                        current_scale = icon_scale;
+                        var server_file = File.new_for_uri (_icon.get_url ());
+                        var local_file = File.new_for_path (
+                            Path.build_filename (Environment.get_tmp_dir (), server_file.get_basename ())
+                        );
+
+                        // FIXME: Copy this async
+                        try {
+                            server_file.copy (local_file, FileCopyFlags.OVERWRITE, null, null);
+
+                            icon = new FileIcon (local_file);
+                            current_size = icon_width;
+                            current_scale = icon_scale;
+                        } catch (Error e) {
+                            critical ("Unable to download remote icon: %s", e.message);
+                        }
+
                     }
 
                     break;