1
0
mirror of https://github.com/Unleash/unleash.git synced 2025-09-24 17:51:14 +02:00

chore: allows you to add a flag from the unknown flags list

This commit is contained in:
Nuno Góis 2025-08-28 16:43:55 +01:00
parent 709a890bd8
commit 17b3fa44ea
No known key found for this signature in database
GPG Key ID: 71ECC689F1091765
2 changed files with 55 additions and 0 deletions

View File

@ -0,0 +1,43 @@
import Add from '@mui/icons-material/Add';
import { Box, styled } from '@mui/material';
import PermissionIconButton from 'component/common/PermissionIconButton/PermissionIconButton';
import { CREATE_FEATURE } from 'component/providers/AccessProvider/permissions';
import type { UnknownFlag } from './hooks/useUnknownFlags.js';
import { Link } from 'react-router-dom';
import useProjects from 'hooks/api/getters/useProjects/useProjects.js';
import { DEFAULT_PROJECT_ID } from 'hooks/api/getters/useDefaultProject/useDefaultProjectId.js';
const StyledBox = styled(Box)(() => ({
display: 'flex',
justifyContent: 'center',
}));
interface IUnknownFlagsActionsCellProps {
unknownFlag: UnknownFlag;
}
export const UnknownFlagsActionsCell = ({
unknownFlag,
}: IUnknownFlagsActionsCellProps) => {
const { projects } = useProjects();
const project = projects.find(({ id }) => id === DEFAULT_PROJECT_ID)
? DEFAULT_PROJECT_ID
: projects[0]?.id || DEFAULT_PROJECT_ID;
return (
<StyledBox>
<PermissionIconButton
component={Link}
data-loading
to={`/projects/${project}?create=true&name=${unknownFlag.name}`}
permission={CREATE_FEATURE}
tooltipProps={{
title: 'Create feature flag',
}}
>
<Add />
</PermissionIconButton>
</StyledBox>
);
};

View File

@ -18,6 +18,7 @@ import { useUiFlag } from 'hooks/useUiFlag.js';
import NotFound from 'component/common/NotFound/NotFound.js';
import { UnknownFlagsSeenInUnleashCell } from './UnknownFlagsSeenInUnleashCell.js';
import { HelpIcon } from 'component/common/HelpIcon/HelpIcon.js';
import { UnknownFlagsActionsCell } from './UnknownFlagsActionsCell.js';
const StyledAlert = styled(Alert)(({ theme }) => ({
marginBottom: theme.spacing(3),
@ -104,6 +105,17 @@ export const UnknownFlagsTable = () => {
),
width: 150,
},
{
Header: 'Actions',
align: 'center',
Cell: ({
row: { original: unknownFlag },
}: {
row: { original: UnknownFlag };
}) => <UnknownFlagsActionsCell unknownFlag={unknownFlag} />,
width: 100,
disableSortBy: true,
},
],
[],
);