diff --git a/frontend/src/component/project/Project/PaginatedProjectFeatureToggles/FeatureToggleCell/FeatureToggleCell.tsx b/frontend/src/component/project/Project/PaginatedProjectFeatureToggles/FeatureToggleCell/FeatureToggleCell.tsx index 5c7da94e41d7..983ed00d8587 100644 --- a/frontend/src/component/project/Project/PaginatedProjectFeatureToggles/FeatureToggleCell/FeatureToggleCell.tsx +++ b/frontend/src/component/project/Project/PaginatedProjectFeatureToggles/FeatureToggleCell/FeatureToggleCell.tsx @@ -22,6 +22,12 @@ const StyledSwitchContainer = styled('div', { }), })); +const StyledDiv = styled('div')(({ theme }) => ({ + flexGrow: 0, + ...flexRow, + justifyContent: 'center', +})); + interface IFeatureToggleCellProps { projectId: string; environmentName: string; @@ -90,3 +96,6 @@ export const PlaceholderFeatureToggleCell = () => (
toggle
); +export const ArchivedFeatureToggleCell = () => ( + +); diff --git a/frontend/src/component/project/Project/PaginatedProjectFeatureToggles/ProjectFeatureToggles.tsx b/frontend/src/component/project/Project/PaginatedProjectFeatureToggles/ProjectFeatureToggles.tsx index 50bee4226d99..14b74c6156de 100644 --- a/frontend/src/component/project/Project/PaginatedProjectFeatureToggles/ProjectFeatureToggles.tsx +++ b/frontend/src/component/project/Project/PaginatedProjectFeatureToggles/ProjectFeatureToggles.tsx @@ -26,6 +26,7 @@ import { createColumnHelper, useReactTable } from '@tanstack/react-table'; import { withTableState } from 'utils/withTableState'; import type { FeatureSearchResponseSchema } from 'openapi'; import { + ArchivedFeatureToggleCell, FeatureToggleCell, PlaceholderFeatureToggleCell, } from './FeatureToggleCell/FeatureToggleCell'; @@ -292,6 +293,7 @@ export const ProjectFeatureToggles = ({ return columnHelper.accessor( (row) => ({ + archived: row.archivedAt !== null, featureId: row.name, environment: row.environments?.find( (featureEnvironment) => @@ -317,10 +319,13 @@ export const ProjectFeatureToggles = ({ featureId, environment, someEnabledEnvironmentHasVariants, + archived, } = getValue(); return isPlaceholder ? ( + ) : archived ? ( + ) : (