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

feat: change requests, use new accordion list not legacy (#9825)

Browse Source 
This should be final piece where old accordion is used.


![image](https://github.com/user-attachments/assets/854dfab9-4b05-4a14-bb17-0de49705079d)
This commit is contained in:
Jaanus Sellin 2025-04-23 17:37:54 +03:00 committed by GitHub
parent 9977b3e0f8
commit 08c11664ce
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 42 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
frontend/src/component/changeRequest/ChangeRequest/Changes/Change/SegmentChangeDetails.tsx
View File

@ -1,5 +1,6 @@
import type React from 'react';
import type { FC, ReactNode } from 'react';
import { useRef } from 'react';
import { Box, styled, Typography } from '@mui/material';
import type {
ChangeRequestState,
@ -9,6 +10,12 @@ import type {
import { useSegment } from 'hooks/api/getters/useSegment/useSegment';
import { SegmentDiff, SegmentTooltipLink } from '../../SegmentTooltipLink';
import { ConstraintAccordionList } from 'component/common/LegacyConstraintAccordion/ConstraintAccordionList/ConstraintAccordionList';
import {
NewConstraintAccordionList,
useConstraintAccordionList,
} from 'component/common/NewConstraintAccordion/NewConstraintAccordionList/NewConstraintAccordionList';
import type { IConstraintAccordionListRef } from 'component/common/NewConstraintAccordion/NewConstraintAccordionList/NewConstraintAccordionList';
import { useUiFlag } from 'hooks/useUiFlag';
import { ChangeOverwriteWarning } from './ChangeOverwriteWarning/ChangeOverwriteWarning';
const ChangeItemCreateEditWrapper = styled(Box)(({ theme }) => ({
@ -65,6 +72,9 @@ export const SegmentChangeDetails: FC<{
: currentSegment?.name;
const referenceSegment =
changeRequestState === 'Applied' ? snapshotSegment : currentSegment;
const addEditStrategy = useUiFlag('addEditStrategy');
const constraintsRef = useRef<IConstraintAccordionListRef | null>(null);
const { state } = useConstraintAccordionList(undefined, constraintsRef);
return (
<SegmentContainer conflict={change.conflict}>
@ -113,10 +123,18 @@ export const SegmentChangeDetails: FC<{
</ChangeItemInfo>
<div>{actions}</div>
</ChangeItemCreateEditWrapper>
<ConstraintAccordionList
constraints={change.payload.constraints}
showLabel={false}
/>
{addEditStrategy ? (
<NewConstraintAccordionList
ref={constraintsRef}
constraints={change.payload.constraints}
state={state}
/>
) : (
<ConstraintAccordionList
constraints={change.payload.constraints}
showLabel={false}
/>
)}
</>
)}
</SegmentContainer>

30
frontend/src/component/common/NewConstraintAccordion/NewConstraintAccordionList/NewConstraintAccordionList.tsx
View File

@ -15,6 +15,7 @@ import { NewConstraintAccordion } from 'component/common/NewConstraintAccordion/
import { ConstraintsList } from 'component/common/ConstraintsList/ConstraintsList';
import { useUiFlag } from 'hooks/useUiFlag';
import { EditableConstraintWrapper } from 'component/feature/FeatureStrategy/FeatureStrategyConstraints/EditableConstraintWrapper';
import { ConstraintAccordionView } from 'component/common/NewConstraintAccordion/ConstraintAccordionView/ConstraintAccordionView';
export interface IConstraintAccordionListProps {
constraints: IConstraint[];
@ -150,16 +151,25 @@ export const NewConstraintAccordionList = forwardRef<
<ConstraintsList>
{constraints.map((constraint, index) =>
addEditStrategy ? (
<EditableConstraintWrapper
key={constraint[constraintId]}
constraint={constraint}
onCancel={onCancel.bind(null, index)}
onDelete={onRemove?.bind(null, index)}
onSave={onSave!.bind(null, index)}
onAutoSave={onAutoSave?.(
constraint[constraintId],
)}
/>
state.get(constraint)?.editing ? (
<EditableConstraintWrapper
key={constraint[constraintId]}
constraint={constraint}
onCancel={onCancel?.bind(null, index)}
onDelete={onRemove?.bind(null, index)}
onSave={onSave!.bind(null, index)}
onAutoSave={onAutoSave?.(
constraint[constraintId],
)}
/>
) : (
<ConstraintAccordionView
key={constraint[constraintId]}
constraint={constraint}
onEdit={onEdit?.bind(null, constraint)}
onDelete={onRemove?.bind(null, index)}
/>
)
) : (
<NewConstraintAccordion
key={constraint[constraintId]}