[gnome-shell] extensions-app: Use AdwPreferencesPage and AdwPreferencesGroup

[Marge Bot <marge-bot src gnome org>]

commit ab5977713b5b5dbfd0a1cec453f0a0528800dedf
Author: Romain Vigier <romain romainvigier fr>
Date:   Mon Oct 18 15:18:11 2021 +0200

    extensions-app: Use AdwPreferencesPage and AdwPreferencesGroup
    
    Give consistent styling and sizing to extensions lists.
    
    Part-of: <https://gitlab.gnome.org/GNOME/gnome-shell/-/merge_requests/1997>

 .../extensions-app/data/ui/extension-row.ui        |  2 -
 .../extensions-app/data/ui/extensions-window.ui    | 78 ++++++----------------
 subprojects/extensions-app/js/main.js              |  9 +--
 3 files changed, 26 insertions(+), 63 deletions(-)
---
diff --git a/subprojects/extensions-app/data/ui/extension-row.ui 
b/subprojects/extensions-app/data/ui/extension-row.ui
index f41d8fbb7e..8330f05ce2 100644
--- a/subprojects/extensions-app/data/ui/extension-row.ui
+++ b/subprojects/extensions-app/data/ui/extension-row.ui
@@ -89,7 +89,6 @@
                 <child>
                   <object class="GtkLabel" id="descriptionLabel">
                     <property name="ellipsize">end</property>
-                    <property name="max-width-chars">60</property>
                     <property name="xalign">0</property>
                     <property name="yalign">0</property>
                   </object>
@@ -171,7 +170,6 @@
                     <property name="visible">False</property>
                     <property name="selectable">True</property>
                     <property name="wrap">True</property>
-                    <property name="max-width-chars">60</property>
                     <property name="xalign">0</property>
                     <layout>
                       <property name="column">1</property>
diff --git a/subprojects/extensions-app/data/ui/extensions-window.ui 
b/subprojects/extensions-app/data/ui/extensions-window.ui
index f96441c488..740c62128e 100644
--- a/subprojects/extensions-app/data/ui/extensions-window.ui
+++ b/subprojects/extensions-app/data/ui/extensions-window.ui
@@ -124,65 +124,29 @@
               <object class="GtkStackPage">
                 <property name="name">main</property>
                 <property name="child">
-                  <object class="GtkScrolledWindow" id="scrolledWindow">
-                    <property name="hscrollbar-policy">never</property>
+                  <object class="AdwPreferencesPage">
                     <child>
-                      <object class="GtkViewport">
-                        <property name="scroll-to-focus">True</property>
+                      <object class="AdwPreferencesGroup" id="userGroup">
+                        <property name="title" translatable="yes">Manually Installed</property>
                         <child>
-                          <object class="GtkBox">
-                            <property name="orientation">vertical</property>
-                            <property name="halign">center</property>
-                            <property name="margin-start">36</property>
-                            <property name="margin-end">36</property>
-                            <property name="margin-top">36</property>
-                            <property name="margin-bottom">36</property>
-                            <property name="spacing">12</property>
-                            <child>
-                              <object class="GtkLabel">
-                                <property name="visible"
-                                          bind-source="userList"
-                                          bind-property="visible"
-                                          bind-flags="sync-create"/>
-                                <property name="halign">start</property>
-                                <property name="hexpand">True</property>
-                                <property name="label" translatable="yes">Manually Installed</property>
-                                <style>
-                                  <class name="heading"/>
-                                </style>
-                              </object>
-                            </child>
-                            <child>
-                              <object class="GtkListBox" id="userList">
-                                <property name="selection-mode">none</property>
-                                <property name="margin-bottom">24</property>
-                                <style>
-                                  <class name="content"/>
-                                </style>
-                              </object>
-                            </child>
-                            <child>
-                              <object class="GtkLabel">
-                                <property name="visible"
-                                          bind-source="systemList"
-                                          bind-property="visible"
-                                          bind-flags="sync-create"/>
-                                <property name="halign">start</property>
-                                <property name="hexpand">True</property>
-                                <property name="label" translatable="yes">Built-In</property>
-                                <style>
-                                  <class name="heading"/>
-                                </style>
-                              </object>
-                            </child>
-                            <child>
-                              <object class="GtkListBox" id="systemList">
-                                <property name="selection-mode">none</property>
-                                <style>
-                                  <class name="content"/>
-                                </style>
-                              </object>
-                            </child>
+                          <object class="GtkListBox" id="userList">
+                            <property name="selection-mode">none</property>
+                            <style>
+                              <class name="content"/>
+                            </style>
+                          </object>
+                        </child>
+                      </object>
+                    </child>
+                    <child>
+                      <object class="AdwPreferencesGroup" id="systemGroup">
+                        <property name="title" translatable="yes">Built-In</property>
+                        <child>
+                          <object class="GtkListBox" id="systemList">
+                            <property name="selection-mode">none</property>
+                            <style>
+                              <class name="content"/>
+                            </style>
                           </object>
                         </child>
                       </object>
diff --git a/subprojects/extensions-app/js/main.js b/subprojects/extensions-app/js/main.js
index 563cd7e456..329d3870dd 100644
--- a/subprojects/extensions-app/js/main.js
+++ b/subprojects/extensions-app/js/main.js
@@ -74,10 +74,11 @@ var ExtensionsWindow = GObject.registerClass({
     GTypeName: 'ExtensionsWindow',
     Template: 'resource:///org/gnome/Extensions/ui/extensions-window.ui',
     InternalChildren: [
+        'userGroup',
         'userList',
+        'systemGroup',
         'systemList',
         'mainStack',
-        'scrolledWindow',
         'searchBar',
         'searchButton',
         'searchEntry',
@@ -316,10 +317,10 @@ var ExtensionsWindow = GObject.registerClass({
     }
 
     _syncListVisibility() {
-        this._userList.visible = [...this._userList].length > 1;
-        this._systemList.visible = [...this._systemList].length > 1;
+        this._userGroup.visible = [...this._userList].length > 1;
+        this._systemGroup.visible = [...this._systemList].length > 1;
 
-        if (this._userList.visible || this._systemList.visible)
+        if (this._userGroup.visible || this._systemGroup.visible)
             this._mainStack.visible_child_name = 'main';
         else
             this._mainStack.visible_child_name = 'placeholder';