mirror of
https://github.com/Unleash/unleash.git
synced 2025-07-26 13:48:33 +02:00
feat: view diff in edit segment CR (#8874)
This commit is contained in:
parent
aeada68632
commit
0d72cfbba8
@ -1,5 +1,5 @@
|
||||
import type React from 'react';
|
||||
import type { VFC, FC, ReactNode } from 'react';
|
||||
import type { FC, ReactNode } from 'react';
|
||||
import { Box, styled, Typography } from '@mui/material';
|
||||
import type {
|
||||
ChangeRequestState,
|
||||
@ -52,12 +52,15 @@ const SegmentContainer = styled(Box, {
|
||||
borderRadius: `0 0 ${theme.shape.borderRadiusLarge}px ${theme.shape.borderRadiusLarge}px`,
|
||||
}));
|
||||
|
||||
export const SegmentChangeDetails: VFC<{
|
||||
export const SegmentChangeDetails: FC<{
|
||||
actions?: ReactNode;
|
||||
change: IChangeRequestUpdateSegment | IChangeRequestDeleteSegment;
|
||||
changeRequestState: ChangeRequestState;
|
||||
}> = ({ actions, change, changeRequestState }) => {
|
||||
const { segment: currentSegment } = useSegment(change.payload.id);
|
||||
const snapshotSegment = change.payload.snapshot;
|
||||
const referenceSegment =
|
||||
changeRequestState === 'Applied' ? snapshotSegment : currentSegment;
|
||||
|
||||
return (
|
||||
<SegmentContainer conflict={change.conflict}>
|
||||
@ -97,7 +100,7 @@ export const SegmentChangeDetails: VFC<{
|
||||
<SegmentTooltipLink change={change}>
|
||||
<SegmentDiff
|
||||
change={change}
|
||||
currentSegment={currentSegment}
|
||||
currentSegment={referenceSegment}
|
||||
/>
|
||||
</SegmentTooltipLink>
|
||||
</ChangeItemInfo>
|
||||
|
@ -35,7 +35,7 @@ export const SegmentDiff: FC<{
|
||||
<EventDiff
|
||||
entry={{
|
||||
preData: omit(currentSegment, ['createdAt', 'createdBy']),
|
||||
data: changeRequestSegment,
|
||||
data: omit(changeRequestSegment, ['snapshot']),
|
||||
}}
|
||||
/>
|
||||
</StyledCodeSection>
|
||||
@ -56,9 +56,15 @@ const StyledContainer: FC<{ children?: React.ReactNode }> = styled('div')(
|
||||
}),
|
||||
);
|
||||
|
||||
const ViewDiff = styled('span')(({ theme }) => ({
|
||||
color: theme.palette.primary.main,
|
||||
marginLeft: theme.spacing(1),
|
||||
}));
|
||||
|
||||
const Truncated = styled('div')(() => ({
|
||||
...textTruncated,
|
||||
maxWidth: 500,
|
||||
display: 'flex',
|
||||
}));
|
||||
|
||||
export const SegmentTooltipLink: FC<IStrategyTooltipLinkProps> = ({
|
||||
@ -67,6 +73,10 @@ export const SegmentTooltipLink: FC<IStrategyTooltipLinkProps> = ({
|
||||
}) => (
|
||||
<StyledContainer>
|
||||
<Truncated>
|
||||
<NameWithChangeInfo
|
||||
previousName={change.name}
|
||||
newName={change.payload.name}
|
||||
/>
|
||||
<TooltipLink
|
||||
tooltip={children}
|
||||
tooltipProps={{
|
||||
@ -74,10 +84,7 @@ export const SegmentTooltipLink: FC<IStrategyTooltipLinkProps> = ({
|
||||
maxHeight: 600,
|
||||
}}
|
||||
>
|
||||
<NameWithChangeInfo
|
||||
previousName={change.name}
|
||||
newName={change.payload.name}
|
||||
/>
|
||||
<ViewDiff>View Diff</ViewDiff>
|
||||
</TooltipLink>
|
||||
</Truncated>
|
||||
</StyledContainer>
|
||||
|
@ -196,6 +196,7 @@ export interface IChangeRequestDeleteSegment {
|
||||
payload: {
|
||||
id: number;
|
||||
name: string;
|
||||
snapshot?: ISegment;
|
||||
};
|
||||
}
|
||||
|
||||
|
Loading…
Reference in New Issue
Block a user