diff --git a/frontend/src/component/changeRequest/ChangeRequest/ChangeRequest.tsx b/frontend/src/component/changeRequest/ChangeRequest/ChangeRequest.tsx index 50fe6a2b06..4c30dce536 100644 --- a/frontend/src/component/changeRequest/ChangeRequest/ChangeRequest.tsx +++ b/frontend/src/component/changeRequest/ChangeRequest/ChangeRequest.tsx @@ -8,6 +8,7 @@ import { formatUnknownError } from 'utils/formatUnknownError'; import useToast from 'hooks/useToast'; import type { IChangeRequest } from '../changeRequest.types'; import { + Discard, StrategyAddedChange, StrategyDeletedChange, StrategyEditedChange, @@ -18,6 +19,7 @@ import { } from 'utils/strategyNames'; import { hasNameField } from '../changeRequest.types'; import { ConditionallyRender } from 'component/common/ConditionallyRender/ConditionallyRender'; +import { useChangeRequestOpen } from '../../../hooks/api/getters/useChangeRequestOpen/useChangeRequestOpen'; interface IChangeRequestProps { changeRequest: IChangeRequest; @@ -91,6 +93,10 @@ export const ChangeRequest: VFC = ({ } }; + const showDiscard = + !['Cancelled', 'Applied'].includes(changeRequest.state) && + changeRequest.features.flatMap(feature => feature.changes).length > 1; + return ( {changeRequest.features?.map(featureToggleChange => ( @@ -131,12 +137,34 @@ export const ChangeRequest: VFC = ({ {change.action === 'updateEnabled' && ( + } + /> + } /> )} {change.action === 'addStrategy' && ( + } + /> + } > = ({ )} {change.action === 'deleteStrategy' && ( + } + /> + } > {hasNameField(change.payload) && ( <> @@ -167,7 +206,18 @@ export const ChangeRequest: VFC = ({ )} {change.action === 'updateStrategy' && ( + } + /> + } > void; @@ -16,15 +16,15 @@ const ChangeItemInfo: FC = styled(Box)(({ theme }) => ({ gap: theme.spacing(1), })); -const Discard: FC = ({ onDiscard }) => ( +export const Discard: FC = ({ onDiscard }) => ( Discard ); -export const StrategyAddedChange: FC = ({ +export const StrategyAddedChange: FC<{ discard?: ReactNode }> = ({ children, - onDiscard, + discard, }) => { return ( @@ -36,14 +36,14 @@ export const StrategyAddedChange: FC = ({ {children} - + {discard} ); }; -export const StrategyEditedChange: FC = ({ +export const StrategyEditedChange: FC<{ discard?: ReactNode }> = ({ children, - onDiscard, + discard, }) => { return ( @@ -51,13 +51,13 @@ export const StrategyEditedChange: FC = ({ Editing strategy: {children} - + {discard} ); }; -export const StrategyDeletedChange: FC = ({ - onDiscard, +export const StrategyDeletedChange: FC<{ discard?: ReactNode }> = ({ + discard, children, }) => { return ( @@ -68,7 +68,7 @@ export const StrategyDeletedChange: FC = ({ {children} - + {discard} ); }; diff --git a/frontend/src/component/changeRequest/ChangeRequestOverview/ChangeRequestFeatureToggleChange/ToggleStatusChange.tsx b/frontend/src/component/changeRequest/ChangeRequestOverview/ChangeRequestFeatureToggleChange/ToggleStatusChange.tsx index 7a1bfa112c..35bd1d40a2 100644 --- a/frontend/src/component/changeRequest/ChangeRequestOverview/ChangeRequestFeatureToggleChange/ToggleStatusChange.tsx +++ b/frontend/src/component/changeRequest/ChangeRequestOverview/ChangeRequestFeatureToggleChange/ToggleStatusChange.tsx @@ -1,17 +1,16 @@ -import { VFC } from 'react'; -import { Link, Box } from '@mui/material'; -import { ConditionallyRender } from 'component/common/ConditionallyRender/ConditionallyRender'; +import { ReactNode, VFC } from 'react'; +import { Box } from '@mui/material'; import { Badge } from 'component/common/Badge/Badge'; import { ChangeItemWrapper } from './StrategyChange'; -interface IPlaygroundResultsTable { +interface IToggleStatusChange { enabled: boolean; - onDiscard?: () => void; + discard?: ReactNode; } -export const ToggleStatusChange: VFC = ({ +export const ToggleStatusChange: VFC = ({ enabled, - onDiscard, + discard, }) => { return ( @@ -21,14 +20,7 @@ export const ToggleStatusChange: VFC = ({ {enabled ? ' Enabled' : 'Disabled'} - - Discard - - } - /> + {discard} ); }; diff --git a/frontend/src/component/changeRequest/ChangeRequestOverview/ChangeRequestOverview.tsx b/frontend/src/component/changeRequest/ChangeRequestOverview/ChangeRequestOverview.tsx index 6fceea9ad8..1277e4b781 100644 --- a/frontend/src/component/changeRequest/ChangeRequestOverview/ChangeRequestOverview.tsx +++ b/frontend/src/component/changeRequest/ChangeRequestOverview/ChangeRequestOverview.tsx @@ -133,7 +133,10 @@ export const ChangeRequestOverview: FC = () => { Changes - + {changeRequest.comments?.map(comment => (