From 83a8cb816a6ffa0cc4302dc7b8a5e3ef30573ebd Mon Sep 17 00:00:00 2001
From: Tymoteusz Czech <2625371+Tymek@users.noreply.github.com>
Date: Thu, 20 Mar 2025 13:32:49 +0100
Subject: [PATCH] refactor: simplify new rollout variant

---
 .../RolloutVariants/RolloutVariants.tsx       | 24 +++++++------------
 1 file changed, 8 insertions(+), 16 deletions(-)

diff --git a/frontend/src/component/feature/FeatureView/FeatureOverview/FeatureOverviewEnvironments/FeatureOverviewEnvironment/EnvironmentAccordionBody/StrategyDraggableItem/StrategyItem/StrategyExecution/RolloutParameter/RolloutVariants/RolloutVariants.tsx b/frontend/src/component/feature/FeatureView/FeatureOverview/FeatureOverviewEnvironments/FeatureOverviewEnvironment/EnvironmentAccordionBody/StrategyDraggableItem/StrategyItem/StrategyExecution/RolloutParameter/RolloutVariants/RolloutVariants.tsx
index 2f57913745..b4389b48de 100644
--- a/frontend/src/component/feature/FeatureView/FeatureOverview/FeatureOverviewEnvironments/FeatureOverviewEnvironment/EnvironmentAccordionBody/StrategyDraggableItem/StrategyItem/StrategyExecution/RolloutParameter/RolloutVariants/RolloutVariants.tsx
+++ b/frontend/src/component/feature/FeatureView/FeatureOverview/FeatureOverviewEnvironments/FeatureOverviewEnvironment/EnvironmentAccordionBody/StrategyDraggableItem/StrategyItem/StrategyExecution/RolloutParameter/RolloutVariants/RolloutVariants.tsx
@@ -6,22 +6,14 @@ import type { StrategyVariantSchema } from 'openapi';
 import type { FC } from 'react';
 
 const StyledVariantChip = styled(StrategyEvaluationChip)<{ order: number }>(
-    ({ theme, order }) => {
-        const variantColor =
-            theme.palette.variants[order % theme.palette.variants.length];
-
-        return {
-            borderRadius: theme.shape.borderRadiusExtraLarge,
-            border: 'none',
-            color: theme.palette.text.primary,
-            background:
-                // TODO: adjust theme.palette.variants
-                theme.mode === 'dark'
-                    ? `hsl(from ${variantColor} h calc(s - 30) calc(l - 45))`
-                    : `hsl(from ${variantColor} h s calc(l + 5))`,
-            fontWeight: theme.typography.fontWeightRegular,
-        };
-    },
+    ({ theme, order }) => ({
+        borderRadius: theme.shape.borderRadiusExtraLarge,
+        border: 'none',
+        color: theme.palette.text.primary,
+        background:
+            theme.palette.variants[order % theme.palette.variants.length],
+        fontWeight: theme.typography.fontWeightRegular,
+    }),
 );
 
 const StyledPayloadHeader = styled('div')(({ theme }) => ({