update services and modes page

* start adding new service logic (empty server name, another operation name...)
* update services link logic for new service
* start adding operation and old_server_name fields on submit form

src/ui/builder/advanced_mode.py

@@ -4,7 +4,7 @@
 from .utils.form import get_forms, get_service_settings
 
 
-def advanced_mode_builder(templates: list[dict], plugins: list, global_config: dict, total_config: dict, service_name: str) -> str:
+def advanced_mode_builder(templates: list[dict], plugins: list, global_config: dict, total_config: dict, service_name: str, is_new: bool = False) -> str:
     """Render forms with global config data.
     ATM we don't need templates but we need to pass at least one to the function (it will simply not override anything).
     """
@@ -31,7 +31,9 @@ def advanced_mode_builder(templates: list[dict], plugins: list, global_config: d
                 {
                     "type": "Templates",
                     "data": {
-                        "templates": get_forms(templates, plugins, settings, ("advanced",)),
+                        "templates": get_forms(templates, plugins, settings, ("advanced",), is_new),
+                        "operation": "new" if is_new else "edit",
+                        "oldServerName": service_name if service_name else "",
                     },
                 },
             ],

src/ui/builder/easy_mode.py

@@ -4,7 +4,7 @@
 from .utils.form import get_forms, get_service_settings
 
 
-def easy_mode_builder(templates: list[dict], plugins: list, global_config: dict, total_config: dict, service_name: str) -> str:
+def easy_mode_builder(templates: list[dict], plugins: list, global_config: dict, total_config: dict, service_name: str, is_new: bool = False) -> str:
     """Render forms with global config data.
     ATM we don't need templates but we need to pass at least one to the function (it will simply not override anything).
     """
@@ -31,7 +31,9 @@ def easy_mode_builder(templates: list[dict], plugins: list, global_config: dict,
                 {
                     "type": "Templates",
                     "data": {
-                        "templates": get_forms(templates, plugins, settings, ("easy",)),
+                        "templates": get_forms(templates, plugins, settings, ("easy",), is_new),
+                        "operation": "new" if is_new else "edit",
+                        "oldServerName": service_name if service_name else "",
                     },
                 },
             ],

src/ui/builder/raw_mode.py

@@ -11,7 +11,7 @@
 from builder.utils.form import get_forms, get_service_settings
 
 
-def raw_mode_builder(templates: list[dict], plugins: list, global_config: dict, total_config: dict, service_name: str) -> str:
+def raw_mode_builder(templates: list[dict], plugins: list, global_config: dict, total_config: dict, service_name: str, is_new: bool = False) -> str:
     """Render forms with global config data.
     ATM we don't need templates but we need to pass at least one to the function (it will simply not override anything).
     """
@@ -40,6 +40,8 @@ def raw_mode_builder(templates: list[dict], plugins: list, global_config: dict,
                     "type": "Templates",
                     "data": {
                         "templates": get_forms(templates, plugins, settings, ("raw",)),
+                        "operation": "new" if is_new else "edit",
+                        "oldServerName": service_name if service_name else "",
                     },
                 },
             ],

src/ui/builder/services.py

@@ -34,7 +34,7 @@ def services_builder(services):
                         "size": "normal",
                         "iconName": "plus",
                         "iconColor": "white",
-                        "modal": services_action(server_name="new", operation="create", title="services_create_title", subtitle="services_create_subtitle"),
+                        "modal": services_action(server_name="new", operation="new", title="services_new_title", subtitle="services_new_subtitle"),
                         "containerClass": "col-span-12 flex justify-center",
                     },
                 },
@@ -258,7 +258,7 @@ def services_action(
             }
         )
 
-    if operation == "edit" or operation == "create":
+    if operation == "edit" or operation == "new":
         modes = ("easy", "advanced", "raw")
         mode_buttons = []
         for mode in modes:
@@ -271,7 +271,7 @@ def services_action(
                     "size": "normal",
                     "attrs": {
                         "role": "link",
-                        "data-link": f"modes?service_name={server_name}&mode={mode}" if mode != "create" else f"modes?mode={mode}",
+                        "data-link": f"modes?service_name={server_name}&mode={mode}" if operation != "new" else f"modes?mode={mode}",
                     },
                 },
             )

