[gnome-software: 1/4] gs-overview-page: Support a second category flowbox for addons

[Milan Crha <mcrha src gnome org>]

commit 9bd78da8fb0c6c6ee1b720a02d38991b2aaf82a9
Author: Philip Withnall <pwithnall endlessos org>
Date:   Fri Aug 20 13:51:11 2021 +0100

    gs-overview-page: Support a second category flowbox for addons
    
    This will be for less important categories, such as add-on categories,
    which won’t have custom styling.
    
    Currently, the addons are mixed into the Create and Work categories, and
    this doesn’t work very well — the addons are hard to find due to there
    being a small number of them mixed in with a large number of other apps.
    A lot of fonts start with ‘a’ so end up monopolising the top of the
    alphabetic list of software. Instructing someone to open the ‘Work’
    category to browse for hardware drivers is confusing.
    
    A following commit will rearrange the category map to separate the
    addons out again.
    
    Signed-off-by: Philip Withnall <pwithnall endlessos org>
    
    Helps: #1384

 src/gs-overview-page.c  | 22 ++++++++++++++++++++--
 src/gs-overview-page.ui | 27 +++++++++++++++++++++++++++
 2 files changed, 47 insertions(+), 2 deletions(-)
---
diff --git a/src/gs-overview-page.c b/src/gs-overview-page.c
index 7b8bad9f2..0089d9f85 100644
--- a/src/gs-overview-page.c
+++ b/src/gs-overview-page.c
@@ -51,6 +51,8 @@ struct _GsOverviewPage
        GtkWidget               *box_popular;
        GtkWidget               *box_recent;
        GtkWidget               *flowbox_categories;
+       GtkWidget               *flowbox_iconless_categories;
+       GtkWidget               *iconless_categories_heading;
        GtkWidget               *popular_heading;
        GtkWidget               *recent_heading;
        GtkWidget               *scrolledwindow_overview;
@@ -323,9 +325,14 @@ gs_overview_page_get_categories_cb (GObject *source_object,
                        g_warning ("failed to get categories: %s", error->message);
                goto out;
        }
+
        gs_container_remove_all (GTK_CONTAINER (self->flowbox_categories));
+       gs_container_remove_all (GTK_CONTAINER (self->flowbox_iconless_categories));
 
-       /* add categories to the correct flowboxes, the second being hidden */
+       /* Add categories to the flowboxes. Categories with icons are deemed to
+        * be visually important, and are listed near the top of the page.
+        * Categories without icons are listed in a separate flowbox at the
+        * bottom of the page. Typically they are addons. */
        for (i = 0; i < list->len; i++) {
                cat = GS_CATEGORY (g_ptr_array_index (list, i));
                if (gs_category_get_size (cat) == 0)
@@ -333,7 +340,12 @@ gs_overview_page_get_categories_cb (GObject *source_object,
                tile = gs_category_tile_new (cat);
                g_signal_connect (tile, "clicked",
                                  G_CALLBACK (category_tile_clicked), self);
-               flowbox = GTK_FLOW_BOX (self->flowbox_categories);
+
+               if (gs_category_get_icon_name (cat) != NULL)
+                       flowbox = GTK_FLOW_BOX (self->flowbox_categories);
+               else
+                       flowbox = GTK_FLOW_BOX (self->flowbox_iconless_categories);
+
                gtk_flow_box_insert (flowbox, tile, -1);
                gtk_widget_set_can_focus (gtk_widget_get_parent (tile), FALSE);
                added_cnt++;
@@ -345,6 +357,10 @@ gs_overview_page_get_categories_cb (GObject *source_object,
        }
 
 out:
+       /* Show the heading for the iconless categories iff there are any. */
+       gtk_widget_set_visible (self->iconless_categories_heading,
+                               gtk_flow_box_get_child_at_index (GTK_FLOW_BOX 
(self->flowbox_iconless_categories), 0) != NULL);
+
        if (added_cnt > 0)
                self->empty = FALSE;
 
@@ -826,6 +842,8 @@ gs_overview_page_class_init (GsOverviewPageClass *klass)
        gtk_widget_class_bind_template_child (widget_class, GsOverviewPage, box_popular);
        gtk_widget_class_bind_template_child (widget_class, GsOverviewPage, box_recent);
        gtk_widget_class_bind_template_child (widget_class, GsOverviewPage, flowbox_categories);
+       gtk_widget_class_bind_template_child (widget_class, GsOverviewPage, flowbox_iconless_categories);
+       gtk_widget_class_bind_template_child (widget_class, GsOverviewPage, iconless_categories_heading);
        gtk_widget_class_bind_template_child (widget_class, GsOverviewPage, popular_heading);
        gtk_widget_class_bind_template_child (widget_class, GsOverviewPage, recent_heading);
        gtk_widget_class_bind_template_child (widget_class, GsOverviewPage, scrolledwindow_overview);
diff --git a/src/gs-overview-page.ui b/src/gs-overview-page.ui
index f3a626862..8cc16233d 100644
--- a/src/gs-overview-page.ui
+++ b/src/gs-overview-page.ui
@@ -167,6 +167,33 @@
                                 </accessibility>
                               </object>
                             </child>
+
+                            <child>
+                              <object class="GtkLabel" id="iconless_categories_heading">
+                                <property name="visible">True</property>
+                                <property name="xalign">0</property>
+                                <property name="label" translatable="yes" comments="Translators: This is a 
heading for a list of categories.">Other Categories</property>
+                                <property name="margin-top">21</property>
+                                <property name="margin-bottom">6</property>
+                                <accessibility>
+                                  <relation target="flowbox_iconless_categories" type="label-for"/>
+                                </accessibility>
+                                <style>
+                                  <class name="index-title-alignment-software"/>
+                                </style>
+                              </object>
+                            </child>
+                            <child>
+                              <object class="GtkFlowBox" id="flowbox_iconless_categories">
+                                <property name="visible">True</property>
+                                <property name="row_spacing">14</property>
+                                <property name="column_spacing">14</property>
+                                <property name="homogeneous">True</property>
+                                <property name="min_children_per_line">2</property>
+                                <property name="max_children_per_line">3</property>
+                                <property name="selection_mode">none</property>
+                              </object>
+                            </child>
                           </object>
                         </child>
                       </object>