fix(service-portal): Notifications - locale updates. Add cleanstring

apps/service-portal/src/components/Notifications/NotificationButton.tsx

@@ -24,21 +24,26 @@ const NotificationButton = ({
   showMenu = false,
   disabled,
 }: Props) => {
-  const { formatMessage } = useLocale()
+  const { formatMessage, lang } = useLocale()
   const [hasMarkedLocally, setHasMarkedLocally] = useState(false)
   const [markAllAsSeen] = useMarkAllNotificationsAsSeenMutation()
   const { width } = useWindowSize()
   const isMobile = width < theme.breakpoints.md
   const ref = useRef<HTMLButtonElement>(null)
 
-  const { data } = useGetUserNotificationsOverviewQuery({
+  const { data, refetch } = useGetUserNotificationsOverviewQuery({
     variables: {
       input: {
         limit: 5,
       },
+      locale: lang,
     },
   })
 
+  useEffect(() => {
+    refetch()
+  }, [lang, refetch])
+
   const showBadge =
     !!data?.userNotificationsOverview?.unseenCount && !hasMarkedLocally
 

libs/api/domains/notifications/src/utils/helpers.ts

@@ -1,6 +1,13 @@
 import { RenderedNotificationDto } from '@island.is/clients/user-notification'
 import { Notification } from '../lib/notifications.model'
 
+const cleanString = (str?: string) => {
+  if (!str) {
+    return ''
+  }
+  return str.replace(/\s+/g, ' ').trim()
+}
+
 export const notificationMapper = (
   notification: RenderedNotificationDto,
 ): Notification => ({
@@ -20,10 +27,12 @@ export const notificationMapper = (
     nationalId: undefined,
   },
   message: {
-    title: notification.title,
-    body: notification.body,
-    dataCopy: notification.dataCopy,
-    displayBody: notification.dataCopy ?? notification.body,
+    title: cleanString(notification.title),
+    body: cleanString(notification.body),
+    dataCopy: notification.dataCopy
+      ? cleanString(notification.dataCopy)
+      : undefined,
+    displayBody: cleanString(notification.dataCopy ?? notification.body),
     link: {
       url: notification.clickActionUrl,
     },

libs/service-portal/information/src/screens/Notifications/Notifications.graphql

@@ -32,8 +32,8 @@ fragment NotificationDataFields on Notification {
   }
 }
 
-query GetUserNotifications($input: NotificationsInput!) {
-  userNotifications(input: $input) {
+query GetUserNotifications($input: NotificationsInput!, $locale: String!) {
+  userNotifications(input: $input, locale: $locale) {
     data {
       ...NotificationDataFields
       recipient {
@@ -52,8 +52,11 @@ query GetUserNotifications($input: NotificationsInput!) {
   }
 }
 
-query GetUserNotificationsOverview($input: NotificationsInput!) {
-  userNotificationsOverview: userNotifications(input: $input) {
+query GetUserNotificationsOverview(
+  $input: NotificationsInput!
+  $locale: String!
+) {
+  userNotificationsOverview: userNotifications(input: $input, locale: $locale) {
     data {
       ...NotificationDataFields
     }

libs/service-portal/information/src/screens/Notifications/Notifications.tsx

@@ -1,4 +1,4 @@
-import { useState } from 'react'
+import { useEffect, useState } from 'react'
 import {
   Box,
   Button,
@@ -32,7 +32,7 @@ const DEFAULT_PAGE_SIZE = 5
 
 const UserNotifications = () => {
   useNamespaces('sp.information-notifications')
-  const { formatMessage } = useLocale()
+  const { formatMessage, lang } = useLocale()
   const [loadingMore, setLoadingMore] = useState(false)
 
   const [postMarkAsRead] = useMarkUserNotificationAsReadMutation()
@@ -54,9 +54,14 @@ const UserNotifications = () => {
           before: '',
           after: '',
         },
+        locale: lang,
       },
     })
 
+  useEffect(() => {
+    refetch()
+  }, [refetch, lang])
+
   const loadMore = (cursor: string) => {
     if (loadingMore) return
     setLoadingMore(true)
@@ -67,6 +72,7 @@ const UserNotifications = () => {
           before: '',
           after: cursor,
         },
+        locale: lang,
       },
       updateQuery: (prevResult, { fetchMoreResult }) => {
         if (