Mirrors/unleash.unleash
1
0
Fork 0
mirror of https://github.com/Unleash/unleash.git synced 2025-10-27 11:02:16 +01:00
Code Issues Projects Releases Wiki Activity

feat: review buttons makeover (#4513)

Browse Source
This commit is contained in:
Mateusz Kwasniewski 2023-08-16 13:55:18 +02:00 committed by GitHub
parent 40325a0eb4
commit b6830b805b
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 29 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
frontend/src/component/changeRequest/ChangeRequestOverview/ChangeRequestOverview.tsx
View File

@ -189,6 +189,9 @@ export const ChangeRequestOverview: FC = () => {
const hasApprovedAlready = changeRequest.approvals.some(
approval => approval.createdBy.id === user?.id
);
const countOfChanges = changesCount(changeRequest);
return (
<>
<ChangeRequestHeader changeRequest={changeRequest} />
@ -199,7 +202,7 @@ export const ChangeRequestOverview: FC = () => {
</StyledAsideBox>
<StyledPaper elevation={0}>
<StyledInnerContainer>
Requested Changes ({changesCount(changeRequest)})
Requested Changes ({countOfChanges})
<ChangeRequest
changeRequest={changeRequest}
onRefetch={refetchChangeRequest}
@ -256,7 +259,9 @@ export const ChangeRequestOverview: FC = () => {
}
onApprove={onApprove}
disabled={!allowChangeRequestActions}
/>
>
Review changes ({countOfChanges})
</ReviewButton>
}
/>
<ConditionallyRender

26
frontend/src/component/changeRequest/ChangeRequestOverview/ReviewButton/ReviewButton.tsx
View File

@ -5,6 +5,8 @@ import { useChangeRequest } from 'hooks/api/getters/useChangeRequest/useChangeRe
import {
ClickAwayListener,
Grow,
ListItemIcon,
ListItemText,
MenuItem,
MenuList,
Paper,
@ -18,12 +20,14 @@ import { useAuthUser } from 'hooks/api/getters/useAuth/useAuthUser';
import AccessContext from 'contexts/AccessContext';
import useUiConfig from 'hooks/api/getters/useUiConfig/useUiConfig';
import { ConditionallyRender } from 'component/common/ConditionallyRender/ConditionallyRender';
import CheckBox from '@mui/icons-material/Check';
import Clear from '@mui/icons-material/Clear';
export const ReviewButton: FC<{
disabled: boolean;
onReject: () => void;
onApprove: () => void;
}> = ({ disabled, onReject, onApprove }) => {
}> = ({ disabled, onReject, onApprove, children }) => {
const { uiConfig } = useUiConfig();
const { isAdmin } = useContext(AccessContext);
const projectId = useRequiredPathParam('projectId');
@ -48,6 +52,9 @@ export const ReviewButton: FC<{
setOpen(false);
};
const popperWidth = anchorRef.current
? anchorRef.current.offsetWidth
: null;
return (
<React.Fragment>
@ -67,11 +74,12 @@ export const ReviewButton: FC<{
projectId={projectId}
environmentId={data?.environment}
>
Review changes
{children}
</PermissionButton>
<Popper
sx={{
zIndex: 1,
width: popperWidth,
}}
open={open}
anchorEl={anchorRef.current}
@ -96,7 +104,12 @@ export const ReviewButton: FC<{
autoFocusItem
>
<MenuItem onClick={onApprove}>
Approve changes
<ListItemIcon>
<CheckBox fontSize="small" />
</ListItemIcon>
<ListItemText>
Approve changes
</ListItemText>
</MenuItem>
<ConditionallyRender
condition={Boolean(
@ -104,7 +117,12 @@ export const ReviewButton: FC<{
)}
show={
<MenuItem onClick={onReject}>
Reject changes
<ListItemIcon>
<Clear fontSize="small" />
</ListItemIcon>
<ListItemText>
Reject changes
</ListItemText>
</MenuItem>
}
/>