feat: improve error messages

translate on frontend Refs: XRDDEV-2668
nordic-institute · Dec 19, 2024 · dfd5731 · dfd5731
1 parent afcdd92
commit dfd5731
Show file tree

Hide file tree

Showing 11 changed files with 79 additions and 151 deletions.
diff --git a/src/central-server/admin-service/ui/src/components/ui/ContextualAlerts.vue b/src/central-server/admin-service/ui/src/components/ui/ContextualAlerts.vue
@@ -28,12 +28,12 @@
   <div>
     <!-- Error -->
     <v-container
-      v-if="errorNotifications && errorNotifications.length > 0"
+      v-if="notifications.errorNotifications && notifications.errorNotifications.length > 0"
       fluid
       class="alerts-container px-3"
     >
       <v-alert
-        v-for="notification in errorNotifications"
+        v-for="notification in notifications.errorNotifications"
         :key="notification.timeAdded"
         v-model="notification.show"
         data-test="contextual-alert"
@@ -53,7 +53,7 @@
 
               <!-- Show localised text by id from error object -->
               <div v-else-if="notification.errorCode">
-                {{ $t('error_code.' + notification.errorCode) }}
+                {{ $t(errorCodePrefix + notification.errorCode) }}
               </div>
 
               <!-- If error doesn't have a text or localisation key then just print the error object -->
@@ -65,19 +65,17 @@
               <div v-if="notification.errorCode === 'token_weak_pin'">
                 <div>
                   {{
-                    $t(`error_code.${notification.metaData?.[0]}`) +
-                    `: ${notification.metaData?.[1]}`
+                    $t(errorCodePrefix + notification.metaData?.[0]) + ': ' + notification.metaData?.[1]
                   }}
                 </div>
                 <div>
                   {{
-                    $t(`error_code.${notification.metaData?.[2]}`) +
-                    `: ${notification.metaData?.[3]}`
+                    $t(errorCodePrefix + notification.metaData?.[2]) + ': ' + notification.metaData?.[3]
                   }}
                 </div>
               </div>
               <div v-for="meta in notification.metaData" v-else :key="meta">
-                {{ meta }}
+                {{ meta.startsWith(metaPrefix) ? $t(meta) : meta }}
               </div>
 
               <!-- Show validation errors -->
@@ -126,7 +124,8 @@
             <xrd-icon-base class="xrd-large-button-icon">
               <XrdIconCopy />
             </xrd-icon-base>
-            {{ $t('action.copyId') }}</xrd-button
+            {{ $t('action.copyId') }}
+          </xrd-button
           >
 
           <!-- Handle possible action -->
@@ -149,49 +148,48 @@
             variant="plain"
             @click="closeError(notification.timeAdded)"
           >
-            <xrd-icon-base><xrd-icon-close /></xrd-icon-base>
+            <xrd-icon-base>
+              <xrd-icon-close />
+            </xrd-icon-base>
           </v-btn>
         </template>
       </v-alert>
     </v-container>
   </div>
 </template>
 
-<script lang="ts">
-import { defineComponent } from 'vue';
-import { mapActions, mapState } from 'pinia';
+<script lang="ts" setup>
 import { useNotifications } from '@/store/modules/notifications';
 import { toClipboard } from '@/util/helpers';
 import { Notification } from '@/ui-types';
+import { useRouter } from 'vue-router';
+
+const errorCodePrefix = 'error_code.';
+const metaPrefix = 'meta.';
+
+const notifications = useNotifications();
+const router = useRouter();
+
+function closeError(id: number): void {
+  notifications.deleteNotification(id);
+}
+
+function copyId(notification: Notification): void {
+  const id = notification.errorId;
+  if (id) {
+    toClipboard(id);
+  }
+}
+
+function routeAction(notification: Notification): void {
+  if (notification.action) {
+    router.push({
+      name: notification.action.route,
+    });
+  }
+  closeError(notification.timeAdded);
+}
 
-export default defineComponent({
-  // Component for contextual notifications
-  computed: {
-    ...mapState(useNotifications, ['errorNotifications']),
-  },
-  methods: {
-    ...mapActions(useNotifications, ['deleteNotification']),
-
-    closeError(id: number): void {
-      this.deleteNotification(id);
-    },
-    copyId(notification: Notification): void {
-      const id = notification.errorId;
-      if (id) {
-        toClipboard(id);
-      }
-    },
-
-    routeAction(notification: Notification): void {
-      if (notification.action) {
-        this.$router.push({
-          name: notification.action.route,
-        });
-      }
-      this.closeError(notification.timeAdded);
-    },
-  },
-});
 </script>
 
 <style lang="scss" scoped>

