diff --git a/frontend/src/component/unknownFlags/UnknownFlagsActionsCell.tsx b/frontend/src/component/unknownFlags/UnknownFlagsActionsCell.tsx
new file mode 100644
index 0000000000..dc1a9c81e5
--- /dev/null
+++ b/frontend/src/component/unknownFlags/UnknownFlagsActionsCell.tsx
@@ -0,0 +1,54 @@
+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';
+import AccessContext from 'contexts/AccessContext.js';
+import { useContext } from 'react';
+
+const StyledBox = styled(Box)(() => ({
+ display: 'flex',
+ justifyContent: 'center',
+}));
+
+interface IUnknownFlagsActionsCellProps {
+ unknownFlag: UnknownFlag;
+}
+
+export const UnknownFlagsActionsCell = ({
+ unknownFlag,
+}: IUnknownFlagsActionsCellProps) => {
+ const { projects } = useProjects();
+ const { hasAccess } = useContext(AccessContext);
+
+ let project =
+ projects.find(({ id }) => id === DEFAULT_PROJECT_ID) || projects[0];
+ if (!hasAccess(CREATE_FEATURE, project?.id)) {
+ for (const proj of projects) {
+ if (hasAccess(CREATE_FEATURE, proj.id)) {
+ project = proj;
+ break;
+ }
+ }
+ }
+
+ return (
+
+
+
+
+
+ );
+};
diff --git a/frontend/src/component/unknownFlags/UnknownFlagsTable.tsx b/frontend/src/component/unknownFlags/UnknownFlagsTable.tsx
index 6710e0f202..714ec76bd5 100644
--- a/frontend/src/component/unknownFlags/UnknownFlagsTable.tsx
+++ b/frontend/src/component/unknownFlags/UnknownFlagsTable.tsx
@@ -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 };
+ }) => ,
+ width: 100,
+ disableSortBy: true,
+ },
],
[],
);