diff --git a/openmetadata-ui/src/main/resources/ui/src/components/NotificationBox/NotificationBox.component.tsx b/openmetadata-ui/src/main/resources/ui/src/components/NotificationBox/NotificationBox.component.tsx index 7ad5765737a..f9dad1a4ca3 100644 --- a/openmetadata-ui/src/main/resources/ui/src/components/NotificationBox/NotificationBox.component.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/components/NotificationBox/NotificationBox.component.tsx @@ -16,7 +16,10 @@ import { isEmpty } from 'lodash'; import React, { useCallback, useEffect, useMemo, useState } from 'react'; import AppState from '../../AppState'; import { getFeedsWithFilter } from '../../axiosAPIs/feedsAPI'; -import { getUserPath } from '../../constants/constants'; +import { + getUserPath, + NOTIFICATION_READ_TIMER, +} from '../../constants/constants'; import { FeedFilter } from '../../enums/mydata.enum'; import { NotificationTabsKey } from '../../enums/notification.enum'; import { ThreadType } from '../../generated/api/feed/createThread'; @@ -115,7 +118,7 @@ const NotificationBox = ({ key === NotificationTabsKey.TASK ? onMarkTaskNotificationRead() : onMarkMentionsNotificationRead(); - }, 4000); + }, NOTIFICATION_READ_TIMER); } }, [currentUser, hasTaskNotification, hasMentionNotification] @@ -153,6 +156,7 @@ const NotificationBox = ({ ) : ( diff --git a/openmetadata-ui/src/main/resources/ui/src/components/NotificationBox/NotificationBox.utils.tsx b/openmetadata-ui/src/main/resources/ui/src/components/NotificationBox/NotificationBox.utils.tsx index 0fffa44dea7..7bcc6f1ef63 100644 --- a/openmetadata-ui/src/main/resources/ui/src/components/NotificationBox/NotificationBox.utils.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/components/NotificationBox/NotificationBox.utils.tsx @@ -13,6 +13,7 @@ import Icon from '@ant-design/icons'; import React from 'react'; +import { ReactComponent as IconMentions } from '../../assets/svg/ic-mentions.svg'; import { ReactComponent as IconTask } from '../../assets/svg/ic-task.svg'; import { FeedFilter } from '../../enums/mydata.enum'; import { @@ -34,19 +35,18 @@ export const tabsInfo = [ /> ), }, - // TODO: remove comments when Backend support for Mention is done - // { - // name: NotificationTabsName.MENTION, - // key: NotificationTabsKey.CONVERSATION, - // icon: ( - // - // ), - // }, + { + name: NotificationTabsName.MENTION, + key: NotificationTabsKey.CONVERSATION, + icon: ( + + ), + }, ]; export const getFilters = (activeTab: ThreadType) => ({ diff --git a/openmetadata-ui/src/main/resources/ui/src/components/NotificationBox/NotificationFeedCard.component.tsx b/openmetadata-ui/src/main/resources/ui/src/components/NotificationBox/NotificationFeedCard.component.tsx index 58af7625edf..40377a385f3 100644 --- a/openmetadata-ui/src/main/resources/ui/src/components/NotificationBox/NotificationFeedCard.component.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/components/NotificationBox/NotificationFeedCard.component.tsx @@ -49,7 +49,7 @@ const NotificationFeedCard: FC = ({ <>{createdBy} {feedType === ThreadType.Conversation ? ( <> - posted on {entityType} + mentioned you on the {entityType} diff --git a/openmetadata-ui/src/main/resources/ui/src/components/nav-bar/NavBar.tsx b/openmetadata-ui/src/main/resources/ui/src/components/nav-bar/NavBar.tsx index 6710bc1339d..9c593b06cb2 100644 --- a/openmetadata-ui/src/main/resources/ui/src/components/nav-bar/NavBar.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/components/nav-bar/NavBar.tsx @@ -17,7 +17,11 @@ import React, { useCallback, useEffect, useState } from 'react'; import { Link, NavLink, useHistory } from 'react-router-dom'; import AppState from '../../AppState'; import Logo from '../../assets/svg/logo-monogram.svg'; -import { ROUTES, SOCKET_EVENTS } from '../../constants/constants'; +import { + NOTIFICATION_READ_TIMER, + ROUTES, + SOCKET_EVENTS, +} from '../../constants/constants'; import { hasNotificationPermission, shouldRequestPermission, @@ -103,7 +107,7 @@ const NavBar = ({ hasTaskNotification && setTimeout(() => { handleTaskNotificationRead(); - }, 5000); + }, NOTIFICATION_READ_TIMER); break; @@ -111,7 +115,7 @@ const NavBar = ({ hasMentionNotification && setTimeout(() => { handleMentionsNotificationRead(); - }, 5000); + }, NOTIFICATION_READ_TIMER); break; } @@ -125,8 +129,8 @@ const NavBar = ({ const showBrowserNotification = ( about: string, createdBy: string, - id: string, - type: string + type: string, + id?: string ) => { if (!hasNotificationPermission()) { return; @@ -169,8 +173,8 @@ const NavBar = ({ showBrowserNotification( activity.about, activity.createdBy, - activity.task.id, - activity.type + activity.type, + activity.task?.id ); } }); @@ -182,8 +186,8 @@ const NavBar = ({ showBrowserNotification( activity.about, activity.createdBy, - activity.task.id, - activity.type + activity.type, + activity.task?.id ); } }); @@ -286,7 +290,9 @@ const NavBar = ({ /> } overlayStyle={{ + zIndex: 9999, width: '425px', + minHeight: '375px', }} placement="bottomRight" trigger={['click']} diff --git a/openmetadata-ui/src/main/resources/ui/src/constants/constants.ts b/openmetadata-ui/src/main/resources/ui/src/constants/constants.ts index 5bfb6f6b065..f0dbb5e134c 100644 --- a/openmetadata-ui/src/main/resources/ui/src/constants/constants.ts +++ b/openmetadata-ui/src/main/resources/ui/src/constants/constants.ts @@ -451,3 +451,5 @@ export const TITLE_FOR_UPDATE_DESCRIPTION = export const configOptions = { headers: { 'Content-type': 'application/json-patch+json' }, }; + +export const NOTIFICATION_READ_TIMER = 2500;