diff --git a/frontend/src/component/unknownFlags/UnknownFlagsActionsCell.tsx b/frontend/src/component/unknownFlags/UnknownFlagsActionsCell.tsx new file mode 100644 index 0000000000..86ab729be0 --- /dev/null +++ b/frontend/src/component/unknownFlags/UnknownFlagsActionsCell.tsx @@ -0,0 +1,33 @@ +import { Box, styled } from '@mui/material'; +import PermissionIconButton from 'component/common/PermissionIconButton/PermissionIconButton'; +import { ADMIN } from 'component/providers/AccessProvider/permissions'; +import EventNoteIcon from '@mui/icons-material/EventNote'; +import type { UnknownFlag } from './hooks/useUnknownFlags.js'; +import { Link } from 'react-router-dom'; + +const StyledBox = styled(Box)(() => ({ + display: 'flex', + justifyContent: 'center', +})); + +interface IUnknownFlagsActionsCellProps { + unknownFlag: UnknownFlag; +} + +export const UnknownFlagsActionsCell = ({ + unknownFlag, +}: IUnknownFlagsActionsCellProps) => ( + + + + + +); diff --git a/frontend/src/component/unknownFlags/UnknownFlagsTable.tsx b/frontend/src/component/unknownFlags/UnknownFlagsTable.tsx index 4cb7b93f24..b39e0a8f4d 100644 --- a/frontend/src/component/unknownFlags/UnknownFlagsTable.tsx +++ b/frontend/src/component/unknownFlags/UnknownFlagsTable.tsx @@ -9,13 +9,14 @@ import { useFlexLayout, useSortBy, useTable } from 'react-table'; import { sortTypes } from 'utils/sortTypes'; import { Search } from 'component/common/Search/Search'; import { useSearch } from 'hooks/useSearch'; -import { useUnknownFlags } from './hooks/useUnknownFlags.js'; +import { type UnknownFlag, useUnknownFlags } from './hooks/useUnknownFlags.js'; import theme from 'themes/theme.js'; import { TimeAgoCell } from 'component/common/Table/cells/TimeAgoCell/TimeAgoCell.js'; import { formatDateYMDHMS } from 'utils/formatDate.js'; import { HighlightCell } from 'component/common/Table/cells/HighlightCell/HighlightCell.js'; import { useUiFlag } from 'hooks/useUiFlag.js'; import NotFound from 'component/common/NotFound/NotFound.js'; +import { UnknownFlagsActionsCell } from './UnknownFlagsActionsCell.js'; const StyledAlert = styled(Alert)(({ theme }) => ({ marginBottom: theme.spacing(3), @@ -59,6 +60,18 @@ export const UnknownFlagsTable = () => { ), }, + { + Header: 'Actions', + id: 'Actions', + align: 'center', + Cell: ({ + row: { original: unknownFlag }, + }: { row: { original: UnknownFlag } }) => ( + + ), + width: 100, + disableSortBy: true, + }, ], [], );