fix SERVER_NAME + fix delete form + enhance

*remove duplicate SERVER_NAME on edit form to get right server name value on server
*for new service : SERVER_NAME value is empty by default
*add a required attribut for SERVER_NAME
*delete form is now working (add SERVER_NAME value)

src/ui/static/js/services.js

@@ -76,7 +76,9 @@ class ServiceModal {
           this.setSettingsDefault();
           //server name is unset
           const inpServName = document.querySelector("input#SERVER_NAME");
+          inpServName.getAttribute("value", "");
           inpServName.value = "";
+
           //show modal
           this.openModal();
         }
@@ -104,7 +106,6 @@ class ServiceModal {
       const inpName = inp.getAttribute("name");
       if (
         inpName === "csrf_token" ||
-        inpName === "SERVER_NAME" ||
         inpName === "OLD_SERVER_NAME" ||
         inpName === "operation"
       )
@@ -169,20 +170,19 @@ class ServiceModal {
 
     if (action === "edit" || action === "new") {
       this.showNewEditForm();
-      formEl
-        .querySelector(`input[name="OLD_SERVER_NAME"]`)
-        .setAttribute("value", serviceName);
+      const oldNameInp = formEl.querySelector(`input[name="OLD_SERVER_NAME"]`);
+      oldNameInp.setAttribute("value", serviceName);
+      oldNameInp.value = serviceName;
     }
 
     if (action === "delete") {
       this.showDeleteForm();
-      formEl.setAttribute("id", `form-${action}-${serviceName}`);
-      formEl
-        .querySelector(`input[name="SERVER_NAME"]`)
-        .setAttribute("value", serviceName);
       formEl.querySelector(
         `[services-modal-text]`
       ).textContent = `Are you sure you want to delete ${serviceName} ?`;
+      const nameInp = formEl.querySelector(`input[name="SERVER_NAME"]`);
+      nameInp.setAttribute("value", serviceName);
+      nameInp.value = serviceName;
     }
   }
 
@@ -245,7 +245,6 @@ class ServiceModal {
           const inpName = inp.getAttribute("name");
           if (
             inpName === "csrf_token" ||
-            inpName === "SERVER_NAME" ||
             inpName === "OLD_SERVER_NAME" ||
             inpName === "operation"
           )
@@ -627,7 +626,6 @@ class Multiple {
         const inpName = inp.getAttribute("name");
         if (
           inpName === "csrf_token" ||
-          inpName === "SERVER_NAME" ||
           inpName === "OLD_SERVER_NAME" ||
           inpName === "operation"
         )

src/ui/templates/services-modal.html

@@ -94,8 +94,9 @@
       method="POST"
     >
       <input type="hidden" name="csrf_token" value="{{ csrf_token() }}" />
-      <input type="hidden" value="server_name" name="SERVER_NAME" />
       <input type="hidden" value="delete" name="operation" />
+      <input type="hidden" value="" name="SERVER_NAME" />
+
       <div class="flex justify-center">
         <p
           services-modal-text

src/ui/templates/settings_plugins.html

@@ -65,6 +65,7 @@
       {% if value["type"] != "select" and value["type"] != "check" %}
       <div class="relative flex items-center">
         <input
+        {% if setting == "SERVER_NAME" %}required{%endif%}
         default-value="{{global_config[setting]['value']}}" default-method="{{global_config[setting]['method']}}"
         {% if global_config[setting]['method'] != 'ui' and global_config[setting]['method'] != 'default'  %} disabled {% endif %}     id="{{setting}}" name="{{setting}}"
         class="outline-none dark:opacity-90 dark:border-slate-600 dark:bg-slate-700 dark:text-gray-300 disabled:opacity-75 focus:border-gray-300/0 focus:ring-1  focus:valid:ring-green-500 focus:invalid:ring-red-500  text-sm leading-5.6 ease block w-full appearance-none rounded-lg border border-solid border-gray-300 bg-white bg-clip-padding px-1.5 py-1 md:px-3 md:py-2 font-normal text-gray-700 transition-all placeholder:text-gray-500 disabled:bg-gray-400 dark:disabled:bg-gray-800 dark:disabled:border-gray-800 dark:disabled:text-gray-300 disabled:text-gray-700"