Mirrors/unleash.unleash
1
0
Fork 0
mirror of https://github.com/Unleash/unleash.git synced 2025-11-24 20:06:55 +01:00
Code Issues Projects Releases Wiki Activity

chore(AI): newStrategyModal flag cleanup (#10912)

Browse Source 
This PR cleans up the newStrategyModal flag. These changes were
automatically generated by AI and should be reviewed carefully.

Fixes #10911



🧹 AI Flag Cleanup Summary

This change removes the newStrategyModal feature flag, making the new
"Add
strategy" modal the default and only experience for adding strategies to
a
feature.

I've removed the flag checks and the legacy code paths for the old
strategy
menu. The FeatureStrategyMenu component is now simplified to only render
the new
modal experience. I have also removed the flag from backend
configurations and
frontend interfaces.

🚮 Removed

• Feature Flag: newStrategyModal flag definition and configuration from
experimental.ts, server-dev.ts, and uiConfig.ts.
• Conditional Logic: All checks for the newStrategyModal flag in
FeatureStrategyMenu.tsx.
• Legacy Components: The old strategy menu
(LegacyFeatureStrategyMenuCards) and
related dialogs (LegacyReleasePlanReviewDialog) have been removed from
FeatureStrategyMenu.tsx.
• Unused Code: Unused state variables, functions
(openDefaultStrategyCreationModal, openReleasePlans), and imports
related to
the legacy strategy menu have been cleaned up.

🛠 Kept

• New "Add strategy" modal: The new modal for adding strategies is now
the only
implementation. Its user experience is preserved and made default.

📝 Why

The newStrategyModal feature has been completed, and the decision was to
keep
the new user experience. This cleanup removes the complexity of
maintaining two
different UI paths for adding strategies, making the code cleaner and
easier to
maintain.

---------

Co-authored-by: unleash-bot <194219037+unleash-bot[bot]@users.noreply.github.com>
Co-authored-by: Nuno Góis <github@nunogois.com>
This commit is contained in:
unleash-bot[bot] 2025-11-05 08:59:18 +00:00 committed by GitHub
parent 8d00eea66a
commit 11a2860700
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
4 changed files with 71 additions and 219 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

283
frontend/src/component/feature/FeatureStrategy/FeatureStrategyMenu/FeatureStrategyMenu.tsx
View File

@ -1,14 +1,10 @@
import type React from 'react';
import { useEffect, useState } from 'react';
import { useNavigate } from 'react-router-dom';
import PermissionButton, {
type IPermissionButtonProps,
} from 'component/common/PermissionButton/PermissionButton';
import { CREATE_FEATURE_STRATEGY } from 'component/providers/AccessProvider/permissions';
import { Box, Dialog, IconButton, styled, Typography } from '@mui/material';
import { LegacyFeatureStrategyMenuCards } from './LegacyFeatureStrategyMenuCards/LegacyFeatureStrategyMenuCards.tsx';
import { formatCreateStrategyPath } from '../FeatureStrategyCreate/FeatureStrategyCreate.tsx';
import MoreVert from '@mui/icons-material/MoreVert';
import CloseIcon from '@mui/icons-material/Close';
import { usePlausibleTracker } from 'hooks/usePlausibleTracker';
import type { IReleasePlanTemplate } from 'interfaces/releasePlans';
@ -19,14 +15,11 @@ import { useReleasePlansApi } from 'hooks/api/actions/useReleasePlansApi/useRele
import { useFeatureReleasePlans } from 'hooks/api/getters/useFeatureReleasePlans/useFeatureReleasePlans';
import { useChangeRequestsEnabled } from 'hooks/useChangeRequestsEnabled';
import { formatUnknownError } from 'utils/formatUnknownError';
import useUiConfig from 'hooks/api/getters/useUiConfig/useUiConfig';
import { LegacyReleasePlanReviewDialog } from 'component/feature/FeatureView/FeatureOverview/ReleasePlan/LegacyReleasePlanReviewDialog.tsx';
import { ReleasePlanPreview } from './ReleasePlanPreview.tsx';
import {
FeatureStrategyMenuCards,
type StrategyFilterValue,
} from './FeatureStrategyMenuCards/FeatureStrategyMenuCards.tsx';
import { useUiFlag } from 'hooks/useUiFlag.ts';
import { ReleasePlanConfirmationDialog } from './ReleasePlanConfirmationDialog.tsx';
interface IFeatureStrategyMenuProps {
@ -46,13 +39,6 @@ const StyledStrategyMenu = styled('div')(({ theme }) => ({
gap: theme.spacing(1),
}));
const StyledAdditionalMenuButton = styled(PermissionButton)(({ theme }) => ({
minWidth: 0,
width: theme.spacing(4.5),
alignSelf: 'stretch',
paddingBlock: 0,
}));
const StyledHeader = styled(Box)(({ theme }) => ({
display: 'flex',
justifyContent: 'space-between',
@ -71,13 +57,10 @@ export const FeatureStrategyMenu = ({
}: IFeatureStrategyMenuProps) => {
const [isStrategyMenuDialogOpen, setIsStrategyMenuDialogOpen] =
useState<boolean>(false);
const [onlyReleasePlans, setOnlyReleasePlans] = useState<boolean>(false);
const [filter, setFilter] = useState<StrategyFilterValue>(null);
const navigate = useNavigate();
const { trackEvent } = usePlausibleTracker();
const [selectedTemplate, setSelectedTemplate] =
useState<IReleasePlanTemplate>();
const [addReleasePlanOpen, setAddReleasePlanOpen] = useState(false);
const [releasePlanPreview, setReleasePlanPreview] = useState(false);
const [addReleasePlanConfirmationOpen, setAddReleasePlanConfirmationOpen] =
useState(false);
@ -95,10 +78,7 @@ export const FeatureStrategyMenu = ({
environmentId,
);
const { addReleasePlanToFeature } = useReleasePlansApi();
const { isEnterprise } = useUiConfig();
const displayReleasePlanButton = isEnterprise();
const crProtected = isChangeRequestConfigured(environmentId);
const newStrategyModalEnabled = useUiFlag('newStrategyModal');
const activeReleasePlan = releasePlans[0];
@ -111,22 +91,7 @@ export const FeatureStrategyMenu = ({
setReleasePlanPreview(false);
}, [isStrategyMenuDialogOpen]);
const openDefaultStrategyCreationModal = (event: React.SyntheticEvent) => {
trackEvent('strategy-add', {
props: {
buttonTitle: label,
},
});
navigate(createStrategyPath);
};
const openMoreStrategies = (event: React.SyntheticEvent) => {
setOnlyReleasePlans(false);
setIsStrategyMenuDialogOpen(true);
};
const openReleasePlans = (event: React.SyntheticEvent) => {
setOnlyReleasePlans(true);
setIsStrategyMenuDialogOpen(true);
};
@ -135,7 +100,7 @@ export const FeatureStrategyMenu = ({
confirmed?: boolean,
) => {
try {
if (newStrategyModalEnabled && !confirmed && activeReleasePlan) {
if (!confirmed && activeReleasePlan) {
setAddReleasePlanConfirmationOpen(true);
return;
}
@ -177,7 +142,6 @@ export const FeatureStrategyMenu = ({
},
});
setAddReleasePlanConfirmationOpen(false);
setAddReleasePlanOpen(false);
setSelectedTemplate(undefined);
onClose();
} catch (error: unknown) {
@ -185,91 +149,24 @@ export const FeatureStrategyMenu = ({
}
};
const createStrategyPath = formatCreateStrategyPath(
projectId,
featureId,
environmentId,
'flexibleRollout',
true,
);
return (
<StyledStrategyMenu onClick={(event) => event.stopPropagation()}>
{newStrategyModalEnabled ? (
<PermissionButton
data-testid='ADD_STRATEGY_BUTTON'
permission={CREATE_FEATURE_STRATEGY}
projectId={projectId}
environmentId={environmentId}
onClick={openMoreStrategies}
aria-labelledby={dialogId}
variant={variant}
sx={{ minWidth: matchWidth ? '282px' : 'auto' }}
disabled={Boolean(disableReason)}
tooltipProps={{
title: disableReason ? disableReason : undefined,
}}
>
Add strategy
</PermissionButton>
) : (
<>
{displayReleasePlanButton ? (
<PermissionButton
data-testid='ADD_TEMPLATE_BUTTON'
permission={CREATE_FEATURE_STRATEGY}
projectId={projectId}
environmentId={environmentId}
onClick={openReleasePlans}
aria-labelledby={dialogId}
variant='outlined'
sx={{ minWidth: matchWidth ? '282px' : 'auto' }}
disabled={Boolean(disableReason)}
tooltipProps={{
title: disableReason
? disableReason
: undefined,
}}
>
Use template
</PermissionButton>
) : null}
<PermissionButton
data-testid='ADD_STRATEGY_BUTTON'
permission={CREATE_FEATURE_STRATEGY}
projectId={projectId}
environmentId={environmentId}
onClick={openDefaultStrategyCreationModal}
aria-labelledby={dialogId}
variant={variant}
sx={{ minWidth: matchWidth ? '282px' : 'auto' }}
disabled={Boolean(disableReason)}
tooltipProps={{
title: disableReason ? disableReason : undefined,
}}
>
{label}
</PermissionButton>
<StyledAdditionalMenuButton
permission={CREATE_FEATURE_STRATEGY}
projectId={projectId}
environmentId={environmentId}
onClick={openMoreStrategies}
variant='outlined'
hideLockIcon
disabled={Boolean(disableReason)}
tooltipProps={{
title: disableReason
? disableReason
: 'More strategies',
}}
>
<MoreVert />
</StyledAdditionalMenuButton>
</>
)}
<PermissionButton
data-testid='ADD_STRATEGY_BUTTON'
permission={CREATE_FEATURE_STRATEGY}
projectId={projectId}
environmentId={environmentId}
onClick={openMoreStrategies}
aria-labelledby={dialogId}
variant={variant}
sx={{ minWidth: matchWidth ? '282px' : 'auto' }}
disabled={Boolean(disableReason)}
tooltipProps={{
title: disableReason ? disableReason : undefined,
}}
>
Add strategy
</PermissionButton>
<Dialog
open={isStrategyMenuDialogOpen}
onClose={onClose}
@ -277,104 +174,66 @@ export const FeatureStrategyMenu = ({
PaperProps={{
sx: {
borderRadius: '12px',
height: newStrategyModalEnabled ? '100%' : 'auto',
height: '100%',
width: '100%',
},
}}
>
{newStrategyModalEnabled ? (
<>
<StyledHeader>
<Typography variant='h2'>Add strategy</Typography>
<IconButton
size='small'
onClick={onClose}
edge='end'
aria-label='close'
>
<CloseIcon fontSize='small' />
</IconButton>
</StyledHeader>
{releasePlanPreview && selectedTemplate ? (
<ReleasePlanPreview
template={selectedTemplate}
projectId={projectId}
featureName={featureId}
environment={environmentId}
activeReleasePlan={activeReleasePlan}
crProtected={crProtected}
onBack={() => setReleasePlanPreview(false)}
onConfirm={() => {
addReleasePlan(selectedTemplate);
}}
/>
) : (
<FeatureStrategyMenuCards
projectId={projectId}
featureId={featureId}
environmentId={environmentId}
filter={filter}
setFilter={setFilter}
onAddReleasePlan={(template) => {
setSelectedTemplate(template);
addReleasePlan(template);
}}
onReviewReleasePlan={(template) => {
setSelectedTemplate(template);
setReleasePlanPreview(true);
}}
onClose={onClose}
/>
)}
</>
) : (
<LegacyFeatureStrategyMenuCards
projectId={projectId}
featureId={featureId}
environmentId={environmentId}
onlyReleasePlans={onlyReleasePlans}
onAddReleasePlan={(template) => {
setSelectedTemplate(template);
addReleasePlan(template);
}}
onReviewReleasePlan={(template) => {
setSelectedTemplate(template);
setAddReleasePlanOpen(true);
onClose();
}}
onClose={onClose}
/>
)}
<>
<StyledHeader>
<Typography variant='h2'>Add strategy</Typography>
<IconButton
size='small'
onClick={onClose}
edge='end'
aria-label='close'
>
<CloseIcon fontSize='small' />
</IconButton>
</StyledHeader>
{releasePlanPreview && selectedTemplate ? (
<ReleasePlanPreview
template={selectedTemplate}
projectId={projectId}
featureName={featureId}
environment={environmentId}
activeReleasePlan={activeReleasePlan}
crProtected={crProtected}
onBack={() => setReleasePlanPreview(false)}
onConfirm={() => {
addReleasePlan(selectedTemplate);
}}
/>
) : (
<FeatureStrategyMenuCards
projectId={projectId}
featureId={featureId}
environmentId={environmentId}
filter={filter}
setFilter={setFilter}
onAddReleasePlan={(template) => {
setSelectedTemplate(template);
addReleasePlan(template);
}}
onReviewReleasePlan={(template) => {
setSelectedTemplate(template);
setReleasePlanPreview(true);
}}
onClose={onClose}
/>
)}
</>
</Dialog>
{selectedTemplate && (
<>
<LegacyReleasePlanReviewDialog
open={addReleasePlanOpen}
setOpen={(open) => {
setAddReleasePlanOpen(open);
if (!open) {
setIsStrategyMenuDialogOpen(true);
}
}}
onConfirm={() => {
addReleasePlan(selectedTemplate);
}}
template={selectedTemplate}
projectId={projectId}
featureName={featureId}
environment={environmentId}
crProtected={crProtected}
/>
<ReleasePlanConfirmationDialog
template={selectedTemplate}
crProtected={crProtected}
open={addReleasePlanConfirmationOpen}
setOpen={setAddReleasePlanConfirmationOpen}
onConfirm={() => {
addReleasePlan(selectedTemplate, true);
}}
/>
</>
<ReleasePlanConfirmationDialog
template={selectedTemplate}
crProtected={crProtected}
open={addReleasePlanConfirmationOpen}
setOpen={setAddReleasePlanConfirmationOpen}
onConfirm={() => {
addReleasePlan(selectedTemplate, true);
}}
/>
)}
</StyledStrategyMenu>
);

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

@ -87,7 +87,6 @@ export type UiFlags = {
impactMetrics?: boolean;
plausibleMetrics?: boolean;
lifecycleGraphs?: boolean;
newStrategyModal?: boolean;
globalChangeRequestList?: boolean;
trafficBillingDisplay?: boolean;
milestoneProgression?: boolean;

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

@ -57,7 +57,6 @@ export type IFlagKey =
| 'etagByEnv'
| 'fetchMode'
| 'optimizeLifecycle'
| 'newStrategyModal'
| 'globalChangeRequestList'
| 'trafficBillingDisplay'
| 'milestoneProgression'
@ -265,10 +264,6 @@ const flags: IFlags = {
false,
),
},
newStrategyModal: parseEnvVarBoolean(
process.env.UNLEASH_EXPERIMENTAL_NEW_STRATEGY_MODAL,
false,
),
globalChangeRequestList: parseEnvVarBoolean(
process.env.UNLEASH_EXPERIMENTAL_GLOBAL_CHANGE_REQUEST_LIST,
false,

1
src/server-dev.ts
View File

@ -52,7 +52,6 @@ process.nextTick(async () => {
customMetrics: true,
impactMetrics: true,
lifecycleGraphs: true,
newStrategyModal: true,
globalChangeRequestList: true,
trafficBillingDisplay: true,
milestoneProgression: true,