Fix

NethServer · Jun 26, 2024 · b51c3b7 · b51c3b7
1 parent 3144893
commit b51c3b7
Show file tree

Hide file tree

Showing 6 changed files with 127 additions and 11 deletions.
diff --git a/core/ui/public/i18n/en/translation.json b/core/ui/public/i18n/en/translation.json
@@ -942,6 +942,8 @@
         "loki_instance_title": "Multiple Loki instance",
         "loki_instance_description": "Logs are stored in more than one Loki instance. Choose one in the field below.",
         "loki_tooltip": "Search logs from the active Loki instance, from a former leader node or from a Loki backup.",
+        "cannot_retrieve_loki_instances": "Cannot retrieve loki instances",
+        "cannot_configure_forwarder": "Cannot configure forwarder",
         "loki": {
             "title": "Loki",
             "tooltip": "Cluster nodes transmit their log streams to the active Loki instance, which operates on the leader node. When a leader node is replaced, the previous leader node retains its inactive Loki instance, allowing the System logs page to search through it until it is uninstalled.",

diff --git a/core/ui/src/components/settings/CloudLogManagerConfigureModal.vue b/core/ui/src/components/settings/CloudLogManagerConfigureModal.vue
@@ -29,11 +29,13 @@
           v-if="toggleEnabled"
           :label="$t('cloud_log_manager_forwarder.address')"
           v-model="address"
+          :invalid-message="error.address"
         />
         <NsTextInput
           v-if="toggleEnabled"
           :label="$t('cloud_log_manager_forwarder.tenant')"
           v-model="tenant"
+          :invalid-message="error.tenant"
         >
           <template slot="tooltip">
             <span
@@ -109,6 +111,13 @@
         :actionLabel="$t('cloud_log_manager_forwarder.more_details')"
         @action="goToMoreDetails"
       />
+      <NsInlineNotification
+        v-if="error.setCloudLogManager"
+        kind="error"
+        :title="$t('system_logs.cannot_configure_forwarder')"
+        :description="error.setCloudLogManager"
+        :showCloseButton="false"
+      />
     </template>
     <template slot="secondary-button">{{ $t("common.cancel") }}</template>
     <template slot="primary-button">{{ $t("common.configure") }}</template>
@@ -156,6 +165,11 @@ export default {
       loading: {
         setCloudLogManager: false,
       },
+      error: {
+        address: "",
+        tenant: "",
+        setCloudLogManager: "",
+      },
       calOptions: {
         dateFormat: "Y-m-d",
       },
@@ -213,8 +227,28 @@ export default {
       this.date = this.formatDate(new Date(), "yyyy-MM-dd");
       this.time = "00:00";
     },
+    validateCloudLogManagerInput() {
+      this.clearErrors(this);
+      let isValidationOk = true;
+
+      if (!this.address) {
+        this.error.address = this.$t("common.required");
+        isValidationOk = false;
+      }
+      if (!this.tenant) {
+        this.error.tenant = this.$t("common.required");
+        isValidationOk = false;
+      }
+
+      return isValidationOk;
+    },
     async setCloudLogManager() {
+      if (!this.validateCloudLogManagerInput()) {
+        return;
+      }
+
       this.loading.setCloudLogManager = true;
+      this.error.setCloudLogManager = "";
       const taskAction = "set-clm-forwarder";
 
       // register to task abortion
@@ -256,11 +290,13 @@ export default {
 
       if (err) {
         console.error(`error creating task ${taskAction}`, err);
+        this.error.setCloudLogManager = this.getErrorMessage(err);
         return;
       }
     },
     setCloudLogManagerAborted(taskResult, taskContext) {
       console.error(`${taskContext.action} aborted`, taskResult);
+      this.error.setCloudLogManager = this.$t("error.generic_error");
       this.loading.setCloudLogManager = false;
     },
     setCloudLogManagerCompleted() {

diff --git a/core/ui/src/components/settings/LokiCard.vue b/core/ui/src/components/settings/LokiCard.vue
@@ -150,12 +150,12 @@ export default {
   computed: {
     activeFromFormatted() {
       return this.activeFrom
-        ? this.formatDate(new Date(this.activeFrom), "dd/MM/yyyy")
+        ? this.formatDate(new Date(this.activeFrom), "P")
         : "";
     },
     activeToFormatted() {
       return this.activeTo
-        ? this.formatDate(new Date(this.activeTo), "dd/MM/yyyy")
+        ? this.formatDate(new Date(this.activeTo), "P")
         : "";
     },
     activeText() {

diff --git a/core/ui/src/components/settings/SyslogConfigureModal.vue b/core/ui/src/components/settings/SyslogConfigureModal.vue
@@ -28,11 +28,13 @@
           v-if="toggleEnabled"
           :label="$t('syslog_forwarder.hostname_ip_address')"
           v-model="address"
+          :invalid-message="error.address"
         />
         <NsTextInput
           v-if="toggleEnabled"
           :label="$t('syslog_forwarder.port')"
           v-model="port"
+          :invalid-message="error.port"
         />
         <div v-if="toggleEnabled">
           <label for="protocol" :class="`${carbonPrefix}--label`">{{
@@ -151,6 +153,13 @@
           </cv-column>
         </cv-row>
       </cv-form>
+      <NsInlineNotification
+        v-if="error.setSyslog"
+        kind="error"
+        :title="$t('system_logs.cannot_configure_forwarder')"
+        :description="error.setSyslog"
+        :showCloseButton="false"
+      />
     </template>
     <template slot="secondary-button">{{ $t("common.cancel") }}</template>
     <template slot="primary-button">{{ $t("common.configure") }}</template>
@@ -196,6 +205,11 @@ export default {
       loading: {
         setSyslog: false,
       },
+      error: {
+        address: "",
+        port: "",
+        setSyslog: "",
+      },
       calOptions: {
         dateFormat: "Y-m-d",
       },
@@ -248,8 +262,37 @@ export default {
       this.date = this.formatDate(new Date(), "yyyy-MM-dd");
       this.time = "00:00";
     },
+    validateSyslogInput() {
+      this.clearErrors(this);
+      let isValidationOk = true;
+
+      if (!this.address) {
+        this.error.address = this.$t("common.required");
+        isValidationOk = false;
+      }
+
+      if (!this.port) {
+        this.error.port = this.$t("common.required");
+        isValidationOk = false;
+      }
+      if (this.port && isNaN(this.port)) {
+        this.error.port = this.$t("system_logs.loki.valid_number");
+        isValidationOk = false;
+      }
+      if (this.port && this.port <= 0) {
+        this.error.port = this.$t("system_logs.loki.greater_than_0");
+        isValidationOk = false;
+      }
+
+      return isValidationOk;
+    },
     async setSyslog() {
+      if (!this.validateSyslogInput()) {
+        return;
+      }
+
       this.loading.setSyslog = true;
+      this.error.setSyslog = "";
       const taskAction = "set-syslog-forwarder";
 
       // register to task abortion
@@ -290,11 +333,13 @@ export default {
 
       if (err) {
         console.error(`error creating task ${taskAction}`, err);
+        this.error.setSyslog = this.getErrorMessage(err);
         return;
       }
     },
     setSyslogAborted(taskResult, taskContext) {
       console.error(`${taskContext.action} aborted`, taskResult);
+      this.error.setSyslog = this.$t("error.generic_error");
       this.loading.setSyslog = false;
     },
     setSyslogCompleted() {

diff --git a/core/ui/src/views/ClusterStatus.vue b/core/ui/src/views/ClusterStatus.vue
@@ -921,7 +921,11 @@ export default {
     getClusterLokiInstancesCompleted(taskContext, taskResult) {
       for (const instance of taskResult.output.instances) {
         if (instance.active) {
-          this.activeLokiInstance = instance.instance_id;
+          if (instance.instance_label != "") {
+            this.activeLokiInstance = instance.instance_label;
+          } else {
+            this.activeLokiInstance = instance.instance_id;
+          }
           this.cloudLogManagerForwarderStatus =
             instance.cloud_log_manager.status;
           this.syslogForwarderStatus = instance.syslog.status;

diff --git a/core/ui/src/views/settings/SettingsSystemLogs.vue b/core/ui/src/views/settings/SettingsSystemLogs.vue
@@ -39,7 +39,21 @@
         </h2>
       </cv-column>
     </cv-row>
-    <cv-row v-if="loading.lokiInstances">
+    <NsInlineNotification
+      v-if="error.lokiInstances"
+      kind="error"
+      :title="$t('system_logs.cannot_retrieve_loki_instances')"
+      :description="error.lokiInstances"
+      :showCloseButton="false"
+    />
+    <NsInlineNotification
+      v-if="error.subscription"
+      kind="error"
+      :title="$t('error.cannot_retrieve_subscription_status')"
+      :description="error.subscription"
+      :showCloseButton="false"
+    />
+    <cv-row v-if="loading.lokiInstances && loading.subscription">
       <cv-column :md="4" :xlg="4">
         <NsTile :light="true" :icon="Catalog32">
           <cv-skeleton-text
@@ -172,6 +186,7 @@
               :helper-text="$t('system_logs.loki.days')"
               ref="newRetention"
               :invalid-message="error.newRetention"
+              data-modal-primary-focus
             >
             </cv-text-input>
             <div v-if="error.setLokiInstanceRetention">
@@ -186,7 +201,7 @@
         </template>
       </template>
       <template slot="secondary-button">{{ $t("common.cancel") }}</template>
-      <template slot="primary-button">{{ $t("common.edit") }}</template>
+      <template slot="primary-button">{{ $t("common.save") }}</template>
     </NsModal>
     <NsModal
       size="default"
@@ -211,6 +226,7 @@
               maxlength="24"
               ref="newLabel"
               :invalid-message="error.newLabel"
+              data-modal-primary-focus
             >
             </cv-text-input>
             <div v-if="error.setLokiInstanceLabel">
@@ -225,7 +241,7 @@
         </template>
       </template>
       <template slot="secondary-button">{{ $t("common.cancel") }}</template>
-      <template slot="primary-button">{{ $t("common.edit") }}</template>
+      <template slot="primary-button">{{ $t("common.save") }}</template>
     </NsModal>
     <NsModal
       kind="danger"
@@ -361,12 +377,14 @@ export default {
       newLabel: "",
       loading: {
         lokiInstances: false,
+        subscription: false,
         setLokiInstanceRetention: false,
         setLokiInstanceLabel: false,
         uninstallLokiInstance: false,
       },
       error: {
-        getClusterLokiInstances: "",
+        lokiInstances: "",
+        subscription: "",
         setLokiInstanceRetention: "",
         setLokiInstanceLabel: "",
         uninstallLokiInstance: "",
@@ -392,7 +410,7 @@ export default {
   methods: {
     async getClusterLokiInstances() {
       this.loading.lokiInstances = true;
-      this.error.getClusterLokiInstances = "";
+      this.error.lokiInstances = "";
       const taskAction = "list-loki-instances";
 
       // register to task abortion
@@ -419,13 +437,13 @@ export default {
 
       if (err) {
         console.error(`error creating task ${taskAction}`, err);
-        this.error.getClusterLokiInstances = this.getErrorMessage(err);
+        this.error.lokiInstances = this.getErrorMessage(err);
         return;
       }
     },
     getClusterLokiInstancesAborted(taskResult, taskContext) {
       console.error(`${taskContext.action} aborted`, taskResult);
-      this.error.getClusterLokiInstances = this.$t("error.generic_error");
+      this.error.lokiInstances = this.$t("error.generic_error");
       this.loading.lokiInstances = false;
     },
     getClusterLokiInstancesCompleted(taskContext, taskResult) {
@@ -610,8 +628,13 @@ export default {
       this.getClusterLokiInstances();
     },
     async getSubscription() {
+      this.loading.subscription = true;
+      this.error.subscription = "";
       const taskAction = "get-subscription";
 
+      // register to task abortion
+      this.$root.$once(taskAction + "-aborted", this.getSubscriptionAborted);
+
       // register to task completion
       this.$root.$once(
         taskAction + "-completed",
@@ -632,15 +655,21 @@ export default {
 
       if (err) {
         console.error(`error creating task ${taskAction}`, err);
-        this.error.getSubscription = this.getErrorMessage(err);
+        this.error.subscription = this.getErrorMessage(err);
         return;
       }
     },
+    getSubscriptionAborted(taskResult, taskContext) {
+      console.error(`${taskContext.action} aborted`, taskResult);
+      this.error.subscription = this.$t("error.generic_error");
+      this.loading.subscription = false;
+    },
     getSubscriptionCompleted(taskContext, taskResult) {
       const output = taskResult.output;
       if (output.subscription != null) {
         this.subscription = true;
       }
+      this.loading.subscription = false;
     },
   },
 };