fix(service-portal): Documents dl url & notifications api - hotfix

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
 

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

@@ -51,6 +51,8 @@ export const NotificationLine = ({ data, onClickCallback }: Props) => {
             <AvatarImage
               img={data.sender.logoUrl}
               background={!isRead ? 'white' : 'blue100'}
+              as="div"
+              imageClass={styles.img}
             />
           ) : undefined}
           <Box

apps/service-portal/src/components/Notifications/Notifications.css.ts

@@ -9,6 +9,14 @@ export const link = style({
   overflow: 'hidden',
 })
 
+export const img = style({
+  height: 'auto',
+  width: 'auto',
+  display: 'flex',
+  maxHeight: 28,
+  maxWidth: 28,
+})
+
 globalStyle(`${link} > span`, {
   boxShadow: 'none',
 })

libs/api/domains/documents/src/lib/documentV2.service.ts

@@ -62,6 +62,7 @@ export class DocumentServiceV2 {
       publicationDate: document.date,
       id: documentId,
       name: document.fileName,
+      downloadUrl: `${this.downloadServiceConfig.baseUrl}/download/v1/electronic-documents/${documentId}`,
       sender: {
         id: document.senderNationalId,
         name: document.senderName,

libs/api/domains/notifications/src/lib/notifications.resolver.ts

@@ -13,7 +13,6 @@ import {
 } from './notifications.model'
 import type { Locale } from '@island.is/shared/types'
 import { LOGGER_PROVIDER, type Logger } from '@island.is/logging'
-import { FeatureFlag, Features } from '@island.is/nest/feature-flags'
 
 const LOG_CATEGORY = 'notifications-resolver'
 export const AUDIT_NAMESPACE = 'notifications-resolver'
@@ -22,7 +21,6 @@ export const AUDIT_NAMESPACE = 'notifications-resolver'
 @Resolver()
 @Audit({ namespace: AUDIT_NAMESPACE })
 @Scopes(DocumentsScope.main)
-@FeatureFlag(Features.ServicePortalNotificationsEnabled)
 export class NotificationsResolver {
   constructor(
     private readonly service: NotificationsService,

libs/api/domains/notifications/src/lib/notificationsList.resolver.ts

@@ -26,7 +26,6 @@ import type { Locale } from '@island.is/shared/types'
 import { LOGGER_PROVIDER, type Logger } from '@island.is/logging'
 import { Loader } from '@island.is/nest/dataloader'
 import { AUDIT_NAMESPACE } from './notifications.resolver'
-import { FeatureFlag, Features } from '@island.is/nest/feature-flags'
 import { DocumentsScope } from '@island.is/auth/scopes'
 
 const LOG_CATEGORY = 'notification-list-resolver'
@@ -35,7 +34,6 @@ const LOG_CATEGORY = 'notification-list-resolver'
 @Resolver(() => NotificationsResponse)
 @Audit({ namespace: AUDIT_NAMESPACE })
 @Scopes(DocumentsScope.main)
-@FeatureFlag(Features.ServicePortalNotificationsEnabled)
 export class NotificationsListResolver {
   constructor(
     private readonly service: NotificationsService,

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/core/src/components/ActionCard/ActionCard.css.ts

@@ -30,9 +30,11 @@ export const avatar = style({
 })
 
 export const circleImg = style({
-  width: '28px',
   height: 'auto',
+  width: 'auto',
   display: 'flex',
+  maxHeight: 38,
+  maxWidth: 38,
 })
 
 export const button = style({

libs/service-portal/documents/src/components/DocumentLine/AvatarImage.tsx

@@ -13,13 +13,17 @@ interface Props {
   avatar?: ReactNode
   onClick?: (event: MouseEvent<HTMLElement>) => void
   large?: boolean
+  as?: 'div' | 'button'
+  imageClass?: string
 }
 
 export const AvatarImage: FC<Props> = ({
   img,
   background,
   avatar,
   large,
+  imageClass,
+  as = 'button',
   onClick,
 }) => {
   const { formatMessage } = useLocale()
@@ -38,14 +42,24 @@ export const AvatarImage: FC<Props> = ({
       className={cn(styles.imageContainer, {
         [styles.largeAvatar]: large,
       })}
-      component="button"
-      aria-label={formatMessage(messages.markAsBulkSelection)}
+      component={as}
+      aria-label={
+        as === 'button'
+          ? formatMessage(messages.markAsBulkSelection)
+          : undefined
+      }
       onClick={onClick}
     >
       {avatar ? (
         avatar
       ) : (
-        <img className={styles.image} src={img} alt="document" />
+        <img
+          className={cn(styles.image, {
+            [`${imageClass}`]: imageClass,
+          })}
+          src={img}
+          alt="document"
+        />
       )}
     </Box>
   )

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 GetUserNotificationsList($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,
@@ -17,7 +17,7 @@ import {
 } from '@island.is/service-portal/core'
 
 import {
-  useGetUserNotificationsQuery,
+  useGetUserNotificationsListQuery,
   useMarkAllNotificationsAsReadMutation,
   useMarkUserNotificationAsReadMutation,
 } from './Notifications.generated'
@@ -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()
@@ -47,16 +47,21 @@ const UserNotifications = () => {
   })
 
   const { data, loading, error, refetch, fetchMore } =
-    useGetUserNotificationsQuery({
+    useGetUserNotificationsListQuery({
       variables: {
         input: {
           limit: DEFAULT_PAGE_SIZE,
           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 (