Mirrors/unleash.unleash
1
0
Fork 0
mirror of https://github.com/Unleash/unleash.git synced 2025-08-18 13:48:58 +02:00
Code Issues Projects Releases Wiki Activity

update toggle status change

Browse Source
This commit is contained in:
Thomas Heartman 2025-07-03 10:01:33 +02:00
parent be4a413929
commit 5ff477ca1a
3 changed files with 37 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
frontend/src/component/changeRequest/ChangeRequest/Changes/Change/Change.styles.tsx
View File

@ -2,7 +2,7 @@ import { styled, Typography, type TypographyProps } from '@mui/material';
import type { FC, PropsWithChildren } from 'react';
export const Action: FC<TypographyProps> = ({ children, ...props }) => (
<Typography component='span' {...props}>
<Typography component='span' {...props} sx={{ outline: '2px solid red' }}>
{children}
</Typography>
);

11
frontend/src/component/changeRequest/ChangeRequest/Changes/Change/FeatureChange.tsx
View File

@ -7,7 +7,10 @@ import type {
import { objectId } from 'utils/objectId';
import { ConditionallyRender } from 'component/common/ConditionallyRender/ConditionallyRender';
import { Alert, Box, styled } from '@mui/material';
import { ToggleStatusChange } from './ToggleStatusChange.tsx';
import {
LegacyToggleStatusChange,
ToggleStatusChange,
} from './ToggleStatusChange.tsx';
import { LegacyStrategyChange } from './LegacyStrategyChange.tsx';
import { VariantPatch } from './VariantPatch/VariantPatch.tsx';
import { EnvironmentStrategyExecutionOrder } from './EnvironmentStrategyExecutionOrder/EnvironmentStrategyExecutionOrder.tsx';
@ -114,6 +117,10 @@ export const FeatureChange: FC<{
? DependencyChange
: LegacyDependencyChange;
const StatusChangeComponent = useDiffableChangeComponent
? ToggleStatusChange
: LegacyToggleStatusChange;
return (
<StyledSingleChangeBox
key={objectId(change)}
@ -181,7 +188,7 @@ export const FeatureChange: FC<{
/>
)}
{change.action === 'updateEnabled' && (
<ToggleStatusChange
<StatusChangeComponent
enabled={change.payload.enabled}
actions={actions}
/>

29
frontend/src/component/changeRequest/ChangeRequest/Changes/Change/ToggleStatusChange.tsx
View File

@ -1,12 +1,37 @@
import type { FC, ReactNode } from 'react';
import { Box } from '@mui/material';
import { Badge } from 'component/common/Badge/Badge';
import { ChangeItemInfo, ChangeItemWrapper } from './Change.styles';
import { ChangeItemWrapper as LegacyChangeItemWrapper } from './LegacyStrategyChange.tsx';
import { Action, ChangeItemInfo, ChangeItemWrapper } from './Change.styles';
interface IToggleStatusChange {
enabled: boolean;
actions?: ReactNode;
}
/**
* @deprecated use ToggleStatusChange instead; remove with flag crDiffView
*/
export const LegacyToggleStatusChange: FC<IToggleStatusChange> = ({
enabled,
actions,
}) => {
return (
<LegacyChangeItemWrapper>
<Box sx={{ display: 'flex', alignItems: 'center' }}>
New status
<Badge
sx={(theme) => ({ marginLeft: theme.spacing(1) })}
color={enabled ? 'success' : 'error'}
>
{enabled ? ' Enabled' : 'Disabled'}
</Badge>
</Box>
{actions}
</LegacyChangeItemWrapper>
);
};
export const ToggleStatusChange: FC<IToggleStatusChange> = ({
enabled,
actions,
@ -14,7 +39,7 @@ export const ToggleStatusChange: FC<IToggleStatusChange> = ({
return (
<ChangeItemWrapper>
<ChangeItemInfo>
New status
<Action>New status</Action>
<Badge color={enabled ? 'success' : 'error'}>
{enabled ? ' Enabled' : 'Disabled'}
</Badge>