diff --git a/src/common/common-admin-api/src/main/java/org/niis/xroad/restapi/config/MessagesConfig.java b/src/common/common-admin-api/src/main/java/org/niis/xroad/restapi/config/MessagesConfig.java
diff --git a/...common-admin-api/src/main/java/org/niis/xroad/restapi/exceptions/ExceptionTranslator.java b/...common-admin-api/src/main/java/org/niis/xroad/restapi/exceptions/ExceptionTranslator.java
@@ -32,9 +32,7 @@
 import org.niis.xroad.common.exception.ServiceException;
 import org.niis.xroad.restapi.openapi.model.CodeWithDetails;
 import org.niis.xroad.restapi.openapi.model.ErrorInfo;
-import org.niis.xroad.restapi.util.RequestHelper;
 import org.springframework.beans.factory.annotation.Autowired;
-import org.springframework.context.support.MessageSourceAccessor;
 import org.springframework.http.HttpStatus;
 import org.springframework.http.HttpStatusCode;
 import org.springframework.http.MediaType;
@@ -45,7 +43,6 @@
 import java.util.HashMap;
 import java.util.LinkedList;
 import java.util.List;
-import java.util.Locale;
 import java.util.Map;
 
 import static org.niis.xroad.restapi.exceptions.DeviationCodes.ERROR_VALIDATION_FAILURE;
