settings_dialog: Use AdwPreferencesWindow and AdwActionRow

AdwPreferencesWindow contains a nice API for preferences
windows, and AdwActionRow is the widget to use for rows
of preferences.

2 files changed, 80 insertions, 65 deletions

diff --git a/main/data/settings_dialog.ui b/main/data/settings_dialog.ui
index 84d56c1d..00870ebb 100644
--- a/main/data/settings_dialog.ui
+++ b/main/data/settings_dialog.ui
@@ -1,66 +1,81 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <interface>
-    <template class="DinoUiSettingsDialog">
-        <property name="title" translatable="yes">Settings</property>
+    <template class="DinoUiSettingsDialog" parent="AdwPreferencesWindow">
+        <property name="default-width">500</property>
+        <property name="default-height">420</property>
         <property name="modal">True</property>
-        <child type="titlebar">
-            <object class="GtkHeaderBar">
-            </object>
-        </child>
-        <child internal-child="content_area">
-            <object class="GtkBox">
+        <property name="search-enabled">False</property>
+        <child>
+            <object class="AdwPreferencesPage">
                 <child>
-                    <object class="GtkGrid">
-                        <property name="margin_top">10</property>
-                        <property name="margin_bottom">10</property>
-                        <property name="margin_start">10</property>
-                        <property name="margin_end">10</property>
-                        <property name="halign">center</property>
-                        <property name="valign">center</property>
-                        <property name="row-spacing">10</property>
+                    <object class="AdwPreferencesGroup">
                         <child>
-                            <object class="GtkCheckButton" id="typing_checkbutton">
-                                <property name="label" translatable="yes">Send typing notifications</property>
-                                <layout>
-                                    <property name="column">0</property>
-                                    <property name="row">0</property>
-                                </layout>
+                            <object class="AdwActionRow">
+                                <property name="title" translatable="yes">Send _Typing Notifications</property>
+                                <property name="use-underline">True</property>
+                                <property name="activatable-widget">typing_switch</property>
+                                <child type="suffix">
+                                    <object class="GtkSwitch" id="typing_switch">
+                                        <property name="valign">center</property>
+                                    </object>
+                                </child>
                             </object>
                         </child>
                         <child>
-                            <object class="GtkCheckButton" id="marker_checkbutton">
-                                <property name="label" translatable="yes">Send read receipts</property>
-                                <layout>
-                                    <property name="column">0</property>
-                                    <property name="row">1</property>
-                                </layout>
+                            <object class="AdwActionRow">
+                                <property name="title" translatable="yes">Send _Read Receipts</property>
+                                <property name="use-underline">True</property>
+                                <property name="activatable-widget">marker_switch</property>
+                                <child type="suffix">
+                                    <object class="GtkSwitch" id="marker_switch">
+                                        <property name="valign">center</property>
+                                    </object>
+                                </child>
                             </object>
                         </child>
+                    </object>
+                </child>
+                <child>
+                    <object class="AdwPreferencesGroup">
                         <child>
-                            <object class="GtkCheckButton" id="notification_checkbutton">
-                                <property name="label" translatable="yes">Notify when a new message arrives</property>
-                                <layout>
-                                    <property name="column">0</property>
-                                    <property name="row">2</property>
-                                </layout>
+                            <object class="AdwActionRow">
+                                <property name="title" translatable="yes">_Notifications</property>
+                                <property name="subtitle" translatable="yes">Notify when a new message arrives</property>
+                                <property name="use-underline">True</property>
+                                <property name="activatable-widget">notification_switch</property>
+                                <child type="suffix">
+                                    <object class="GtkSwitch" id="notification_switch">
+                                        <property name="valign">center</property>
+                                    </object>
+                                </child>
                             </object>
                         </child>
+                    </object>
+                </child>
+                <child>
+                    <object class="AdwPreferencesGroup">
                         <child>
