From a4d22e0e7a6400710be19a3607bd2c973f47c777 Mon Sep 17 00:00:00 2001
From: Dragory <2606411+Dragory@users.noreply.github.com>
Date: Fri, 20 Aug 2021 23:22:10 +0300
Subject: [PATCH] Auto-resize config editor when window is resized

---
 .../dashboard/GuildConfigEditor.vue           | 26 ++++++++++++++++++-
 1 file changed, 25 insertions(+), 1 deletion(-)

diff --git a/dashboard/src/components/dashboard/GuildConfigEditor.vue b/dashboard/src/components/dashboard/GuildConfigEditor.vue
index e6f780e2..191892ad 100644
--- a/dashboard/src/components/dashboard/GuildConfigEditor.vue
+++ b/dashboard/src/components/dashboard/GuildConfigEditor.vue
@@ -24,7 +24,6 @@
                @init="editorInit"
                lang="yaml"
                theme="tomorrow_night"
-               :width="editorWidth"
                :height="editorHeight"
                ref="aceEditor" />
   </div>
@@ -38,6 +37,7 @@
   import AceEditor from "vue2-ace-editor";
 
   let editorKeybindListener;
+  let windowResizeListener;
 
   export default {
     components: {
@@ -69,6 +69,12 @@
         window.removeEventListener("keydown", editorKeybindListener);
         editorKeybindListener = null;
       }
+
+      if (windowResizeListener) {
+        window.removeEventListener("resize", windowResizeListener);
+        windowResizeListener = null;
+      }
+
       next();
     },
     data() {
@@ -105,6 +111,7 @@
           tabSize: 2
         });
 
+        // Add Ctrl+S/Cmd+S save shortcut
         const isMac = /mac/i.test(navigator.platform);
         const modKeyPressed = (ev: KeyboardEvent) => (isMac ? ev.metaKey : ev.ctrlKey);
         const nonModKeyPressed = (ev: KeyboardEvent) => (isMac ? ev.ctrlKey : ev.metaKey);
@@ -130,7 +137,24 @@
         };
         window.addEventListener("keydown", editorKeybindListener);
 
+        // Auto-fit editor to window
         this.fitEditorToWindow();
+
+        if (windowResizeListener) {
+          window.removeEventListener("resize", windowResizeListener);
+        }
+
+        let debounceTimeout;
+        windowResizeListener = (ev: UIEvent) => {
+          if (debounceTimeout) {
+            clearTimeout(debounceTimeout);
+          }
+
+          debounceTimeout = setTimeout(() => {
+            this.fitEditorToWindow();
+          }, 350);
+        };
+        window.addEventListener("resize", windowResizeListener);
       },
       fitEditorToWindow() {
         const mainContainer = document.querySelector('.dashboard');