From 9bd69a852eaf2bd0f950c9ed6258eb65b5bd85bc Mon Sep 17 00:00:00 2001
From: Jaanus Sellin <sellinjaanus@gmail.com>
Date: Wed, 14 May 2025 09:40:33 +0300
Subject: [PATCH] feat: now only recents show segments that are not being used
 currently (#9983)

Now only recents show segments that are not being used currently
---
 .../FeatureStrategySegment/FeatureStrategySegment.tsx  |  5 ++++-
 .../RecentlyUsedSegments/RecentlyUsedSegments.tsx      | 10 ++++++++--
 2 files changed, 12 insertions(+), 3 deletions(-)

diff --git a/frontend/src/component/feature/FeatureStrategy/FeatureStrategySegment/FeatureStrategySegment.tsx b/frontend/src/component/feature/FeatureStrategy/FeatureStrategySegment/FeatureStrategySegment.tsx
index 362763093f..815a5f2050 100644
--- a/frontend/src/component/feature/FeatureStrategy/FeatureStrategySegment/FeatureStrategySegment.tsx
+++ b/frontend/src/component/feature/FeatureStrategy/FeatureStrategySegment/FeatureStrategySegment.tsx
@@ -106,7 +106,10 @@ export const FeatureStrategySegment = ({
                 segments={selectedSegments}
                 setSegments={setSelectedSegments}
             />
-            <RecentlyUsedSegments setSegments={setSelectedSegments} />
+            <RecentlyUsedSegments
+                setSegments={setSelectedSegments}
+                segments={selectedSegments}
+            />
         </>
     );
 };
diff --git a/frontend/src/component/feature/FeatureStrategy/FeatureStrategySegment/RecentlyUsedSegments/RecentlyUsedSegments.tsx b/frontend/src/component/feature/FeatureStrategy/FeatureStrategySegment/RecentlyUsedSegments/RecentlyUsedSegments.tsx
index 7b21473e56..c846b6be9d 100644
--- a/frontend/src/component/feature/FeatureStrategy/FeatureStrategySegment/RecentlyUsedSegments/RecentlyUsedSegments.tsx
+++ b/frontend/src/component/feature/FeatureStrategy/FeatureStrategySegment/RecentlyUsedSegments/RecentlyUsedSegments.tsx
@@ -7,6 +7,7 @@ import { useUiFlag } from 'hooks/useUiFlag';
 
 type RecentlyUsedSegmentsProps = {
     setSegments?: React.Dispatch<React.SetStateAction<ISegment[]>>;
+    segments?: ISegment[];
 };
 
 const StyledContainer = styled('div')(({ theme }) => ({
@@ -27,6 +28,7 @@ const StyledSegmentsContainer = styled('div')(({ theme }) => ({
 
 export const RecentlyUsedSegments = ({
     setSegments,
+    segments = [],
 }: RecentlyUsedSegmentsProps) => {
     const { items: recentlyUsedSegmentIds } = useRecentlyUsedSegments();
     const { segments: allSegments } = useSegments();
@@ -45,7 +47,11 @@ export const RecentlyUsedSegments = ({
         .map((id) => allSegments.find((segment) => segment.id === id))
         .filter((segment) => segment !== undefined) as ISegment[];
 
-    if (segmentObjects.length === 0) {
+    const filteredSegmentObjects = segmentObjects.filter(
+        (segment) => !segments.some((selected) => selected.id === segment.id),
+    );
+
+    if (filteredSegmentObjects.length === 0) {
         return null;
     }
 
@@ -53,7 +59,7 @@ export const RecentlyUsedSegments = ({
         <StyledContainer>
             <StyledHeader>Recently used segments</StyledHeader>
             <StyledSegmentsContainer>
-                {segmentObjects.map((segment) => (
+                {filteredSegmentObjects.map((segment) => (
                     <RecentlyUsedSegmentChip
                         key={segment.id}
                         segment={segment}