feat: change request applied diff

Unleash · Nov 26, 2024 · 56d2d7f · 56d2d7f
1 parent 9d6e540
commit 56d2d7f
Show file tree

Hide file tree

Showing 3 changed files with 141 additions and 3 deletions.
diff --git a/frontend/src/component/changeRequest/ChangeRequest/Changes/Change/StrategyChange.test.tsx b/frontend/src/component/changeRequest/ChangeRequest/Changes/Change/StrategyChange.test.tsx
@@ -0,0 +1,130 @@
+import { render } from 'utils/testRenderer';
+import { StrategyChange } from './StrategyChange';
+import { testServerRoute, testServerSetup } from 'utils/testServer';
+import { screen } from '@testing-library/react';
+import userEvent from '@testing-library/user-event';
+
+const server = testServerSetup();
+
+const feature = 'my_feature';
+const projectId = 'default';
+const environmentName = 'production';
+const snapshotRollout = '70';
+const currentRollout = '80';
+const changeRequestRollout = '90';
+const strategy = {
+    name: 'flexibleRollout',
+    constraints: [],
+    variants: [],
+    parameters: {
+        groupId: 'child_1',
+        stickiness: 'default',
+    },
+    segments: [],
+    id: '8e25e369-6424-4dad-b17f-5d32cceb2fbe',
+    disabled: false,
+};
+
+testServerRoute(
+    server,
+    `/api/admin/projects/${projectId}/features/${feature}`,
+    {
+        environments: [
+            {
+                name: environmentName,
+                strategies: [
+                    {
+                        ...strategy,
+                        title: 'current_title',
+                        parameters: {
+                            ...strategy.parameters,
+                            rollout: currentRollout,
+                        },
+                    },
+                ],
+            },
+        ],
+    },
+);
+
+test('Editing strategy before change request is applied', async () => {
+    render(
+        <StrategyChange
+            featureName={feature}
+            environmentName={environmentName}
+            projectId={projectId}
+            changeRequestState='Approved'
+            change={{
+                action: 'updateStrategy',
+                id: 1,
+                payload: {
+                    ...strategy,
+                    title: 'change_request_title',
+                    parameters: {
+                        ...strategy.parameters,
+                        rollout: changeRequestRollout,
+                    },
+                    snapshot: {
+                        ...strategy,
+                        title: 'snapshot_title',
+                        parameters: {
+                            ...strategy.parameters,
+                            rollout: snapshotRollout,
+                        },
+                    },
+                },
+            }}
+        />,
+    );
+
+    await screen.findByText('Editing strategy:');
+    await screen.findByText('change_request_title');
+    await screen.findByText('current_title');
+    expect(screen.queryByText('snapshot_title')).not.toBeInTheDocument();
+
+    const viewDiff = await screen.findByText('View Diff');
+    userEvent.hover(viewDiff);
+    await screen.findByText(`- parameters.rollout: "${currentRollout}"`);
+    await screen.findByText(`+ parameters.rollout: "${changeRequestRollout}"`);
+});
+
+test('Editing strategy after change request is applied', async () => {
+    render(
+        <StrategyChange
+            featureName='my_feature'
+            environmentName='production'
+            projectId='default'
+            changeRequestState='Applied'
+            change={{
+                action: 'updateStrategy',
+                id: 1,
+                payload: {
+                    ...strategy,
+                    title: 'change_request_title',
+                    parameters: {
+                        ...strategy.parameters,
+                        rollout: changeRequestRollout,
+                    },
+                    snapshot: {
+                        ...strategy,
+                        title: 'snapshot_title',
+                        parameters: {
+                            ...strategy.parameters,
+                            rollout: snapshotRollout,
+                        },
+                    },
+                },
+            }}
+        />,
+    );
+
+    await screen.findByText('Editing strategy:');
+    await screen.findByText('change_request_title');
+    await screen.findByText('snapshot_title');
+    expect(screen.queryByText('current_title')).not.toBeInTheDocument();
+
+    const viewDiff = await screen.findByText('View Diff');
+    userEvent.hover(viewDiff);
+    await screen.findByText(`- parameters.rollout: "${snapshotRollout}"`);
+    await screen.findByText(`+ parameters.rollout: "${changeRequestRollout}"`);
+});
diff --git a/frontend/src/component/changeRequest/ChangeRequest/Changes/Change/StrategyChange.tsx b/frontend/src/component/changeRequest/ChangeRequest/Changes/Change/StrategyChange.tsx
@@ -271,11 +271,19 @@ export const StrategyChange: VFC<{
                             />
                             <StrategyTooltipLink
                                 change={change}
-                                previousTitle={currentStrategy?.title}
+                                previousTitle={
+                                    changeRequestState === 'Applied'
+                                        ? change.payload.snapshot?.title
+                                        : currentStrategy?.title
+                                }
                             >
                                 <StrategyDiff
                                     change={change}
-                                    currentStrategy={currentStrategy}
+                                    currentStrategy={
+                                        changeRequestState === 'Applied'
+                                            ? change.payload.snapshot
+                                            : currentStrategy
+                                    }
                                 />
                             </StrategyTooltipLink>
                         </ChangeItemInfo>

diff --git a/frontend/src/component/changeRequest/changeRequest.types.ts b/frontend/src/component/changeRequest/changeRequest.types.ts
@@ -241,7 +241,7 @@ export type ChangeRequestAddStrategy = Pick<
 
 export type ChangeRequestEditStrategy = ChangeRequestAddStrategy & {
     id: string;
-    snapshot?: Omit<IFeatureStrategy, 'title'> & { title?: string | null };
+    snapshot?: Omit<IFeatureStrategy, 'title'> & { title?: string };
 };
 
 type ChangeRequestDeleteStrategy = {