Mirrors/unleash.unleash
1
0
Fork 0
mirror of https://github.com/Unleash/unleash.git synced 2025-07-17 13:46:47 +02:00
Code Issues Projects Releases Wiki Activity

include segment names on deleted segments too

Browse Source
This commit is contained in:
Thomas Heartman 2025-06-20 10:56:30 +02:00
parent 7200f5875f
commit 580a9e6a96
1 changed files with 55 additions and 48 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

103
frontend/src/component/changeRequest/ChangeRequest/Changes/Change/SegmentChange.tsx
View File

@ -7,6 +7,7 @@ import type {
} from '../../../changeRequest.types';
import { SegmentChangeDetails } from './SegmentChangeDetails.tsx';
import { ConflictWarning } from './ConflictWarning.tsx';
import { useSegment } from 'hooks/api/getters/useSegment/useSegment.ts';
interface ISegmentChangeProps {
segmentChange: ISegmentChange;
@ -20,61 +21,67 @@ export const SegmentChange: FC<ISegmentChangeProps> = ({
onNavigate,
actions,
changeRequestState,
}) => (
<Card
elevation={0}
sx={(theme) => ({
marginTop: theme.spacing(2),
marginBottom: theme.spacing(2),
overflow: 'hidden',
})}
>
<Box
}) => {
const { segment } = useSegment(segmentChange.payload.id);
return (
<Card
elevation={0}
sx={(theme) => ({
backgroundColor: theme.palette.neutral.light,
borderRadius: (theme) =>
`${theme.shape.borderRadiusLarge}px ${theme.shape.borderRadiusLarge}px 0 0`,
border: '1px solid',
borderColor: (theme) =>
segmentChange.conflict
? theme.palette.warning.border
: theme.palette.divider,
borderBottom: 'none',
marginTop: theme.spacing(2),
marginBottom: theme.spacing(2),
overflow: 'hidden',
})}
>
<ConflictWarning conflict={segmentChange.conflict} />
<Box
sx={{
display: 'flex',
pt: 2,
pb: 2,
px: 3,
}}
sx={(theme) => ({
backgroundColor: theme.palette.neutral.light,
borderRadius: (theme) =>
`${theme.shape.borderRadiusLarge}px ${theme.shape.borderRadiusLarge}px 0 0`,
border: '1px solid',
borderColor: (theme) =>
segmentChange.conflict
? theme.palette.warning.border
: theme.palette.divider,
borderBottom: 'none',
overflow: 'hidden',
})}
>
<Typography>Segment name: </Typography>
<Link
component={RouterLink}
to={`/segments/edit/${segmentChange.payload.id}`}
color='primary'
underline='hover'
<ConflictWarning conflict={segmentChange.conflict} />
<Box
sx={{
marginLeft: 1,
'& :hover': {
textDecoration: 'underline',
},
display: 'flex',
pt: 2,
pb: 2,
px: 3,
}}
onClick={onNavigate}
>
<strong>{segmentChange.payload.name}</strong>
</Link>
<Typography>Segment name:</Typography>
<Link
component={RouterLink}
to={`/segments/edit/${segmentChange.payload.id}`}
color='primary'
underline='hover'
sx={{
marginLeft: 1,
'& :hover': {
textDecoration: 'underline',
},
}}
onClick={onNavigate}
>
<strong>
{segmentChange.payload.name || segment?.name}
</strong>
</Link>
</Box>
</Box>
</Box>
<SegmentChangeDetails
change={segmentChange}
actions={actions}
changeRequestState={changeRequestState}
/>
</Card>
);
<SegmentChangeDetails
change={segmentChange}
actions={actions}
changeRequestState={changeRequestState}
/>
</Card>
);
};