From d444724d240efd71ee8a5038280536e979606b81 Mon Sep 17 00:00:00 2001
From: thankyouverycool <66646555+thankyouverycool@users.noreply.github.com>
Date: Mon, 26 Sep 2022 08:58:00 -0400
Subject: [PATCH] ThemeEditor: Update GML and polish interface

Registers the PreviewWidget for addition directly into GML. Fixes
its previous double Frame borders. Also standardizes the Apply and
Reset buttons as DialogButtons and spaces them consistently with
other apps. Gives the TabWidget some tasteful container margins.
---
 .../Applications/ThemeEditor/MainWidget.cpp   |  8 ++---
 .../ThemeEditor/PreviewWidget.cpp             |  2 ++
 .../Applications/ThemeEditor/PreviewWidget.h  |  1 +
 .../Applications/ThemeEditor/ThemeEditor.gml  | 33 ++++++++++---------
 4 files changed, 24 insertions(+), 20 deletions(-)

diff --git a/Userland/Applications/ThemeEditor/MainWidget.cpp b/Userland/Applications/ThemeEditor/MainWidget.cpp
index 43517bde33..4006456491 100644
--- a/Userland/Applications/ThemeEditor/MainWidget.cpp
+++ b/Userland/Applications/ThemeEditor/MainWidget.cpp
@@ -17,7 +17,6 @@
 #include <Applications/ThemeEditor/ThemeEditorGML.h>
 #include <LibFileSystemAccessClient/Client.h>
 #include <LibGUI/ActionGroup.h>
-#include <LibGUI/Application.h>
 #include <LibGUI/BoxLayout.h>
 #include <LibGUI/Button.h>
 #include <LibGUI/ConnectionToWindowServer.h>
@@ -191,8 +190,7 @@ MainWidget::MainWidget()
 
     m_alignment_model = MUST(AlignmentModel::try_create());
 
-    m_preview_widget = find_descendant_of_type_named<GUI::Frame>("preview_frame")
-                           ->add<ThemeEditor::PreviewWidget>(m_current_palette);
+    m_preview_widget = find_descendant_of_type_named<ThemeEditor::PreviewWidget>("preview_widget");
     m_property_tabs = find_descendant_of_type_named<GUI::TabWidget>("property_tabs");
     add_property_tab(window_tab);
     add_property_tab(widgets_tab);
@@ -371,8 +369,8 @@ void MainWidget::build_override_controls()
 {
     auto* theme_override_controls = find_descendant_of_type_named<GUI::Widget>("theme_override_controls");
 
-    m_theme_override_apply = theme_override_controls->find_child_of_type_named<GUI::Button>("apply");
-    m_theme_override_reset = theme_override_controls->find_child_of_type_named<GUI::Button>("reset");
+    m_theme_override_apply = theme_override_controls->find_child_of_type_named<GUI::DialogButton>("apply_button");
+    m_theme_override_reset = theme_override_controls->find_child_of_type_named<GUI::DialogButton>("reset_button");
 
     m_theme_override_apply->on_click = [&](auto) {
         auto encoded = encode();
diff --git a/Userland/Applications/ThemeEditor/PreviewWidget.cpp b/Userland/Applications/ThemeEditor/PreviewWidget.cpp
index 215d28e641..9a80469735 100644
--- a/Userland/Applications/ThemeEditor/PreviewWidget.cpp
+++ b/Userland/Applications/ThemeEditor/PreviewWidget.cpp
@@ -18,6 +18,8 @@
 #include <LibGfx/Bitmap.h>
 #include <LibGfx/WindowTheme.h>
 
+REGISTER_WIDGET(ThemeEditor, PreviewWidget);
+
 namespace ThemeEditor {
 
 class MiniWidgetGallery final : public GUI::Widget {
diff --git a/Userland/Applications/ThemeEditor/PreviewWidget.h b/Userland/Applications/ThemeEditor/PreviewWidget.h
index e0f5cad30b..3ffba902fb 100644
--- a/Userland/Applications/ThemeEditor/PreviewWidget.h
+++ b/Userland/Applications/ThemeEditor/PreviewWidget.h
@@ -10,6 +10,7 @@
 #pragma once
 
 #include <LibGUI/AbstractThemePreview.h>
+#include <LibGUI/Application.h>
 #include <LibGUI/ColorFilterer.h>
 #include <LibGUI/Frame.h>
 #include <LibGfx/Bitmap.h>
diff --git a/Userland/Applications/ThemeEditor/ThemeEditor.gml b/Userland/Applications/ThemeEditor/ThemeEditor.gml
index 1cf611e35e..475ae019f2 100644
--- a/Userland/Applications/ThemeEditor/ThemeEditor.gml
+++ b/Userland/Applications/ThemeEditor/ThemeEditor.gml
@@ -1,41 +1,44 @@
 @GUI::Widget {
-    layout: @GUI::VerticalBoxLayout {}
+    layout: @GUI::VerticalBoxLayout {
+        margins: [0, 4, 4]
+        spacing: 6
+    }
     fill_with_background_color: true
 
     @GUI::Widget {
-        layout: @GUI::HorizontalBoxLayout {}
+        layout: @GUI::HorizontalBoxLayout {
+            spacing: 4
+        }
 
-        @GUI::Frame {
-            layout: @GUI::HorizontalBoxLayout {}
-            name: "preview_frame"
+        @ThemeEditor::PreviewWidget {
+            name: "preview_widget"
         }
 
         @GUI::TabWidget {
             name: "property_tabs"
+            container_margins: [5]
         }
     }
 
     @GUI::Widget {
         name: "theme_override_controls"
         layout: @GUI::HorizontalBoxLayout {
-            margins: [0, 4]
+            spacing: 6
         }
-        fixed_height: 30
+        preferred_height: "shrink"
 
         @GUI::Layout::Spacer {}
 
-        @GUI::Button {
-            name: "reset"
-            text: "Reset to Previous System Theme"
+        @GUI::DialogButton {
+            name: "reset_button"
+            text: "Reset"
             enabled: false
-            fixed_width: 190
         }
 
-        @GUI::Button {
-            name: "apply"
-            text: "Apply as System Theme"
+        @GUI::DialogButton {
+            name: "apply_button"
+            text: "Apply"
             enabled: false
-            fixed_width: 140
         }
     }
 }