diff --git a/frontend/src/component/changeRequest/ChangeRequest/Changes/Change/StrategyChange.tsx b/frontend/src/component/changeRequest/ChangeRequest/Changes/Change/StrategyChange.tsx
index 7afc902c4d..750d77888c 100644
--- a/frontend/src/component/changeRequest/ChangeRequest/Changes/Change/StrategyChange.tsx
+++ b/frontend/src/component/changeRequest/ChangeRequest/Changes/Change/StrategyChange.tsx
@@ -25,7 +25,8 @@ export const ChangeItemWrapper = styled(Box)({
const ChangeItemCreateEditWrapper = styled(Box)(({ theme }) => ({
display: 'grid',
- gridTemplateColumns: 'auto 40px',
+ gridTemplateColumns: 'auto auto',
+ justifyContent: 'space-between',
gap: theme.spacing(1),
alignItems: 'center',
marginBottom: theme.spacing(2),
diff --git a/frontend/src/component/changeRequest/ChangeRequest/NameWithChangeInfo/NameWithChangeInfo.test.tsx b/frontend/src/component/changeRequest/ChangeRequest/NameWithChangeInfo/NameWithChangeInfo.test.tsx
index 72e5d0e9ee..077454ed0b 100644
--- a/frontend/src/component/changeRequest/ChangeRequest/NameWithChangeInfo/NameWithChangeInfo.test.tsx
+++ b/frontend/src/component/changeRequest/ChangeRequest/NameWithChangeInfo/NameWithChangeInfo.test.tsx
@@ -17,7 +17,7 @@ test.each(['', undefined])(
).toBeNull();
// expect ins element with new strategy name
- await screen.findByText(newName, { selector: 'ins' });
+ await screen.findByText(newName, { selector: 'p' });
}
);
@@ -30,9 +30,7 @@ test.each(['', undefined])(
);
// expect no ins elements
- expect(
- screen.queryByText(newName || '', { selector: 'ins' })
- ).toBeNull();
+ expect(screen.queryByText(newName || '', { selector: 'p' })).toBeNull();
// expect del element with old strategy name
await screen.findByText(previousName, { selector: 'del' });
@@ -50,25 +48,13 @@ test('Should render the old name as deleted and the new name as inserted if the
await screen.findByText(previousName, { selector: 'del' });
// expect ins element with new strategy name
- await screen.findByText(newName, { selector: 'ins' });
-});
-
-test('Should render the name in a span if it has not changed', async () => {
- const name = 'name';
- render();
-
- // expect no del or ins elements
- expect(screen.queryByText(name, { selector: 'ins' })).toBeNull();
- expect(screen.queryByText(name, { selector: 'del' })).toBeNull();
-
- // expect span element with the strategy name
- await screen.findByText(name, { selector: 'span' });
+ await screen.findByText(newName, { selector: 'p' });
});
test('Should render nothing if there was no name and there is still no name', async () => {
render();
- expect(screen.queryByText('', { selector: 'ins' })).toBeNull();
+ expect(screen.queryByText('', { selector: 'p' })).toBeNull();
expect(screen.queryByText('', { selector: 'del' })).toBeNull();
expect(screen.queryByText('', { selector: 'span' })).toBeNull();
});
diff --git a/frontend/src/component/changeRequest/ChangeRequest/NameWithChangeInfo/NameWithChangeInfo.tsx b/frontend/src/component/changeRequest/ChangeRequest/NameWithChangeInfo/NameWithChangeInfo.tsx
index 65ce62722d..364add1e56 100644
--- a/frontend/src/component/changeRequest/ChangeRequest/NameWithChangeInfo/NameWithChangeInfo.tsx
+++ b/frontend/src/component/changeRequest/ChangeRequest/NameWithChangeInfo/NameWithChangeInfo.tsx
@@ -14,10 +14,6 @@ export const NameWithChangeInfo: FC<{
}> = ({ newName, previousName }) => {
const titleHasChanged = Boolean(previousName && previousName !== newName);
- const titleHasChangedOrBeenAdded = Boolean(
- titleHasChanged || (!previousName && newName)
- );
-
return (
<>
-
- {newName}
-
+ {newName}
}
/>