Merge branch 'master' into sso-url-env-details-dynamic

RedHatInsights · Mar 20, 2024 · f6b507e · f6b507e
2 parents 6b8a0a4 + 5c1b0ad
commit f6b507e
Showing 1 changed file with 23 additions and 16 deletions.
diff --git a/src/components/NotificationsDrawer/DrawerPanelContent.tsx b/src/components/NotificationsDrawer/DrawerPanelContent.tsx
@@ -5,7 +5,6 @@ import { Flex, FlexItem } from '@patternfly/react-core/dist/dynamic/layouts/Flex
 import { Dropdown, DropdownGroup, DropdownItem, DropdownList } from '@patternfly/react-core/dist/dynamic/components/Dropdown';
 import { MenuToggle, MenuToggleElement } from '@patternfly/react-core/dist/dynamic/components/MenuToggle';
 import { Divider } from '@patternfly/react-core/dist/dynamic/components/Divider';
-import { Button } from '@patternfly/react-core/dist/dynamic/components/Button';
 import { EmptyState, EmptyStateBody, EmptyStateIcon } from '@patternfly/react-core/dist/dynamic/components/EmptyState';
 import {
   NotificationDrawer,
@@ -18,10 +17,9 @@ import { Title } from '@patternfly/react-core/dist/dynamic/components/Title';
 import { useDispatch, useSelector } from 'react-redux';
 import FilterIcon from '@patternfly/react-icons/dist/dynamic/icons/filter-icon';
 import BellSlashIcon from '@patternfly/react-icons/dist/dynamic/icons/bell-slash-icon';
-import ExternalLinkSquareAltIcon from '@patternfly/react-icons/dist/dynamic/icons/external-link-square-alt-icon';
 import EllipsisVIcon from '@patternfly/react-icons/dist/dynamic/icons/ellipsis-v-icon';
 import orderBy from 'lodash/orderBy';
-import { useNavigate } from 'react-router-dom';
+import { Link, useNavigate } from 'react-router-dom';
 import { NotificationData, ReduxState } from '../../redux/store';
 import NotificationItem from './NotificationItem';
 import { markAllNotificationsAsRead, markAllNotificationsAsUnread, toggleNotificationsDrawer } from '../../redux/actions';
@@ -32,24 +30,33 @@ export type DrawerPanelProps = {
   innerRef: React.Ref<unknown>;
 };
 
-const EmptyNotifications = () => (
+const EmptyNotifications = ({ isOrgAdmin, onLinkClick }: { onLinkClick: () => void; isOrgAdmin?: boolean }) => (
   <EmptyState>
     <EmptyStateIcon icon={BellSlashIcon} />
     <Title headingLevel="h4" size="lg">
       No notifications found
     </Title>
     <EmptyStateBody>
-      <Button
-        component="a"
-        variant="link"
-        icon={<ExternalLinkSquareAltIcon />}
-        iconPosition="right"
-        href="./user-preferences/notifications"
-        target="_blank"
-      >
-        Check your User Preferences
-      </Button>
-      <Text>Contact your Organization Administrator</Text>
+      {isOrgAdmin ? (
+        <Text>
+          Try&nbsp;
+          <Link onClick={onLinkClick} to="/settings/notifications/user-preferences">
+            checking your notification preferences
+          </Link>
+          &nbsp;and managing the&nbsp;
+          <Link onClick={onLinkClick} to="/settings/notifications/configure-events">
+            notification configuration
+          </Link>
+          &nbsp;for your organization.
+        </Text>
+      ) : (
+        <>
+          <Link onClick={onLinkClick} to="/settings/notifications/configure-events">
+            Configure notification settings
+          </Link>
+          .<Text>Contact your organization administrator.</Text>
+        </>
+      )}
     </EmptyStateBody>
   </EmptyState>
 );
@@ -155,7 +162,7 @@ const DrawerPanelBase = ({ innerRef }: DrawerPanelProps) => {
 
   const renderNotifications = () => {
     if (notifications.length === 0) {
-      return <EmptyNotifications />;
+      return <EmptyNotifications isOrgAdmin={isOrgAdmin} onLinkClick={onNotificationsDrawerClose} />;
     }
 
     const sortedNotifications = orderBy(activeFilters?.length > 0 ? filteredNotifications : notifications, ['read', 'created'], ['asc', 'asc']);