Mirrors/unleash.unleash
1
0
Fork 0
mirror of https://github.com/Unleash/unleash.git synced 2025-02-09 00:18:00 +01:00
Code Issues Projects Releases Wiki Activity

chore: remove simplifyProjectOverview flag (#9068)

Browse Source 
Remove the flag and delete unused components.
This commit is contained in:
Jaanus Sellin 2025-01-08 14:10:40 +02:00 committed by GitHub
parent e7269473f3
commit 73515d78ce
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
11 changed files with 29 additions and 226 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
frontend/src/component/filter/AddFilterButton.tsx
View File

@ -8,7 +8,6 @@ import Add from '@mui/icons-material/Add';
import { Box } from '@mui/system';
import type { IFilterItem } from './Filters/Filters';
import { FILTERS_MENU } from 'utils/testIds';
import { useUiFlag } from 'hooks/useUiFlag';
import { HtmlTooltip } from 'component/common/HtmlTooltip/HtmlTooltip';
import useSplashApi from 'hooks/api/actions/useSplashApi/useSplashApi';
import { useAuthSplash } from 'hooks/api/getters/useAuth/useAuthSplash';
@ -53,7 +52,6 @@ export const AddFilterButton = ({
availableFilters,
}: IAddFilterButtonProps) => {
const projectId = useOptionalPathParam('projectId');
const simplifyProjectOverview = useUiFlag('simplifyProjectOverview');
const { user } = useAuthUser();
const { setSplashSeen } = useSplashApi();
const { splash } = useAuthSplash();
@ -85,8 +83,7 @@ export const AddFilterButton = ({
return new Date(createdAt) < cutoffDate;
};
const showArchiveTooltip =
simplifyProjectOverview && projectId && isOldCustomer(user?.createdAt);
const showArchiveTooltip = projectId && isOldCustomer(user?.createdAt);
const ArchiveTooltip = () => {
return (

28
frontend/src/component/project/Project/PaginatedProjectFeatureToggles/ProjectFeatureToggles.tsx
View File

@ -41,7 +41,6 @@ import {
useProjectFeatureSearchActions,
} from './useProjectFeatureSearch';
import { AvatarCell } from './AvatarCell';
import { useUiFlag } from 'hooks/useUiFlag';
import { styled } from '@mui/material';
import useProjectOverview from 'hooks/api/getters/useProjectOverview/useProjectOverview';
import { ConnectSdkDialog } from '../../../onboarding/dialog/ConnectSdkDialog';
@ -92,7 +91,6 @@ export const ProjectFeatureToggles = ({
const projectId = useRequiredPathParam('projectId');
const { project } = useProjectOverview(projectId);
const [connectSdkOpen, setConnectSdkOpen] = useState(false);
const simplifyProjectOverview = useUiFlag('simplifyProjectOverview');
const [modalOpen, setModalOpen] = useState(false);
const {
@ -587,20 +585,18 @@ export const ProjectFeatureToggles = ({
onChange={setTableState}
state={filterState}
/>
{simplifyProjectOverview && (
<ButtonGroup>
<PermissionIconButton
permission={UPDATE_FEATURE}
projectId={projectId}
onClick={() => setModalOpen(true)}
tooltipProps={{ title: 'Import' }}
data-testid={IMPORT_BUTTON}
data-loading-project
>
<ImportSvg />
</PermissionIconButton>
</ButtonGroup>
)}
<ButtonGroup>
<PermissionIconButton
permission={UPDATE_FEATURE}
projectId={projectId}
onClick={() => setModalOpen(true)}
tooltipProps={{ title: 'Import' }}
data-testid={IMPORT_BUTTON}
data-loading-project
>
<ImportSvg />
</PermissionIconButton>
</ButtonGroup>
</FilterRow>
<SearchHighlightProvider
value={tableState.query || ''}

34
frontend/src/component/project/Project/PaginatedProjectFeatureToggles/ProjectOverviewFilters.tsx
View File

@ -6,7 +6,6 @@ import {
type IFilterItem,
} from 'component/filter/Filters/Filters';
import { useProjectFlagCreators } from 'hooks/api/getters/useProjectFlagCreators/useProjectFlagCreators';
import { useUiFlag } from 'hooks/useUiFlag';
interface IProjectOverviewFilters {
state: FilterItemParamHolder;
@ -22,7 +21,6 @@ export const ProjectOverviewFilters: VFC<IProjectOverviewFilters> = ({
const { tags } = useAllTags();
const { flagCreators } = useProjectFlagCreators(project);
const [availableFilters, setAvailableFilters] = useState<IFilterItem[]>([]);
const simplifyProjectOverview = useUiFlag('simplifyProjectOverview');
useEffect(() => {
const tagsOptions = (tags || []).map((tag) => ({
@ -44,14 +42,10 @@ export const ProjectOverviewFilters: VFC<IProjectOverviewFilters> = ({
label: 'Stale',
value: 'stale',
},
...(simplifyProjectOverview
? [
{
label: 'Potentially stale',
value: 'potentially-stale',
},
]
: []),
{
label: 'Potentially stale',
value: 'potentially-stale',
},
];
const availableFilters: IFilterItem[] = [
@ -105,18 +99,14 @@ export const ProjectOverviewFilters: VFC<IProjectOverviewFilters> = ({
singularOperators: ['IS', 'IS_NOT'],
pluralOperators: ['IS_ANY_OF', 'IS_NONE_OF'],
},
...(simplifyProjectOverview
? ([
{
label: 'Show only archived',
icon: 'inventory',
options: [{ label: 'True', value: 'true' }],
filterKey: 'archived',
singularOperators: ['IS'],
pluralOperators: ['IS_ANY_OF'],
},
] as IFilterItem[])
: []),
{
label: 'Show only archived',
icon: 'inventory',
options: [{ label: 'True', value: 'true' }],
filterKey: 'archived',
singularOperators: ['IS'],
pluralOperators: ['IS_ANY_OF'],
},
];
setAvailableFilters(availableFilters);

51
frontend/src/component/project/Project/Project.tsx
View File

@ -1,7 +1,6 @@
import { useNavigate } from 'react-router';
import useLoading from 'hooks/useLoading';
import { ConditionallyRender } from 'component/common/ConditionallyRender/ConditionallyRender';
import { ReactComponent as ImportSvg } from 'assets/icons/import.svg';
import { ReactComponent as ProjectStatusSvg } from 'assets/icons/projectStatus.svg';
import {
StyledDiv,
@ -31,8 +30,6 @@ import ProjectEnvironment from '../ProjectEnvironment/ProjectEnvironment';
import { ProjectFeaturesArchive } from './ProjectFeaturesArchive/ProjectFeaturesArchive';
import ProjectFlags from './ProjectFlags';
import ProjectHealth from './ProjectHealth/ProjectHealth';
import PermissionIconButton from 'component/common/PermissionIconButton/PermissionIconButton';
import { UPDATE_FEATURE } from 'component/providers/AccessProvider/permissions';
import { useRequiredPathParam } from 'hooks/useRequiredPathParam';
import useUiConfig from 'hooks/api/getters/useUiConfig/useUiConfig';
import { Navigate, Route, Routes, useLocation } from 'react-router-dom';
@ -43,7 +40,6 @@ import { ProjectChangeRequests } from '../../changeRequest/ProjectChangeRequests
import { ProjectSettings } from './ProjectSettings/ProjectSettings';
import { useFavoriteProjectsApi } from 'hooks/api/actions/useFavoriteProjectsApi/useFavoriteProjectsApi';
import { ImportModal } from './Import/ImportModal';
import { IMPORT_BUTTON } from 'utils/testIds';
import { EnterpriseBadge } from 'component/common/EnterpriseBadge/EnterpriseBadge';
import { Badge } from 'component/common/Badge/Badge';
import type { UiFlags } from 'interfaces/uiConfig';
@ -54,7 +50,6 @@ import { ProjectInsights } from './ProjectInsights/ProjectInsights';
import useProjectOverview from 'hooks/api/getters/useProjectOverview/useProjectOverview';
import { ProjectArchived } from './ArchiveProject/ProjectArchived';
import { usePlausibleTracker } from '../../../hooks/usePlausibleTracker';
import { useUiFlag } from 'hooks/useUiFlag';
import { useActionableChangeRequests } from 'hooks/api/getters/useActionableChangeRequests/useActionableChangeRequests';
import { ProjectStatusModal } from './ProjectStatus/ProjectStatusModal';
@ -94,14 +89,9 @@ const TabText = styled('span')(({ theme }) => ({
}));
const ChangeRequestsLabel = () => {
const simplifyProjectOverview = useUiFlag('simplifyProjectOverview');
const projectId = useRequiredPathParam('projectId');
const { total } = useActionableChangeRequests(projectId);
if (!simplifyProjectOverview) {
return 'Change requests';
}
return (
<StyledCounterBadge badgeContent={total ?? 0} color='primary'>
<TabText>Change requests</TabText>
@ -155,7 +145,6 @@ export const Project = () => {
const basePath = `/projects/${projectId}`;
const projectName = project?.name || projectId;
const { favorite, unfavorite } = useFavoriteProjectsApi();
const simplifyProjectOverview = useUiFlag('simplifyProjectOverview');
const [showDelDialog, setShowDelDialog] = useState(false);
@ -166,29 +155,10 @@ export const Project = () => {
const tabs: ITab[] = [
{
title: simplifyProjectOverview ? 'Overview' : 'Flags',
title: 'Overview',
path: basePath,
name: 'flags',
},
...(simplifyProjectOverview
? []
: [
{
title: 'Insights',
path: `${basePath}/insights`,
name: 'insights',
},
{
title: 'Health',
path: `${basePath}/health`,
name: 'health',
},
{
title: 'Archived flags',
path: `${basePath}/archive`,
name: 'archive',
} as ITab,
]),
{
title: 'Change requests',
path: `${basePath}/change-requests`,
@ -207,7 +177,7 @@ export const Project = () => {
name: 'logs',
},
{
title: simplifyProjectOverview ? 'Settings' : 'Project settings',
title: 'Settings',
path: `${basePath}/settings`,
ossPath: `${basePath}/settings/api-access`,
name: 'settings',
@ -301,22 +271,7 @@ export const Project = () => {
</StyledProjectTitle>
</StyledDiv>
<StyledDiv>
<ConditionallyRender
condition={Boolean(!simplifyProjectOverview)}
show={
<PermissionIconButton
permission={UPDATE_FEATURE}
projectId={projectId}
onClick={() => setModalOpen(true)}
tooltipProps={{ title: 'Import' }}
data-testid={IMPORT_BUTTON}
data-loading-project
>
<ImportSvg />
</PermissionIconButton>
}
/>
{simplifyProjectOverview && <ProjectStatus />}
<ProjectStatus />
</StyledDiv>
</StyledTopRow>
</StyledInnerContainer>

7
frontend/src/component/project/Project/ProjectFlags.tsx
View File

@ -7,7 +7,6 @@ import useProjectOverview, {
} from 'hooks/api/getters/useProjectOverview/useProjectOverview';
import { usePageTitle } from 'hooks/usePageTitle';
import { useLastViewedProject } from 'hooks/useLastViewedProject';
import { ProjectOverviewChangeRequests } from './ProjectOverviewChangeRequests';
import { OutdatedSdksBanner } from '../../banners/OutdatedSdksBanner/OutdatedSdksBanner';
import { useUiFlag } from 'hooks/useUiFlag';
import { ConditionallyRender } from '../../common/ConditionallyRender/ConditionallyRender';
@ -51,19 +50,13 @@ const ProjectOverview: FC = () => {
setLastViewed(projectId);
}, [projectId, setLastViewed]);
const hideChangeRequestOverview = useUiFlag('simplifyProjectOverview');
return (
<StyledContainer key={projectId}>
<StyledContentContainer>
{hideChangeRequestOverview ? null : (
<ProjectOverviewChangeRequests project={projectId} />
)}
<ConditionallyRender
condition={outdatedSdksBannerEnabled}
show={<OutdatedSdksBanner project={projectId} />}
/>
<StyledProjectToggles>
<ProjectFeatureToggles
environments={project.environments.map(

45
frontend/src/component/project/Project/ProjectOverviewChangeRequests.test.tsx
View File

@ -1,45 +0,0 @@
import { screen } from '@testing-library/react';
import { render } from 'utils/testRenderer';
import { testServerRoute, testServerSetup } from 'utils/testServer';
import { ProjectOverviewChangeRequests } from './ProjectOverviewChangeRequests';
const server = testServerSetup();
const setupEnterpriseApi = () => {
testServerRoute(server, '/api/admin/ui-config', {
versionInfo: {
current: { enterprise: 'present' },
},
});
testServerRoute(
server,
'/api/admin/projects/default/change-requests/config',
[
{
environment: 'default',
changeRequestEnabled: true,
},
],
);
testServerRoute(
server,
'/api/admin/projects/default/change-requests/count',
{
total: 14,
approved: 2,
applied: 0,
rejected: 0,
reviewRequired: 10,
scheduled: 2,
},
);
};
test('Show change requests count', async () => {
setupEnterpriseApi();
render(<ProjectOverviewChangeRequests project='default' />);
await screen.findByText('4');
await screen.findByText('10');
await screen.findByText('View change requests');
});

74
frontend/src/component/project/Project/ProjectOverviewChangeRequests.tsx
View File

@ -1,74 +0,0 @@
import { Box, styled, Typography } from '@mui/material';
import { Link } from 'react-router-dom';
import type { FC } from 'react';
import { useChangeRequestsEnabled } from 'hooks/useChangeRequestsEnabled';
import { useChangeRequestsCount } from 'hooks/api/getters/useChangeRequestsCount/useChangeRequestsCount';
export const ChangeRequestContainer = styled(Box)(({ theme }) => ({
margin: '0',
textAlign: 'center',
backgroundColor: theme.palette.background.paper,
borderRadius: theme.shape.borderRadiusLarge,
width: '100%',
padding: theme.spacing(1, 3.25),
display: 'flex',
alignItems: 'center',
flexWrap: 'wrap',
gap: theme.spacing(2),
fontSize: theme.fontSizes.smallBody,
}));
const ColorBox = styled(Box)(({ theme }) => ({
borderRadius: '8px',
padding: theme.spacing(1, 2),
display: 'flex',
gap: theme.spacing(2),
justifyContent: 'space-between',
alignItems: 'center',
whiteSpace: 'nowrap',
}));
const ApplyBox = styled(ColorBox)(({ theme }) => ({
background: theme.palette.success.light,
}));
const ReviewBox = styled(ColorBox)(({ theme }) => ({
background: theme.palette.secondary.light,
}));
const ChangeRequestCount = styled(Typography)(({ theme }) => ({
fontSize: theme.spacing(2),
fontWeight: theme.fontWeight.bold,
}));
export const ProjectOverviewChangeRequests: FC<{ project: string }> = ({
project,
}) => {
const { isChangeRequestConfiguredInAnyEnv } =
useChangeRequestsEnabled(project);
const { data } = useChangeRequestsCount(project);
if (!isChangeRequestConfiguredInAnyEnv()) {
return null;
}
const toBeApplied = data.scheduled + data.approved;
const toBeReviewed = data.reviewRequired;
return (
<ChangeRequestContainer>
<Box>Open change requests</Box>
<ApplyBox>
<span>To be applied</span>
<ChangeRequestCount>{toBeApplied}</ChangeRequestCount>
</ApplyBox>
<ReviewBox>
<span>To be reviewed</span>
<ChangeRequestCount>{toBeReviewed}</ChangeRequestCount>
</ReviewBox>
<Link to={`/projects/${project}/change-requests`}>
View change requests
</Link>
</ChangeRequestContainer>
);
};

1
frontend/src/interfaces/uiConfig.ts
View File

@ -86,7 +86,6 @@ export type UiFlags = {
flagCreator?: boolean;
releasePlans?: boolean;
'enterprise-payg'?: boolean;
simplifyProjectOverview?: boolean;
productivityReportEmail?: boolean;
showUserDeviceCount?: boolean;
flagOverviewRedesign?: boolean;

4
src/lib/routes/admin-api/project/health-report.ts
View File

@ -42,9 +42,7 @@ export default class ProjectHealthReport extends Controller {
middleware: [
openApiService.validPath({
tags: ['Projects'],
deprecated: config.flagResolver.isEnabled(
'simplifyProjectOverview',
),
deprecated: true,
operationId: 'getProjectHealthReport',
summary: 'Get a health report for a project.',
description:

5
src/lib/types/experimental.ts
View File

@ -52,7 +52,6 @@ export type IFlagKey =
| 'releasePlans'
| 'productivityReportEmail'
| 'enterprise-payg'
| 'simplifyProjectOverview'
| 'flagOverviewRedesign'
| 'showUserDeviceCount'
| 'deleteStaleUserSessions'
@ -262,10 +261,6 @@ const flags: IFlags = {
process.env.UNLEASH_EXPERIMENTAL_SHOW_USER_DEVICE_COUNT,
false,
),
simplifyProjectOverview: parseEnvVarBoolean(
process.env.UNLEASH_EXPERIMENTAL_SIMPLIFY_PROJECT_OVERVIEW,
false,
),
flagOverviewRedesign: parseEnvVarBoolean(
process.env.UNLEASH_EXPERIMENTAL_FLAG_OVERVIEW_REDESIGN,
false,

1
src/server-dev.ts
View File

@ -51,7 +51,6 @@ process.nextTick(async () => {
originMiddlewareRequestLogging: true,
webhookDomainLogging: true,
releasePlans: false,
simplifyProjectOverview: true,
showUserDeviceCount: true,
flagOverviewRedesign: false,
granularAdminPermissions: true,