Added note on using snake case for enum values

IHP/IDE/SchemaDesigner/View/EnumValues/New.hs

@@ -31,6 +31,10 @@ instance View NewEnumValueView where
                         <label class="col-sm-2 col-form-label">Name:</label>
                         <div class="col-sm-10">
                             <input name="enumValueName" type="text" class="form-control" autofocus="autofocus"/>
+                            <div class="invalid-feedback">It's highly recommended to use sneak case / underscores for naming your enum values</div>
+                            <small class="text-muted">
+                                Use underscores instead of camel case. E.g.: <code>public_user</code>, <code>in_progress</code>, <code>currency_eur</code>
+                            </small>
                         </div>
                     </div>
 

lib/IHP/static/IDE/ihp-schemadesigner.js

@@ -126,6 +126,8 @@ function initSchemaDesigner() {
         $('label[data-attribute="' + $("#colName").val() +'"] > input').prop('checked', true);
         $('input[name="referenceTable"]').val($('label[style="font-size: 12px;"]').data("table"));
     });
+
+    initEnumValueNameSnakeCaseCheck();
 }
 
 function initCodeEditor() {
@@ -277,4 +279,23 @@ function setCheckboxSqlMode(id, sqlMode) {
         altField.name = id + "-inactive";
         checkBoxContainer.className = "form-control";
     }
+}
+
+/** Shows a warning if a new enum value is going to be added that is not in snake case */
+function initEnumValueNameSnakeCaseCheck() {
+    const input = document.querySelector('input[name="enumValueName"]');
+    if (!input) {
+        return;
+    }
+
+    input.onkeyup = event => {
+        const enumValueName = event.target.value;
+        const isCamelCase = /[A-Z]/.test(enumValueName)
+
+        if (isCamelCase) {
+            input.classList.add('is-invalid');
+        } else {
+            input.classList.remove('is-invalid');
+        }
+    }
 }