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