feat: archived toggles do not show switch (#8696)

Archived toggles will not show switch anymore, but a dash. ![Screenshot from 2024-11-08 11-41-17](https://github.com/user-attachments/assets/d43de8ff-13c3-4f70-8f8f-b7e5bbc4d0bc)
Unleash · Nov 8, 2024 · 5733f91 · 5733f91
1 parent b4fde58
commit 5733f91
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 0 deletions.
diff --git a/...nt/project/Project/PaginatedProjectFeatureToggles/FeatureToggleCell/FeatureToggleCell.tsx b/...nt/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 = () => (
         <div data-loading>toggle</div>
     </StyledSwitchContainer>
 );
+export const ArchivedFeatureToggleCell = () => (
+    <StyledDiv aria-hidden='true'>-</StyledDiv>
+);
diff --git a/...nd/src/component/project/Project/PaginatedProjectFeatureToggles/ProjectFeatureToggles.tsx b/...nd/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 ? (
                                 <PlaceholderFeatureToggleCell />
+                            ) : archived ? (
+                                <ArchivedFeatureToggleCell />
                             ) : (
                                 <FeatureToggleCell
                                     value={environment?.enabled || false}