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 }) => ({