From e299aef4b47913635de22e341ea2ce0ae968d6b3 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Maur=C3=ADcio=20Meneghini=20Fauth?= <mauricio@fauth.dev>
Date: Wed, 20 Mar 2024 12:20:34 -0300
Subject: [PATCH] Restore console config values only when necessary
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

This reduces the need of unnecessary HTTP requests.

Signed-off-by: Maurício Meneghini Fauth <mauricio@fauth.dev>
---
 resources/js/src/modules/console.ts        | 36 +++++++++++++++++-----
 resources/js/src/modules/console/config.ts | 18 -----------
 resources/templates/console/display.twig   |  2 +-
 3 files changed, 30 insertions(+), 26 deletions(-)

diff --git a/resources/js/src/modules/console.ts b/resources/js/src/modules/console.ts
index 8d46e10412..e0ea8b9d6c 100644
--- a/resources/js/src/modules/console.ts
+++ b/resources/js/src/modules/console.ts
@@ -176,13 +176,35 @@ var Console = {
                 consoleContent.classList.toggle('console_dark_theme', isDarkTheme);
             });
 
-            $('#pma_console_options').find('.button.default').on('click', function () {
-                (document.getElementById('consoleOptionsAlwaysExpandCheckbox') as HTMLInputElement).checked = false;
-                (document.getElementById('consoleOptionsStartHistoryCheckbox') as HTMLInputElement).checked = false;
-                (document.getElementById('consoleOptionsCurrentQueryCheckbox') as HTMLInputElement).checked = true;
-                (document.getElementById('consoleOptionsEnterExecutesCheckbox') as HTMLInputElement).checked = false;
-                (document.getElementById('consoleOptionsDarkThemeCheckbox') as HTMLInputElement).checked = false;
-                Config.update();
+            const restoreConsoleOptionsButton = document.getElementById('pma_console_options').querySelector('.button.default');
+            restoreConsoleOptionsButton?.addEventListener('click', function (): void {
+                if (consoleOptionsAlwaysExpandCheckbox.checked) {
+                    consoleOptionsAlwaysExpandCheckbox.checked = false;
+                    Config.set('AlwaysExpand', false);
+                }
+
+                if (consoleOptionsStartHistoryCheckbox.checked) {
+                    consoleOptionsStartHistoryCheckbox.checked = false;
+                    Config.set('StartHistory', false);
+                }
+
+                if (! consoleOptionsCurrentQueryCheckbox.checked) {
+                    consoleOptionsCurrentQueryCheckbox.checked = true;
+                    Config.set('CurrentQuery', true);
+                }
+
+                if (consoleOptionsEnterExecutesCheckbox.checked) {
+                    consoleOptionsEnterExecutesCheckbox.checked = false;
+                    Config.set('EnterExecutes', false);
+                    ConsoleMessages.showInstructions(false);
+                }
+
+                if (consoleOptionsDarkThemeCheckbox.checked) {
+                    consoleOptionsDarkThemeCheckbox.checked = false;
+                    Config.set('DarkTheme', false);
+                    const consoleContent = document.getElementById('pma_console').querySelector('.content');
+                    consoleContent.classList.remove('console_dark_theme');
+                }
             });
 
             $(document).on('ajaxComplete', function (event, xhr, ajaxOptions) {
diff --git a/resources/js/src/modules/console/config.ts b/resources/js/src/modules/console/config.ts
index 2005502971..df304b4ce6 100644
--- a/resources/js/src/modules/console/config.ts
+++ b/resources/js/src/modules/console/config.ts
@@ -69,24 +69,6 @@ export const Config = {
         this[key] = value;
         setConfigValue(key, value);
     },
-
-    /**
-     * Used for update console config
-     */
-    update: function (): void {
-        this.set('AlwaysExpand', !! (document.getElementById('consoleOptionsAlwaysExpandCheckbox') as HTMLInputElement).checked);
-        this.set('StartHistory', !! (document.getElementById('consoleOptionsStartHistoryCheckbox') as HTMLInputElement).checked);
-        this.set('CurrentQuery', !! (document.getElementById('consoleOptionsCurrentQueryCheckbox') as HTMLInputElement).checked);
-        this.set('EnterExecutes', !! (document.getElementById('consoleOptionsEnterExecutesCheckbox') as HTMLInputElement).checked);
-        this.set('DarkTheme', !! (document.getElementById('consoleOptionsDarkThemeCheckbox') as HTMLInputElement).checked);
-        /* Setting the dark theme of the console*/
-        const consoleContent = document.getElementById('pma_console').querySelector('.content');
-        if (this.DarkTheme) {
-            consoleContent.classList.add('console_dark_theme');
-        } else {
-            consoleContent.classList.remove('console_dark_theme');
-        }
-    }
 };
 
 /**
diff --git a/resources/templates/console/display.twig b/resources/templates/console/display.twig
index 45a66960a9..0dfe621904 100644
--- a/resources/templates/console/display.twig
+++ b/resources/templates/console/display.twig
@@ -175,7 +175,7 @@
           <span>{{ 'Options'|trans }}</span>
         </div>
         <div class="button default">
-          <span>{{ 'Set default'|trans }}</span>
+          <span>{{ 'Restore default values'|trans }}</span>
         </div>
       </div>