Merge pull request #12727 from akira6592/improve-badge

Improves visibility of workflow approval notification bell
This commit is contained in:
Alex Corey 2022-09-22 10:13:13 -04:00 committed by GitHub
commit a27680f7e9
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 12 additions and 17 deletions

View File

@ -5,21 +5,18 @@ import { t } from '@lingui/macro';
import { Link } from 'react-router-dom';
import styled from 'styled-components';
import {
Badge,
Dropdown,
DropdownItem,
DropdownToggle,
DropdownPosition,
NotificationBadge,
NotificationBadgeVariant,
PageHeaderTools,
PageHeaderToolsGroup,
PageHeaderToolsItem,
Tooltip,
} from '@patternfly/react-core';
import {
BellIcon,
QuestionCircleIcon,
UserIcon,
} from '@patternfly/react-icons';
import { QuestionCircleIcon, UserIcon } from '@patternfly/react-icons';
import { WorkflowApprovalsAPI } from 'api';
import useRequest from 'hooks/useRequest';
import getDocsBaseUrl from 'util/getDocsBaseUrl';
@ -33,10 +30,6 @@ const PendingWorkflowApprovals = styled.div`
margin-right: 10px;
`;
const PendingWorkflowApprovalBadge = styled(Badge)`
margin-left: 10px;
`;
function PageHeaderToolbar({
isAboutDisabled,
onAboutClick,
@ -84,13 +77,15 @@ function PageHeaderToolbar({
<PageHeaderToolsItem>
<Link to="/workflow_approvals?workflow_approvals.status=pending">
<PendingWorkflowApprovals>
<BellIcon color="white" />
<PendingWorkflowApprovalBadge
<NotificationBadge
id="toolbar-workflow-approval-badge"
isRead
>
{pendingApprovalsCount}
</PendingWorkflowApprovalBadge>
count={pendingApprovalsCount}
variant={
pendingApprovalsCount === 0
? NotificationBadgeVariant.read
: NotificationBadgeVariant.unread
}
/>
</PendingWorkflowApprovals>
</Link>
</PageHeaderToolsItem>

View File

@ -80,7 +80,7 @@ describe('PageHeaderToolbar', () => {
});
expect(
wrapper.find('Badge#toolbar-workflow-approval-badge').text()
wrapper.find('NotificationBadge#toolbar-workflow-approval-badge').text()
).toEqual('20');
});
});