1
0
mirror of https://github.com/Unleash/unleash.git synced 2025-09-10 17:53:36 +02:00

move stale-unstale selected to separate menu

This commit is contained in:
Tymoteusz Czech 2023-03-14 10:59:34 +01:00
parent a8f66dc772
commit 0906ba736b
No known key found for this signature in database
GPG Key ID: 133555230D88D75F
2 changed files with 118 additions and 9 deletions

View File

@ -0,0 +1,115 @@
import { useState, VFC } from 'react';
import {
IconButton,
ListItemIcon,
ListItemText,
MenuItem,
MenuList,
Popover,
Tooltip,
Typography,
} from '@mui/material';
import { PermissionHOC } from 'component/common/PermissionHOC/PermissionHOC';
import { UPDATE_FEATURE } from 'component/providers/AccessProvider/permissions';
import { MoreVert, WatchLater } from '@mui/icons-material';
interface IMoreActionsProps {
projectId: string;
}
const menuId = 'selection-actions-menu';
export const MoreActions: VFC<IMoreActionsProps> = ({ projectId }) => {
const [anchorEl, setAnchorEl] = useState<null | HTMLElement>(null);
const open = Boolean(anchorEl);
const handleClick = (event: React.MouseEvent<HTMLButtonElement>) => {
setAnchorEl(event.currentTarget);
};
const handleClose = () => {
setAnchorEl(null);
};
return (
<>
<Tooltip title="Feature toggle actions" arrow describeChild>
<IconButton
id={menuId}
aria-controls={open ? menuId : undefined}
aria-haspopup="true"
aria-expanded={open ? 'true' : undefined}
onClick={handleClick}
type="button"
>
<MoreVert />
</IconButton>
</Tooltip>
<Popover
id={`${menuId}-menu`}
anchorEl={anchorEl}
open={open}
onClose={handleClose}
transformOrigin={{ horizontal: 'right', vertical: 'top' }}
anchorOrigin={{ horizontal: 'right', vertical: 'bottom' }}
disableScrollLock={true}
PaperProps={{
sx: theme => ({
borderRadius: theme.shape.borderRadius,
padding: theme.spacing(1, 1.5),
}),
}}
>
<MenuList aria-labelledby={`${menuId}-menu`}>
<PermissionHOC
projectId={projectId}
permission={UPDATE_FEATURE}
>
{({ hasAccess }) => (
<>
<MenuItem
// sx={defaultBorderRadius}
// onClick={() => {
// handleClose();
// onOpenStaleDialog({
// featureId,
// stale: stale === true,
// });
// }}
disabled={!hasAccess}
>
<ListItemIcon>
<WatchLater />
</ListItemIcon>
<ListItemText>
<Typography variant="body2">
Mark as stale
</Typography>
</ListItemText>
</MenuItem>
<MenuItem
// sx={defaultBorderRadius}
// onClick={() => {
// handleClose();
// onOpenStaleDialog({
// featureId,
// stale: stale === true,
// });
// }}
disabled={!hasAccess}
>
<ListItemIcon>
<WatchLater />
</ListItemIcon>
<ListItemText>
<Typography variant="body2">
Un-mark as stale
</Typography>
</ListItemText>
</MenuItem>
</>
)}
</PermissionHOC>
</MenuList>
</Popover>
</>
);
};

View File

@ -1,11 +1,12 @@
import { useMemo, useState, VFC } from 'react';
import { Box, Button, Paper, styled, Typography } from '@mui/material';
import { FileDownload, Label, WatchLater } from '@mui/icons-material';
import { FileDownload, Label, MoreVert, WatchLater } from '@mui/icons-material';
import type { FeatureSchema } from 'openapi';
import useUiConfig from 'hooks/api/getters/useUiConfig/useUiConfig';
import { ExportDialog } from 'component/feature/FeatureToggleList/ExportDialog';
import { ConditionallyRender } from 'component/common/ConditionallyRender/ConditionallyRender';
import { ArchiveButton } from './ArchiveButton/ArchiveButton';
import { MoreActions } from './MoreActions/MoreActions';
interface ISelectionActionsBarProps {
selectedIds: string[];
@ -75,14 +76,6 @@ export const SelectionActionsBar: VFC<ISelectionActionsBarProps> = ({
&ensp;selected
</StyledText>
<ArchiveButton projectId={projectId} features={selectedIds} />
<Button
disabled
startIcon={<WatchLater />}
variant="outlined"
size="small"
>
Mark as stale
</Button>
<Button
startIcon={<FileDownload />}
variant="outlined"
@ -99,6 +92,7 @@ export const SelectionActionsBar: VFC<ISelectionActionsBarProps> = ({
>
Tags
</Button>
<MoreActions projectId={projectId} />
</StyledBar>
<ConditionallyRender
condition={Boolean(uiConfig?.flags?.featuresExportImport)}