diff --git a/frontend/src/component/feature/FeatureStrategy/FeatureStrategyForm/NewFeatureStrategyForm.tsx b/frontend/src/component/feature/FeatureStrategy/FeatureStrategyForm/NewFeatureStrategyForm.tsx index 7bb48146f5..ad019a5a98 100644 --- a/frontend/src/component/feature/FeatureStrategy/FeatureStrategyForm/NewFeatureStrategyForm.tsx +++ b/frontend/src/component/feature/FeatureStrategy/FeatureStrategyForm/NewFeatureStrategyForm.tsx @@ -146,7 +146,15 @@ const StyledHeaderBox = styled(Box)(({ theme }) => ({ paddingLeft: theme.spacing(6), paddingRight: theme.spacing(6), paddingTop: theme.spacing(2), - paddingBottom: theme.spacing(2), +})); + +const StyledAlertBox = styled(Box)(({ theme }) => ({ + paddingLeft: theme.spacing(6), + paddingRight: theme.spacing(6), + '& > *': { + marginTop: theme.spacing(2), + marginBottom: theme.spacing(2), + }, })); const StyledEnvironmentBox = styled(Box)(({ theme }) => ({ @@ -375,45 +383,48 @@ export const NewFeatureStrategyForm = ({ ) : null} - - } - /> - } - /> - + - This feature toggle is currently enabled in the{' '} - {environmentId} environment. Any - changes made here will be available to users as soon - as these changes are approved and applied. - - } + condition={hasChangeRequestInReviewForEnvironment} + show={alert} elseShow={ - - This feature toggle is currently enabled in the{' '} - {environmentId} environment. Any - changes made here will be available to users as soon - as you hit save. - + + } + /> } /> - + + + This feature toggle is currently enabled in the{' '} + {environmentId} environment. + Any changes made here will be available to users + as soon as these changes are approved and + applied. + + } + elseShow={ + + This feature toggle is currently enabled in the{' '} + {environmentId} environment. + Any changes made here will be available to users + as soon as you hit save. + + } + /> + +