-                            <object class="GtkCheckButton" id="emoji_checkbutton">
-                                <property name="label" translatable="yes">Convert smileys to emojis</property>
-                                <layout>
-                                    <property name="column">0</property>
-                                    <property name="row">3</property>
-                                </layout>
+                            <object class="AdwActionRow">
+                                <property name="title" translatable="yes">_Convert Smileys to Emoji</property>
+                                <property name="use-underline">True</property>
+                                <property name="activatable-widget">emoji_switch</property>
+                                <child type="suffix">
+                                    <object class="GtkSwitch" id="emoji_switch">
+                                        <property name="valign">center</property>
+                                    </object>
+                                </child>
                             </object>
                         </child>
                         <child>
-                            <object class="GtkCheckButton" id="check_spelling_checkbutton">
-                                <property name="label" translatable="yes">Check spelling</property>
-                                <layout>
-                                    <property name="column">0</property>
-                                    <property name="row">4</property>
-                                </layout>
+                            <object class="AdwActionRow">
+                                <property name="title" translatable="yes">Check _Spelling</property>
+                                <property name="use-underline">True</property>
+                                <property name="activatable-widget">check_spelling_switch</property>
+                                <child type="suffix">
+                                    <object class="GtkSwitch" id="check_spelling_switch">
+                                        <property name="valign">center</property>
+                                    </object>
+                                </child>
                             </object>
                         </child>
                     </object>
diff --git a/main/src/ui/settings_dialog.vala b/main/src/ui/settings_dialog.vala
index e994e00c..5dc338bc 100644
--- a/main/src/ui/settings_dialog.vala
+++ b/main/src/ui/settings_dialog.vala
@@ -3,30 +3,30 @@ using Gtk;
 namespace Dino.Ui {
 
 [GtkTemplate (ui = "/im/dino/Dino/settings_dialog.ui")]
-class SettingsDialog : Dialog {
+class SettingsDialog : Adw.PreferencesWindow {
 
-    [GtkChild] private unowned CheckButton typing_checkbutton;
-    [GtkChild] private unowned CheckButton marker_checkbutton;
-    [GtkChild] private unowned CheckButton notification_checkbutton;
-    [GtkChild] private unowned CheckButton emoji_checkbutton;
-    [GtkChild] private unowned CheckButton check_spelling_checkbutton;
+    [GtkChild] private unowned Switch typing_switch;
+    [GtkChild] private unowned Switch marker_switch;
+    [GtkChild] private unowned Switch notification_switch;
+    [GtkChild] private unowned Switch emoji_switch;
+    [GtkChild] private unowned Switch check_spelling_switch;
 
     Dino.Entities.Settings settings = Dino.Application.get_default().settings;
 
     public SettingsDialog() {
-        Object(use_header_bar : Util.use_csd() ? 1 : 0);
-
-        typing_checkbutton.active = settings.send_typing;
-        marker_checkbutton.active = settings.send_marker;
-        notification_checkbutton.active = settings.notifications;
-        emoji_checkbutton.active = settings.convert_utf8_smileys;
-        check_spelling_checkbutton.active = settings.check_spelling;
-
-        typing_checkbutton.toggled.connect(() => { settings.send_typing = typing_checkbutton.active; } );
-        marker_checkbutton.toggled.connect(() => { settings.send_marker = marker_checkbutton.active; } );
-        notification_checkbutton.toggled.connect(() => { settings.notifications = notification_checkbutton.active; } );
-        emoji_checkbutton.toggled.connect(() => { settings.convert_utf8_smileys = emoji_checkbutton.active; });
-        check_spelling_checkbutton.toggled.connect(() => { settings.check_spelling = check_spelling_checkbutton.active; });
+        Object();
+
+        typing_switch.active = settings.send_typing;
+        marker_switch.active = settings.send_marker;
+        notification_switch.active = settings.notifications;
+        emoji_switch.active = settings.convert_utf8_smileys;
+        check_spelling_switch.active = settings.check_spelling;
+
+        typing_switch.activate.connect(() => { settings.send_typing = typing_switch.active; } );
+        marker_switch.activate.connect(() => { settings.send_marker = marker_switch.active; } );
+        notification_switch.activate.connect(() => { settings.notifications = notification_switch.active; } );
+        emoji_switch.activate.connect(() => { settings.convert_utf8_smileys = emoji_switch.active; });
+        check_spelling_switch.activate.connect(() => { settings.check_spelling = check_spelling_switch.active; });
     }
 }