src/ui/builder/utils/form.py

@@ -24,7 +24,7 @@ def get_service_settings(service_name: str, global_config: dict, total_config: d
     return global_config
 
 
-def get_forms(templates: list = [], plugins: list = [], settings: dict = {}, render_forms: tuple = ("advanced", "easy", "raw")) -> dict:
+def get_forms(templates: list = [], plugins: list = [], settings: dict = {}, render_forms: tuple = ("advanced", "easy", "raw"), is_new: bool = False) -> dict:
     """
     Will generate every needed form using templates, plugins and settings.
     We will run on each plugins, set template value if one, and override by the custom settings value if exists.
@@ -36,18 +36,18 @@ def get_forms(templates: list = [], plugins: list = [], settings: dict = {}, ren
 
     for template in templates:
         if "advanced" in forms:
-            forms["advanced"][template.get("name")] = set_advanced(template, plugins, settings)
+            forms["advanced"][template.get("name")] = set_advanced(template, plugins, settings, is_new)
 
         if "raw" in forms:
-            forms["raw"][template.get("name")] = set_raw(template, plugins, settings)
+            forms["raw"][template.get("name")] = set_raw(template, plugins, settings, is_new)
 
         if "easy" in forms:
-            forms["easy"][template.get("name")] = set_easy(template, plugins, settings)
+            forms["easy"][template.get("name")] = set_easy(template, plugins, settings, is_new)
 
     return forms
 
 
-def set_easy(template: list, plugins_base: list, settings: dict) -> dict:
+def set_easy(template: list, plugins_base: list, settings: dict, is_new: bool) -> dict:
     """
     Prepare the easy form based on the template and plugins data.
     We need to loop on each steps and prepare settings and configs for each step.
@@ -77,14 +77,7 @@ def set_easy(template: list, plugins_base: list, settings: dict) -> dict:
 
             plugin_setting = copy.deepcopy(plugin.get("settings").get(setting))
 
-            plugin_setting = format_setting(
-                setting,
-                plugin_setting,
-                len(step_settings),
-                loop_id,
-                template_settings,
-                settings,
-            )
+            plugin_setting = format_setting(setting, plugin_setting, len(step_settings), loop_id, template_settings, settings, is_new)
 
             step_settings_output[setting] = plugin_setting
 
@@ -93,7 +86,7 @@ def set_easy(template: list, plugins_base: list, settings: dict) -> dict:
     return steps
 
 
-def set_raw(template: list, plugins_base: list, settings: dict) -> dict:
+def set_raw(template: list, plugins_base: list, settings: dict, is_new: bool) -> dict:
     """
     Set the raw form based on the template and plugins data.
     It consists of keeping only the value or default value for each plugin settings.
@@ -128,15 +121,17 @@ def set_raw(template: list, plugins_base: list, settings: dict) -> dict:
                 if val != default_val:
                     raw_value = val
 
+                if setting == "SERVER_NAME" and is_new:
+                    raw_value = ""
+
             # Add value only if exists
             if raw_value:
                 raw_settings[setting] = raw_value
 
-    print("raw_settings", raw_settings, flush=True)
     return raw_settings
 
 
-def set_advanced(template: list, plugins_base: list, settings: dict) -> dict:
+def set_advanced(template: list, plugins_base: list, settings: dict, is_new: bool) -> dict:
     """
     Set the advanced form based on the template and plugins data.
     It consists of formatting each plugin settings to be used in the advanced form.
@@ -150,14 +145,7 @@ def set_advanced(template: list, plugins_base: list, settings: dict) -> dict:
         total_settings = len(plugin.get("settings"))
         for setting, value in plugin.get("settings").items():
             loop_id += 1
-            value = format_setting(
-                setting,
-                value,
-                total_settings,
-                loop_id,
-                template_settings,
-                settings,
-            )
+            value = format_setting(setting, value, total_settings, loop_id, template_settings, settings, is_new)
 
     set_multiples(template, plugins, settings)
 
@@ -352,6 +340,7 @@ def format_setting(
     loop_id: Union[str, int],
     template_settings: dict,
     settings: dict,
+    is_new: bool = False,
 ) -> dict:
     """
     Format a setting in order to be used with form builder.
@@ -395,6 +384,9 @@ def format_setting(
         # Update value or set default as value
         setting_value["value"] = template_settings.get(setting_name, setting_value.get("default"))
 
+    if setting_name == "SERVER_NAME" and is_new:
+        setting_value["value"] = ""
+
     # Then override by service settings if not a multiple
     # Case multiple, we need to keep the default value and override only each multiple group
     if setting_name in settings and not "multiple" in setting_value:
@@ -406,7 +398,7 @@ def format_setting(
 
     # Then override by service settings
     if setting_name in settings:
-        setting_value["disabled"] = False if settings[setting_name].get("method", "ui") in ("ui", "default", "manual") else True
+        setting_value["disabled"] = False if settings[setting_name].get("method", "ui") in ("ui", "default", "manual") or is_new else True
 
     # Prepare popover checking "help", "context"
     popovers = []

src/ui/client/dashboard/components/Form/Advanced.vue

@@ -45,6 +45,11 @@ import { v4 as uuidv4 } from "uuid";
  *        },
  *      ],
  * }
+ * @param {object} template - Template object with plugin and settings data.
+ * @param {string} containerClass - Container
+ * @param {string} [operation="edit"] - Operation type (edit, new, delete).
+ * @param {string} [oldServerName=""] - Old server name. This is a server name before any changes.
+ * @param {object} columns - Columns object.
  */
 
 const advancedForm = useAdvancedForm();
@@ -61,6 +66,16 @@ const props = defineProps({
     required: false,
     default: "",
   },
+  operation: {
+    type: String,
+    required: false,
+    default: "edit",
+  },
+  oldServerName: {
+    type: String,
+    required: false,
+    default: "",
+  },
   columns: {
     type: Object,
     required: false,
@@ -270,6 +285,8 @@ function getPluginNames(template) {
 onMounted(() => {
   // SetTemplate only if first time we mount it
   advancedForm.setTemplate(props.template);
+  advancedForm.setOperation(props.operation);
+  advancedForm.setOldServerName(props.oldServerName);
   updateStates();
   // I want updatInp to access event, data.base and the container attribut
   advancedForm.useListenTempFields();

src/ui/client/dashboard/components/Form/Easy.vue

@@ -40,8 +40,10 @@ import { useEasyForm } from "@store/form.js";
  *         },
  *   ],
  * }
- **  @param {object} template - Template object with plugin and settings data.
+ * @param {object} template - Template object with plugin and settings data.
  * @param {string} containerClass - Container
+ * @param {string} [operation="edit"] - Operation type (edit, new, delete).
+ * @param {string} [oldServerName=""] - Old server name. This is a server name before any changes.
  * @param {object} columns - Columns object.
  */
 
@@ -54,6 +56,16 @@ const props = defineProps({
     required: true,
     default: {},
   },
+  operation: {
+    type: String,
+    required: false,
+    default: "edit",
+  },
+  oldServerName: {
+    type: String,
+    required: false,
+    default: "",
+  },
   containerClass: {
     type: String,
     required: false,
@@ -123,6 +135,8 @@ const buttonNext = {
 onMounted(() => {
   // Restart step one every time the component is mounted
   easyForm.setTemplate(props.template);
+  easyForm.setOperation(props.operation);
+  easyForm.setOldServerName(props.oldServerName);
   data.currStep = 0;
   setValidity();
   // I want updatInp to access event, data.base and the container attribut

src/ui/client/dashboard/components/Form/Raw.vue

@@ -21,6 +21,8 @@ import { useRawForm } from "@store/form.js";
  *    "MULTISITE": "yes"
  *   }
  *  @param {object} template - Template object with plugin and settings data.
+ *  @param {string} [operation="edit"] - Operation type (edit, new, delete).
+ *  @param {string} [oldServerName=""] - Old server name. This is a server name before any changes.
  *  @param {string} containerClass - Container
  *  @param {object} columns - Columns object.
  */
@@ -34,6 +36,16 @@ const props = defineProps({
     required: true,
     default: {},
   },
+  operation: {
+    type: String,
+    required: false,
+    default: "edit",
+  },
+  oldServerName: {
+    type: String,
+    required: false,
+    default: "",
+  },
   containerClass: {
     type: String,
     required: false,
@@ -151,6 +163,11 @@ const buttonSave = {
 onBeforeMount(() => {
   rawForm.setRawData(json2raw(props.template));
 });
+
+onMounted(() => {
+  rawForm.setOperation(props.operation);
+  rawForm.setOldServerName(props.oldServerName);
+});
 </script>
 
 <template>

src/ui/client/dashboard/components/Form/Templates.vue

@@ -24,6 +24,8 @@ import { v4 as uuidv4 } from "uuid";
  *    }
  *  }
  * @param {object} templates - List of advanced templates that contains settings. Must be a dict with mode as key, then the template name as key with a list of data (different for each modes).
+ * @param {string} [operation="edit"] - Operation type (edit, new, delete).
+ * @param {string} [oldServerName=""] - Old server name. This is a server name before any changes.
  */
 
 const props = defineProps({
@@ -32,6 +34,16 @@ const props = defineProps({
     required: true,
     default: {},
   },
+  operation: {
+    type: String,
+    required: false,
+    default: "edit",
+  },
+  oldServerName: {
+    type: String,
+    required: false,
+    default: "",
+  },
 });
 
 const comboboxTemplate = {
@@ -131,14 +143,20 @@ onBeforeMount(() => {
     <Advanced
       v-if="data.currModeName === 'advanced'"
       :template="props.templates[data.currModeName][data.currTemplateName]"
+      :operation="props.operation"
+      :oldServerName="props.oldServerName"
     />
     <Raw
       v-if="data.currModeName === 'raw'"
       :template="props.templates[data.currModeName][data.currTemplateName]"
+      :operation="props.operation"
+      :oldServerName="props.oldServerName"
     />
     <Easy
       v-if="data.currModeName === 'easy'"
       :template="props.templates[data.currModeName][data.currTemplateName]"
+      :operation="props.operation"
+      :oldServerName="props.oldServerName"
     />
   </Container>
 </template>

src/ui/client/dashboard/lang/en.json

@@ -87,7 +87,7 @@
   "dashboard_status_warning": "status warning or alert.",
   "dashboard_status_info": "status loading or waiting or unknown.",
   "dashboard_raw_mode": "raw mode",
-  "dashboard_raw_mode_subtitle": "Raw mode shows settings as raw key-value pairs of settings (disabled and default ones exclude).",
+  "dashboard_raw_mode_subtitle": "Raw mode shows settings as raw key-value pairs of settings (disabled ones will be shown but not updated on save).",
   "dashboard_raw_invalid": "RAW format is invalid",
   "dashboard_advanced_mode": "Advanced mode",
   "dashboard_advanced_mode_subtitle": "Advanced mode show settings by plugin in dedicated fields.",
@@ -280,8 +280,8 @@
   "services_plugins_title": "Details",
   "services_edit_title": "Edit",
   "services_edit_subtitle": "Choose a mode to edit service",
-  "services_create_title": "create service",
-  "services_create_subtitle": "Choose a mode to create a new service",
+  "services_new_title": "new service",
+  "services_new_subtitle": "Choose a mode to create a new service",
   "services_mode_easy": "Easy mode",
   "services_mode_raw": "Raw mode",
   "services_mode_advanced": "Advanced mode",
@@ -297,6 +297,5 @@
   "services_settings_table_status": "Status",
   "services_mode_title": "Service mode",
   "services_mode_subtitle": "Manage your service settings.",
-  "services_manage_title": "Service {service_name}",
   "services_manage_subtitle": "Manage your service settings."
 }