From 1524061480c13f3aea9458748d7717571dc06989 Mon Sep 17 00:00:00 2001
From: Jens Langhammer <jens.langhammer@beryju.org>
Date: Sat, 12 Dec 2020 23:45:47 +0100
Subject: [PATCH] web: only auto-update slug when slug and name are already in
 sync

---
 web/src/elements/buttons/ModalButton.ts | 22 ++++++++++++++--------
 1 file changed, 14 insertions(+), 8 deletions(-)

diff --git a/web/src/elements/buttons/ModalButton.ts b/web/src/elements/buttons/ModalButton.ts
index ba27fbd4fc..5acb83877c 100644
--- a/web/src/elements/buttons/ModalButton.ts
+++ b/web/src/elements/buttons/ModalButton.ts
@@ -64,15 +64,21 @@ export class ModalButton extends LitElement {
         });
         // Make name field update slug field
         this.querySelectorAll<HTMLInputElement>("input[name=name]").forEach((input) => {
+            const form = input.closest("form");
+            if (form === null) {
+                return;
+            }
+            const slugField = form.querySelector<HTMLInputElement>("input[name=slug]");
+            if (!slugField) {
+                return;
+            }
+            // Only attach handler if the slug is already equal to the name
+            // if not, they are probably completely different and shouldn't update
+            // each other
+            if (convertToSlug(input.value) !== slugField.value) {
+                return;
+            }
             input.addEventListener("input", () => {
-                const form = input.closest("form");
-                if (form === null) {
-                    return;
-                }
-                const slugField = form.querySelector<HTMLInputElement>("input[name=slug]");
-                if (!slugField) {
-                    return;
-                }
                 slugField.value = convertToSlug(input.value);
             });
         });