@@ -58,18 +55,13 @@
 public class ExceptionTranslator {
 
     public static final String CORE_CODED_EXCEPTION_PREFIX = "core.";
+    public static final String META_PREFIX = "meta.";
 
     private final ValidationErrorHelper validationErrorHelper;
-    private final RequestHelper requestHelper;
-    private final MessageSourceAccessor errorsMessageSourceAccessor;
 
     @Autowired
-    public ExceptionTranslator(ValidationErrorHelper validationErrorHelper,
-                               RequestHelper requestHelper,
-                               MessageSourceAccessor errorsMessageSourceAccessor) {
+    public ExceptionTranslator(ValidationErrorHelper validationErrorHelper) {
         this.validationErrorHelper = validationErrorHelper;
-        this.requestHelper = requestHelper;
-        this.errorsMessageSourceAccessor = errorsMessageSourceAccessor;
     }
 
     /**
@@ -141,15 +133,11 @@ private void attachCausedBySignerIfNeeded(Throwable e, ErrorInfo errorDto) {
         if (isCausedBySignerException(e)) {
             var metadata = errorDto.getError().getMetadata();
             metadata = metadata == null ? new LinkedList<>() : new LinkedList<>(metadata);
-            metadata.add(errorsMessageSourceAccessor.getMessage("check_signer_logs", getLocale()));
+            metadata.add(META_PREFIX + "check_signer_logs");
             errorDto.getError().setMetadata(metadata);
         }
     }
 
-    private Locale getLocale() {
-        return requestHelper.getCurrentHttpRequest().getLocale();
-    }
-
     public HttpStatusCode resolveHttpStatus(Exception e, HttpStatus defaultStatus) {
         if (e instanceof ServiceException se) {
             return HttpStatus.resolve(se.getHttpStatus());

diff --git a/src/common/common-admin-api/src/main/resources/locales/errors.properties b/src/common/common-admin-api/src/main/resources/locales/errors.properties
diff --git a/src/common/common-admin-api/src/main/resources/locales/errors_es.properties b/src/common/common-admin-api/src/main/resources/locales/errors_es.properties
diff --git a/src/common/common-admin-api/src/main/resources/locales/errors_et.properties b/src/common/common-admin-api/src/main/resources/locales/errors_et.properties
diff --git a/.../common-admin-api/src/test/java/org/niis/xroad/restapi/config/audit/AuditLoggingTest.java b/.../common-admin-api/src/test/java/org/niis/xroad/restapi/config/audit/AuditLoggingTest.java
@@ -36,10 +36,8 @@
 import org.springframework.boot.autoconfigure.EnableAutoConfiguration;
 import org.springframework.boot.test.autoconfigure.web.servlet.AutoConfigureMockMvc;
 import org.springframework.boot.test.context.SpringBootTest;
-import org.springframework.boot.test.mock.mockito.MockBean;
 import org.springframework.boot.test.mock.mockito.SpyBean;
 import org.springframework.context.annotation.ComponentScan;
-import org.springframework.context.support.MessageSourceAccessor;
 import org.springframework.http.MediaType;
 import org.springframework.http.ResponseEntity;
 import org.springframework.security.access.prepost.PreAuthorize;
@@ -83,9 +81,6 @@ class AuditLoggingTest {
     @SpyBean
     AuditEventLoggingFacadeImpl auditEventLoggingFacade;
 
-    @MockBean
-    MessageSourceAccessor errorsMessageSourceAccessor;
-
     @Autowired
     protected MockMvc mockMvc;
 

diff --git a/src/security-server/admin-service/ui/src/components/ui/ContextualAlerts.vue b/src/security-server/admin-service/ui/src/components/ui/ContextualAlerts.vue
@@ -26,12 +26,12 @@
 <template>
   <!-- Error -->
   <v-container
-    v-if="errorNotifications && errorNotifications.length > 0"
+    v-if="notifications.errorNotifications && notifications.errorNotifications.length > 0"
     fluid
     class="alerts-container px-3"
   >
     <v-alert
-      v-for="notification in errorNotifications"
+      v-for="notification in notifications.errorNotifications"
       :key="notification.timeAdded"
       v-model="notification.show"
       data-test="contextual-alert"
@@ -57,7 +57,7 @@
 
             <!-- Show localised text by id from error object -->
             <div v-else-if="notification.errorCode">
-              {{ $t(`error_code.${notification.errorCode}`) }}
+              {{ $t(errorCodePrefix + notification.errorCode) }}
             </div>
 
             <!-- If error doesn't have a text or localisation key then just print the error object -->
@@ -69,21 +69,19 @@
             <template v-if="notification.errorCode === 'weak_pin'">
               <div>
                 {{
-                  $t(`error_code.${notification.metaData?.[0]}`) +
-                  `: ${notification.metaData?.[1]}`
+                  $t(errorCodePrefix + notification.metaData?.[0]) + ': ' + notification.metaData?.[1]
                 }}
               </div>
               <div>
                 {{
-                  $t(`error_code.${notification.metaData?.[2]}`) +
-                  `: ${notification.metaData?.[3]}`
+                  $t(errorCodePrefix + notification.metaData?.[2]) + ': ' + notification.metaData?.[3]
                 }}
               </div>
             </template>
 
             <!-- Show the error metadata if it exists -->
             <div v-for="meta in notification.metaData" v-else :key="meta">
-              {{ meta }}
+              {{ meta.startsWith(metaPrefix) ? $t(meta) : meta }}
             </div>
 
             <!-- Show validation errors -->
@@ -154,43 +152,33 @@
   </v-container>
 </template>
 
-<script lang="ts">
-import { defineComponent } from 'vue';
-import { mapActions, mapState } from 'pinia';
+<script lang="ts" setup>
 import { useNotifications } from '@/store/modules/notifications';
 import { toClipboard } from '@/util/helpers';
 import { Notification } from '@/ui-types';
 import { Colors } from '@/global';
-import {
-  XrdIconCopy,
-  XrdIconErrorNotification,
-  XrdIconWarning,
-} from '@niis/shared-ui';
+import { XrdIconCopy, XrdIconErrorNotification, XrdIconWarning } from '@niis/shared-ui';
 
-export default defineComponent({
-  components: { XrdIconWarning, XrdIconErrorNotification, XrdIconCopy },
-  // Component for contextual notifications
-  computed: {
-    ...mapState(useNotifications, ['errorNotifications']),
-  },
-  methods: {
-    notificationColor(notification: Notification) {
-      // TODO - how to import these values from colors.css?
-      return notification.isWarning ? Colors.Warning : Colors.Error;
-    },
-    ...mapActions(useNotifications, ['deleteNotification']),
+const errorCodePrefix = 'error_code.';
+const metaPrefix = 'meta.';
 
-    closeError(id: number): void {
-      this.deleteNotification(id);
-    },
-    copyId(notification: Notification): void {
-      const id = notification.errorId;
-      if (id) {
-        toClipboard(id);
-      }
-    },
-  },
-});
+const notifications = useNotifications();
+
+function notificationColor(notification: Notification) {
+  // TODO - how to import these values from colors.css?
+  return notification.isWarning ? Colors.Warning : Colors.Error;
+}
+
+function closeError(id: number): void {
+  notifications.deleteNotification(id);
+}
+
+function copyId(notification: Notification): void {
+  const id = notification.errorId;
+  if (id) {
+    toClipboard(id);
+  }
+}
 </script>
 
 <style lang="scss" scoped>
@@ -229,6 +217,7 @@ export default defineComponent({
     margin-right: 12px;
     color: colors.$Error;
   }
+
   .warning-icon {
     margin-right: 12px;
     color: colors.$Warning;