Skip to content

moved "Upload Hours" button from avatar menu to ADMIN menu #2246

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 7 commits into from
Apr 25, 2024
Merged

moved "Upload Hours" button from avatar menu to ADMIN menu #2246

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
7 commits
Select commit Hold shift + click to select a range
0737eb4
moved "Upload Hours" button from avatar menu to ADMIN menu
mvolkmann Apr 25, 2024
d5c1b8a
class -> className
mvolkmann Apr 25, 2024
c460460
changed button to ListItem in Menu.jsx
mvolkmann Apr 25, 2024
4be1f8f
removed deprecated button prop in Menu.jsx
mvolkmann Apr 25, 2024
8d6be09
removed deprecated button prop in Menu.jsx
mvolkmann Apr 25, 2024
f49b771
updated some snapshot tests
mvolkmann Apr 25, 2024
e13ee9b
Merge branch 'develop' into feature-2243-upload-hours
mvolkmann Apr 25, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
15 changes: 12 additions & 3 deletions web-ui/src/components/menu/Menu.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -349,22 +349,31 @@ function Menu() {
{createLinkJsx('/', 'HOME', false)}
{isAdmin && (
<>
<ListItem button onClick={toggleAdmin} className={classes.listItem}>
<ListItem onClick={toggleAdmin} className={classes.listItem}>
<ListItemText primary="ADMIN" />
</ListItem>
<Collapse in={adminOpen} timeout="auto" unmountOnExit>
{createListJsx(adminLinks, true)}
{isAdmin && (
Copy link
Collaborator Author

@mvolkmann mvolkmann Apr 25, 2024

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This code was moved here from below.
I had to customize the styling of the button to match the look of the links in the ADMIN menu.

Copy link
Member

@mkimberlin mkimberlin Apr 25, 2024

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Any reason not to just make it a <ListItem> like the others?

Copy link
Collaborator Author

@mvolkmann mvolkmann Apr 25, 2024

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I didn't realize I could attach an onClick to a ListItem. I pushed that change.

<ListItem
className={classes.listItem}
onClick={openHoursUpload}
style={{ marginLeft: '1rem' }}
>
Upload Hours
</ListItem>
)}
</Collapse>
</>
)}
{createLinkJsx('/checkins', 'CHECK-INS', false)}
<ListItem button onClick={toggleDirectory} className={classes.listItem}>
<ListItem onClick={toggleDirectory} className={classes.listItem}>
<ListItemText primary="DIRECTORY" />
</ListItem>
<Collapse in={directoryOpen} timeout="auto" unmountOnExit>
{createListJsx(directoryLinks, true)}
</Collapse>
<ListItem button onClick={toggleFeedback} className={classes.listItem}>
<ListItem onClick={toggleFeedback} className={classes.listItem}>
<ListItemText primary="FEEDBACK" />
</ListItem>
<Collapse in={feedbackOpen} timeout="auto" unmountOnExit>
Expand Down
154 changes: 42 additions & 112 deletions web-ui/src/components/menu/__snapshots__/Menu.test.jsx.snap
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -119,10 +119,8 @@ exports[`<Menu /> > renders correctly 1`] = `
class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
/>
</a>
<div
class="MuiButtonBase-root MuiListItem-root MuiListItem-gutters MuiListItem-padding MuiListItem-button css-bshv44-MuiButtonBase-root-MuiListItem-root"
role="button"
tabindex="0"
<li
class="MuiListItem-root MuiListItem-gutters MuiListItem-padding css-1p823my-MuiListItem-root"
>
<div
class="MuiListItemText-root css-tlelie-MuiListItemText-root"
Expand All @@ -133,10 +131,7 @@ exports[`<Menu /> > renders correctly 1`] = `
DIRECTORY
</span>
</div>
<span
class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
/>
</div>
</li>
<div
class="MuiCollapse-root MuiCollapse-vertical MuiCollapse-entered css-pwcg7p-MuiCollapse-root"
style="min-height: 0px;"
Expand Down Expand Up @@ -204,10 +199,8 @@ exports[`<Menu /> > renders correctly 1`] = `
</div>
</div>
</div>
<div
class="MuiButtonBase-root MuiListItem-root MuiListItem-gutters MuiListItem-padding MuiListItem-button css-bshv44-MuiButtonBase-root-MuiListItem-root"
role="button"
tabindex="0"
<li
class="MuiListItem-root MuiListItem-gutters MuiListItem-padding css-1p823my-MuiListItem-root"
>
<div
class="MuiListItemText-root css-tlelie-MuiListItemText-root"
Expand All @@ -218,10 +211,7 @@ exports[`<Menu /> > renders correctly 1`] = `
FEEDBACK
</span>
</div>
<span
class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
/>
</div>
</li>
</nav>
</div>
</div>
Expand Down Expand Up @@ -286,10 +276,8 @@ exports[`<Menu /> > renders correctly 1`] = `
class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
/>
</a>
<div
class="MuiButtonBase-root MuiListItem-root MuiListItem-gutters MuiListItem-padding MuiListItem-button css-bshv44-MuiButtonBase-root-MuiListItem-root"
role="button"
tabindex="0"
<li
class="MuiListItem-root MuiListItem-gutters MuiListItem-padding css-1p823my-MuiListItem-root"
>
<div
class="MuiListItemText-root css-tlelie-MuiListItemText-root"
Expand All @@ -300,10 +288,7 @@ exports[`<Menu /> > renders correctly 1`] = `
DIRECTORY
</span>
</div>
<span
class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
/>
</div>
</li>
<div
class="MuiCollapse-root MuiCollapse-vertical MuiCollapse-entered css-pwcg7p-MuiCollapse-root"
style="min-height: 0px;"
Expand Down Expand Up @@ -371,10 +356,8 @@ exports[`<Menu /> > renders correctly 1`] = `
</div>
</div>
</div>
<div
class="MuiButtonBase-root MuiListItem-root MuiListItem-gutters MuiListItem-padding MuiListItem-button css-bshv44-MuiButtonBase-root-MuiListItem-root"
role="button"
tabindex="0"
<li
class="MuiListItem-root MuiListItem-gutters MuiListItem-padding css-1p823my-MuiListItem-root"
>
<div
class="MuiListItemText-root css-tlelie-MuiListItemText-root"
Expand All @@ -385,10 +368,7 @@ exports[`<Menu /> > renders correctly 1`] = `
FEEDBACK
</span>
</div>
<span
class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
/>
</div>
</li>
</nav>
</div>
</div>
Expand Down Expand Up @@ -504,10 +484,8 @@ exports[`<Menu /> > renders correctly for admin 1`] = `
class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
/>
</a>
<div
class="MuiButtonBase-root MuiListItem-root MuiListItem-gutters MuiListItem-padding MuiListItem-button css-bshv44-MuiButtonBase-root-MuiListItem-root"
role="button"
tabindex="0"
<li
class="MuiListItem-root MuiListItem-gutters MuiListItem-padding css-1p823my-MuiListItem-root"
>
<div
class="MuiListItemText-root css-tlelie-MuiListItemText-root"
Expand All @@ -518,10 +496,7 @@ exports[`<Menu /> > renders correctly for admin 1`] = `
ADMIN
</span>
</div>
<span
class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
/>
</div>
</li>
<a
class="MuiButtonBase-root MuiListItem-root MuiListItem-gutters MuiListItem-padding MuiListItem-button css-bshv44-MuiButtonBase-root-MuiListItem-root"
href="/checkins"
Expand All @@ -540,10 +515,8 @@ exports[`<Menu /> > renders correctly for admin 1`] = `
class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
/>
</a>
<div
class="MuiButtonBase-root MuiListItem-root MuiListItem-gutters MuiListItem-padding MuiListItem-button css-bshv44-MuiButtonBase-root-MuiListItem-root"
role="button"
tabindex="0"
<li
class="MuiListItem-root MuiListItem-gutters MuiListItem-padding css-1p823my-MuiListItem-root"
>
<div
class="MuiListItemText-root css-tlelie-MuiListItemText-root"
Expand All @@ -554,10 +527,7 @@ exports[`<Menu /> > renders correctly for admin 1`] = `
DIRECTORY
</span>
</div>
<span
class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
/>
</div>
</li>
<div
class="MuiCollapse-root MuiCollapse-vertical MuiCollapse-entered css-pwcg7p-MuiCollapse-root"
style="min-height: 0px;"
Expand Down Expand Up @@ -625,10 +595,8 @@ exports[`<Menu /> > renders correctly for admin 1`] = `
</div>
</div>
</div>
<div
class="MuiButtonBase-root MuiListItem-root MuiListItem-gutters MuiListItem-padding MuiListItem-button css-bshv44-MuiButtonBase-root-MuiListItem-root"
role="button"
tabindex="0"
<li
class="MuiListItem-root MuiListItem-gutters MuiListItem-padding css-1p823my-MuiListItem-root"
>
<div
class="MuiListItemText-root css-tlelie-MuiListItemText-root"
Expand All @@ -639,10 +607,7 @@ exports[`<Menu /> > renders correctly for admin 1`] = `
FEEDBACK
</span>
</div>
<span
class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
/>
</div>
</li>
<div
class="MuiButtonBase-root MuiListItem-root MuiListItem-gutters MuiListItem-padding MuiListItem-button css-bshv44-MuiButtonBase-root-MuiListItem-root"
role="button"
Expand Down Expand Up @@ -707,10 +672,8 @@ exports[`<Menu /> > renders correctly for admin 1`] = `
class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
/>
</a>
<div
class="MuiButtonBase-root MuiListItem-root MuiListItem-gutters MuiListItem-padding MuiListItem-button css-bshv44-MuiButtonBase-root-MuiListItem-root"
role="button"
tabindex="0"
<li
class="MuiListItem-root MuiListItem-gutters MuiListItem-padding css-1p823my-MuiListItem-root"
>
<div
class="MuiListItemText-root css-tlelie-MuiListItemText-root"
Expand All @@ -721,10 +684,7 @@ exports[`<Menu /> > renders correctly for admin 1`] = `
ADMIN
</span>
</div>
<span
class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
/>
</div>
</li>
<a
class="MuiButtonBase-root MuiListItem-root MuiListItem-gutters MuiListItem-padding MuiListItem-button css-bshv44-MuiButtonBase-root-MuiListItem-root"
href="/checkins"
Expand All @@ -743,10 +703,8 @@ exports[`<Menu /> > renders correctly for admin 1`] = `
class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
/>
</a>
<div
class="MuiButtonBase-root MuiListItem-root MuiListItem-gutters MuiListItem-padding MuiListItem-button css-bshv44-MuiButtonBase-root-MuiListItem-root"
role="button"
tabindex="0"
<li
class="MuiListItem-root MuiListItem-gutters MuiListItem-padding css-1p823my-MuiListItem-root"
>
<div
class="MuiListItemText-root css-tlelie-MuiListItemText-root"
Expand All @@ -757,10 +715,7 @@ exports[`<Menu /> > renders correctly for admin 1`] = `
DIRECTORY
</span>
</div>
<span
class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
/>
</div>
</li>
<div
class="MuiCollapse-root MuiCollapse-vertical MuiCollapse-entered css-pwcg7p-MuiCollapse-root"
style="min-height: 0px;"
Expand Down Expand Up @@ -828,10 +783,8 @@ exports[`<Menu /> > renders correctly for admin 1`] = `
</div>
</div>
</div>
<div
class="MuiButtonBase-root MuiListItem-root MuiListItem-gutters MuiListItem-padding MuiListItem-button css-bshv44-MuiButtonBase-root-MuiListItem-root"
role="button"
tabindex="0"
<li
class="MuiListItem-root MuiListItem-gutters MuiListItem-padding css-1p823my-MuiListItem-root"
>
<div
class="MuiListItemText-root css-tlelie-MuiListItemText-root"
Expand All @@ -842,10 +795,7 @@ exports[`<Menu /> > renders correctly for admin 1`] = `
FEEDBACK
</span>
</div>
<span
class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
/>
</div>
</li>
<div
class="MuiButtonBase-root MuiListItem-root MuiListItem-gutters MuiListItem-padding MuiListItem-button css-bshv44-MuiButtonBase-root-MuiListItem-root"
role="button"
Expand Down Expand Up @@ -997,10 +947,8 @@ exports[`<Menu /> > renders correctly for pdl 1`] = `
class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
/>
</a>
<div
class="MuiButtonBase-root MuiListItem-root MuiListItem-gutters MuiListItem-padding MuiListItem-button css-bshv44-MuiButtonBase-root-MuiListItem-root"
role="button"
tabindex="0"
<li
class="MuiListItem-root MuiListItem-gutters MuiListItem-padding css-1p823my-MuiListItem-root"
>
<div
class="MuiListItemText-root css-tlelie-MuiListItemText-root"
Expand All @@ -1011,10 +959,7 @@ exports[`<Menu /> > renders correctly for pdl 1`] = `
DIRECTORY
</span>
</div>
<span
class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
/>
</div>
</li>
<div
class="MuiCollapse-root MuiCollapse-vertical MuiCollapse-entered css-pwcg7p-MuiCollapse-root"
style="min-height: 0px;"
Expand Down Expand Up @@ -1082,10 +1027,8 @@ exports[`<Menu /> > renders correctly for pdl 1`] = `
</div>
</div>
</div>
<div
class="MuiButtonBase-root MuiListItem-root MuiListItem-gutters MuiListItem-padding MuiListItem-button css-bshv44-MuiButtonBase-root-MuiListItem-root"
role="button"
tabindex="0"
<li
class="MuiListItem-root MuiListItem-gutters MuiListItem-padding css-1p823my-MuiListItem-root"
>
<div
class="MuiListItemText-root css-tlelie-MuiListItemText-root"
Expand All @@ -1096,10 +1039,7 @@ exports[`<Menu /> > renders correctly for pdl 1`] = `
FEEDBACK
</span>
</div>
<span
class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
/>
</div>
</li>
</nav>
</div>
</div>
Expand Down Expand Up @@ -1164,10 +1104,8 @@ exports[`<Menu /> > renders correctly for pdl 1`] = `
class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
/>
</a>
<div
class="MuiButtonBase-root MuiListItem-root MuiListItem-gutters MuiListItem-padding MuiListItem-button css-bshv44-MuiButtonBase-root-MuiListItem-root"
role="button"
tabindex="0"
<li
class="MuiListItem-root MuiListItem-gutters MuiListItem-padding css-1p823my-MuiListItem-root"
>
<div
class="MuiListItemText-root css-tlelie-MuiListItemText-root"
Expand All @@ -1178,10 +1116,7 @@ exports[`<Menu /> > renders correctly for pdl 1`] = `
DIRECTORY
</span>
</div>
<span
class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
/>
</div>
</li>
<div
class="MuiCollapse-root MuiCollapse-vertical MuiCollapse-entered css-pwcg7p-MuiCollapse-root"
style="min-height: 0px;"
Expand Down Expand Up @@ -1249,10 +1184,8 @@ exports[`<Menu /> > renders correctly for pdl 1`] = `
</div>
</div>
</div>
<div
class="MuiButtonBase-root MuiListItem-root MuiListItem-gutters MuiListItem-padding MuiListItem-button css-bshv44-MuiButtonBase-root-MuiListItem-root"
role="button"
tabindex="0"
<li
class="MuiListItem-root MuiListItem-gutters MuiListItem-padding css-1p823my-MuiListItem-root"
>
<div
class="MuiListItemText-root css-tlelie-MuiListItemText-root"
Expand All @@ -1263,10 +1196,7 @@ exports[`<Menu /> > renders correctly for pdl 1`] = `
FEEDBACK
</span>
</div>
<span
class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
/>
</div>
</li>
</nav>
</div>
</div>
Expand Down