diff --git a/frontend/src/component/segments/SegmentEmpty.tsx b/frontend/src/component/segments/SegmentEmpty.tsx index 4a166569839b..52c2468df315 100644 --- a/frontend/src/component/segments/SegmentEmpty.tsx +++ b/frontend/src/component/segments/SegmentEmpty.tsx @@ -1,9 +1,13 @@ import { styled, Typography } from '@mui/material'; import { Link } from 'react-router-dom'; -import { CREATE_SEGMENT } from 'component/providers/AccessProvider/permissions'; +import { + CREATE_SEGMENT, + UPDATE_PROJECT_SEGMENT, +} from 'component/providers/AccessProvider/permissions'; import { ConditionallyRender } from 'component/common/ConditionallyRender/ConditionallyRender'; import AccessContext from 'contexts/AccessContext'; import { useContext } from 'react'; +import { useOptionalPathParam } from 'hooks/useOptionalPathParam'; const StyledDiv = styled('div')(({ theme }) => ({ display: 'flex', @@ -35,6 +39,7 @@ const StyledLink = styled(Link)(({ theme }) => ({ })); export const SegmentEmpty = () => { + const projectId = useOptionalPathParam('projectId'); const { hasAccess } = useContext(AccessContext); return ( @@ -46,7 +51,10 @@ export const SegmentEmpty = () => { and can be reused. Create your first segment diff --git a/frontend/src/component/segments/SegmentForm.tsx b/frontend/src/component/segments/SegmentForm.tsx index c0924bd40007..2a71d137bd75 100644 --- a/frontend/src/component/segments/SegmentForm.tsx +++ b/frontend/src/component/segments/SegmentForm.tsx @@ -72,6 +72,7 @@ export const SegmentForm: React.FC = ({ condition={currentStep === 2} show={ >; setCurrentStep: React.Dispatch>; @@ -101,6 +103,7 @@ const StyledCancelButton = styled(Button)(({ theme }) => ({ export const SegmentFormStepTwo: React.FC = ({ children, + project, constraints, setConstraints, setCurrentStep, @@ -112,7 +115,10 @@ export const SegmentFormStepTwo: React.FC = ({ const { context = [] } = useUnleashContext(); const [open, setOpen] = useState(false); const segmentValuesCount = useSegmentValuesCount(constraints); - const modePermission = mode === 'create' ? CREATE_SEGMENT : UPDATE_SEGMENT; + const modePermission = + mode === 'create' + ? [CREATE_SEGMENT, UPDATE_PROJECT_SEGMENT] + : [UPDATE_SEGMENT, UPDATE_PROJECT_SEGMENT]; const { segmentValuesLimit } = useSegmentLimits(); const overSegmentValuesLimit: boolean = Boolean( @@ -197,7 +203,7 @@ export const SegmentFormStepTwo: React.FC = ({ ref={constraintsAccordionListRef} constraints={constraints} setConstraints={ - hasAccess(modePermission) + hasAccess(modePermission, project) ? setConstraints : undefined }