mirror of
https://github.com/Unleash/unleash.git
synced 2025-07-26 13:48:33 +02:00
feat: change requests, use new accordion list not legacy (#9825)
This should be final piece where old accordion is used. 
This commit is contained in:
parent
9977b3e0f8
commit
08c11664ce
@ -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>
|
||||
|
@ -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]}
|
||||
|
Loading…
Reference in New Issue
Block a user