From a54fc7c6d2256eb00f67163bdd8d7a7085914933 Mon Sep 17 00:00:00 2001
From: Thomas Heartman <thomas@getunleash.io>
Date: Wed, 2 Jul 2025 13:11:29 +0200
Subject: [PATCH] flag archive flag change

---
 .../Changes/Change/ArchiveFeatureChange.tsx         | 13 +++++++++++--
 .../ChangeRequest/Changes/Change/FeatureChange.tsx  | 11 +++++++++--
 2 files changed, 20 insertions(+), 4 deletions(-)

diff --git a/frontend/src/component/changeRequest/ChangeRequest/Changes/Change/ArchiveFeatureChange.tsx b/frontend/src/component/changeRequest/ChangeRequest/Changes/Change/ArchiveFeatureChange.tsx
index f52d87d881..0cc814ef0d 100644
--- a/frontend/src/component/changeRequest/ChangeRequest/Changes/Change/ArchiveFeatureChange.tsx
+++ b/frontend/src/component/changeRequest/ChangeRequest/Changes/Change/ArchiveFeatureChange.tsx
@@ -1,6 +1,6 @@
 import type { FC, ReactNode } from 'react';
-import { styled } from '@mui/material';
 import { ChangeItemInfo, ChangeItemWrapper } from './Change.styles.tsx';
+import { styled } from '@mui/material';
 
 const ArchiveBox = styled('span')(({ theme }) => ({
     display: 'flex',
@@ -12,7 +12,7 @@ interface IArchiveFeatureChange {
     actions?: ReactNode;
 }
 
-export const ArchiveFeatureChange: FC<IArchiveFeatureChange> = ({
+export const LegacyArchiveFeatureChange: FC<IArchiveFeatureChange> = ({
     actions,
 }) => (
     <ChangeItemWrapper>
@@ -22,3 +22,12 @@ export const ArchiveFeatureChange: FC<IArchiveFeatureChange> = ({
         </ChangeItemInfo>
     </ChangeItemWrapper>
 );
+
+export const ArchiveFeatureChange: FC<IArchiveFeatureChange> = ({
+    actions,
+}) => (
+    <ChangeItemWrapper>
+        <ArchiveBox>Archiving flag</ArchiveBox>
+        {actions}
+    </ChangeItemWrapper>
+);
diff --git a/frontend/src/component/changeRequest/ChangeRequest/Changes/Change/FeatureChange.tsx b/frontend/src/component/changeRequest/ChangeRequest/Changes/Change/FeatureChange.tsx
index 31e023e9e5..a896a92360 100644
--- a/frontend/src/component/changeRequest/ChangeRequest/Changes/Change/FeatureChange.tsx
+++ b/frontend/src/component/changeRequest/ChangeRequest/Changes/Change/FeatureChange.tsx
@@ -11,7 +11,10 @@ import { ToggleStatusChange } from './ToggleStatusChange.tsx';
 import { LegacyStrategyChange } from './LegacyStrategyChange.tsx';
 import { VariantPatch } from './VariantPatch/VariantPatch.tsx';
 import { EnvironmentStrategyExecutionOrder } from './EnvironmentStrategyExecutionOrder/EnvironmentStrategyExecutionOrder.tsx';
-import { ArchiveFeatureChange } from './ArchiveFeatureChange.tsx';
+import {
+    ArchiveFeatureChange,
+    LegacyArchiveFeatureChange,
+} from './ArchiveFeatureChange.tsx';
 import { DependencyChange } from './DependencyChange.tsx';
 import { Link } from 'react-router-dom';
 import { LegacyReleasePlanChange } from './LegacyReleasePlanChange.tsx';
@@ -100,6 +103,10 @@ export const FeatureChange: FC<{
         ? ReleasePlanChange
         : LegacyReleasePlanChange;
 
+    const ArchiveFlagComponent = useDiffableChangeComponent
+        ? ArchiveFeatureChange
+        : LegacyArchiveFeatureChange;
+
     return (
         <StyledSingleChangeBox
             key={objectId(change)}
@@ -173,7 +180,7 @@ export const FeatureChange: FC<{
                     />
                 )}
                 {change.action === 'archiveFeature' && (
-                    <ArchiveFeatureChange actions={actions} />
+                    <ArchiveFlagComponent actions={actions} />
                 )}
 
                 {change.action === 'addStrategy' ||