Skip to content

Commit

Permalink
show notification bell icon more obviously with role/group to review (#…
Browse files Browse the repository at this point in the history 
…2425)

* show notification bell icon more obviously with role/group to review
---------

Signed-off-by: jtsang01 <[email protected]>
Co-authored-by: jtsang01 <[email protected]>
  • Loading branch information
@jimmytsang
jimmytsang and jtsang01 authored Nov 27, 2023
1 parent f69a8c3 commit 0b658ae
Show file tree
Hide file tree
Showing 83 changed files with 4,946 additions and 3,910 deletions.
3 changes: 3 additions & 0 deletions ui/src/__tests__/components/header/Header.test.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -23,6 +23,9 @@ describe('Header', () => {
beforeEach(() => {
MockApi.setMockApi({
getPendingDomainMembersList: jest.fn().mockReturnValue([]),
getReviewGroups: jest.fn().mockReturnValue([]),
getReviewRoles: jest.fn().mockReturnValue([]),
getPageFeatureFlag: jest.fn().mockResolvedValue({}),
});
});
afterEach(() => MockApi.cleanMockApi());
Expand Down
66 changes: 65 additions & 1 deletion ui/src/__tests__/components/header/HeaderMenu.test.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -23,7 +23,33 @@ describe('HeaderMenu', () => {
afterEach(() => {
MockApi.cleanMockApi();
});
it('should render', () => {

it('should render with no notifications', () => {
let headerDetails = {
headerLinks: [
{
title: 'Website',
url: 'http://www.athenz.io',
target: '_blank',
},
],
};
MockApi.setMockApi({
getPendingDomainMembersList: jest
.fn()
.mockReturnValue(Promise.resolve([])),
getReviewGroups: jest.fn().mockReturnValue(Promise.resolve([])),
getReviewRoles: jest.fn().mockReturnValue(Promise.resolve([])),
getPageFeatureFlag: jest.fn().mockResolvedValue({}),
});
const { getByTestId } = renderWithRedux(
<HeaderMenu headerDetails={headerDetails} />
);
const headerMenu = getByTestId('header-menu');
expect(headerMenu).toMatchSnapshot();
});

it('should render with notifications', () => {
let headerDetails = {
headerLinks: [
{
Expand All @@ -33,8 +59,46 @@ describe('HeaderMenu', () => {
},
],
};

MockApi.setMockApi({
getPendingDomainMembersList: jest.fn().mockReturnValue([]),
getPageFeatureFlag: jest.fn().mockResolvedValue({
roleGroupReviewFeatureFlag: true,
}),
getReviewGroups: jest.fn().mockReturnValue([
{
domainName: 'home.jtsang01',
name: 'heyreviewthis',
memberExpiryDays: 10,
memberReviewDays: 0,
serviceExpiryDays: 10,
serviceReviewDays: 0,
groupExpiryDays: 0,
groupReviewDays: 0,
},
]),
getReviewRoles: jest.fn().mockReturnValue([
{
domainName: 'home.jtsang01',
name: 'rolereviewtest',
memberExpiryDays: 10,
memberReviewDays: 10,
serviceExpiryDays: 0,
serviceReviewDays: 0,
groupExpiryDays: 10,
groupReviewDays: 10,
},
{
domainName: 'home.jtsang01',
name: 't',
memberExpiryDays: 5,
memberReviewDays: 5,
serviceExpiryDays: 5,
serviceReviewDays: 5,
groupExpiryDays: 5,
groupReviewDays: 5,
},
]),
});
const { getByTestId } = renderWithRedux(
<HeaderMenu headerDetails={headerDetails} />
Expand Down
18 changes: 18 additions & 0 deletions ui/src/__tests__/components/header/__snapshots__/Header.test.js.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -299,6 +299,12 @@ exports[`Header should render 1`] = `
}
.emotion-13 {
position: relative;
width: 0;
height: 0;
}
.emotion-15 {
margin-left: 15px;
}
Expand Down Expand Up @@ -356,6 +362,9 @@ exports[`Header should render 1`] = `
</svg>
<div
class="emotion-13 emotion-14"
/>
<div
class="emotion-15 emotion-16"
>
<svg
class="emotion-12"
Expand Down Expand Up @@ -834,6 +843,12 @@ exports[`Header should render with search 1`] = `
}
.emotion-15 {
position: relative;
width: 0;
height: 0;
}
.emotion-17 {
margin-left: 15px;
}
Expand Down Expand Up @@ -927,6 +942,9 @@ exports[`Header should render with search 1`] = `
</svg>
<div
class="emotion-15 emotion-16"
/>
<div
class="emotion-17 emotion-18"
>
<svg
class="emotion-14"
Expand Down
85 changes: 84 additions & 1 deletion ui/src/__tests__/components/header/__snapshots__/HeaderMenu.test.js.snap
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP

exports[`HeaderMenu should render 1`] = `
exports[`HeaderMenu should render with no notifications 1`] = `
.emotion-0 {
display: -webkit-box;
display: -webkit-flex;
Expand All @@ -15,6 +15,86 @@ exports[`HeaderMenu should render 1`] = `
}
.emotion-3 {
position: relative;
width: 0;
height: 0;
}
.emotion-5 {
margin-left: 15px;
}
<div
class="emotion-0 emotion-1"
data-testid="header-menu"
>
<svg
class="emotion-2"
data-testid="icon"
height="25px"
id=""
viewBox="0 0 1024 1024"
width="25px"
>
<title>
notification
</title>
<path
d="M925.867 627.2l-68.267-68.267c-15.132-16.256-24.706-37.864-25.595-61.692l-0.005-0.174v-134.4c0-172.8-115.2-320-320-320s-320 142.933-320 320v149.333c-0.424 14.075-6.029 26.765-14.962 36.297l0.028-0.030-78.933 78.933c-7.763 7.612-12.628 18.155-12.8 29.835l-0 0.032v153.6c0 23.564 19.103 42.667 42.667 42.667v0h236.8c12.454 70.953 73.611 124.182 147.2 124.182s134.746-53.229 147.069-123.285l0.131-0.897h236.8c23.564 0 42.667-19.103 42.667-42.667v0-153.6c-0.172-11.712-5.037-22.255-12.793-29.86l-0.007-0.007zM853.333 768h-682.667v-91.733l66.133-68.267c24.782-24.511 40.224-58.423 40.533-95.941l0-0.059v-149.333c0-113.067 61.867-234.667 234.667-234.667s234.667 125.867 234.667 234.667v134.4c0.879 47.11 19.381 89.736 49.168 121.71l-0.102-0.11 57.6 57.6z"
/>
</svg>
<div
class="emotion-3 emotion-4"
/>
<div
class="emotion-5 emotion-6"
>
<svg
class="emotion-2"
data-testid="icon"
height="25px"
id=""
viewBox="0 0 1024 1024"
width="25px"
>
<title>
help-circle
</title>
<path
d="M512 42.667c-259.206 0-469.333 210.128-469.333 469.333s210.128 469.333 469.333 469.333c259.206 0 469.333-210.128 469.333-469.333v0c0-259.206-210.128-469.333-469.333-469.333v0zM512 896c-212.077 0-384-171.923-384-384s171.923-384 384-384c212.077 0 384 171.923 384 384v0c0 212.077-171.923 384-384 384v0z"
/>
<path
d="M554.667 768c0 23.564-19.103 42.667-42.667 42.667s-42.667-19.103-42.667-42.667c0-23.564 19.103-42.667 42.667-42.667s42.667 19.103 42.667 42.667z"
/>
<path
d="M549.333 219.52c-11.244-2.339-24.166-3.678-37.4-3.678-71.49 0-133.854 39.072-166.904 97.027l-0.496 0.945c-3.783 6.395-6.018 14.093-6.018 22.313 0 14.468 6.924 27.319 17.64 35.419l0.112 0.081c6.829 4.846 15.334 7.747 24.517 7.747 15.995 0 29.934-8.801 37.239-21.826l0.111-0.215c12.111-22.947 31.869-40.492 55.815-49.471l0.718-0.236c98.133-33.707 187.52 72.32 120.96 170.667-16.346 22.524-42.587 37.002-72.21 37.002-4.025 0-7.988-0.267-11.871-0.785l0.455 0.050c-1.281-0.156-2.763-0.245-4.267-0.245s-2.986 0.089-4.443 0.262l0.176-0.017c-19.477 4.079-33.927 21.016-34.133 41.364l-0 0.022s0 0 0 1.28v82.773c-0.004 0.232-0.007 0.505-0.007 0.78 0 21.42 15.032 39.329 35.123 43.752l0.297 0.055c2.182 0.396 4.694 0.622 7.258 0.622 23.564 0 42.667-19.103 42.667-42.667 0-0.219-0.002-0.437-0.005-0.655l0 0.033v-31.147c0.196-9.48 6.547-17.425 15.209-20.015l0.151-0.039c78.046-25.561 133.424-97.737 133.424-182.847 0-92.861-65.924-170.325-153.523-188.144l-1.234-0.21z"
/>
</svg>
</div>
</div>
`;

exports[`HeaderMenu should render with notifications 1`] = `
.emotion-0 {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
}
.emotion-2 {
fill: #fff;
cursor: pointer;
vertical-align: text-bottom;
}
.emotion-3 {
position: relative;
width: 0;
height: 0;
}
.emotion-5 {
margin-left: 15px;
}
Expand All @@ -39,6 +119,9 @@ exports[`HeaderMenu should render 1`] = `
</svg>
<div
class="emotion-3 emotion-4"
/>
<div
class="emotion-5 emotion-6"
>
<svg
class="emotion-2"
Expand Down
Loading

0 comments on commit 0b658ae

Please sign in to comment.