From 8d045878af8989ea6141afad3c79ae8d7ee5a0e1 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Nuno=20G=C3=B3is?= <github@nunogois.com>
Date: Thu, 16 Nov 2023 11:37:59 +0000
Subject: [PATCH] fix: take into account project segments permission in form

---
 frontend/src/component/segments/SegmentEmpty.tsx     | 12 ++++++++++--
 frontend/src/component/segments/SegmentForm.tsx      |  1 +
 .../src/component/segments/SegmentFormStepTwo.tsx    | 10 ++++++++--
 3 files changed, 19 insertions(+), 4 deletions(-)

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.
             </StyledParagraph>
             <ConditionallyRender
-                condition={hasAccess(CREATE_SEGMENT)}
+                condition={hasAccess(
+                    [CREATE_SEGMENT, UPDATE_PROJECT_SEGMENT],
+                    projectId,
+                )}
                 show={
                     <StyledLink to='/segments/create'>
                         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<ISegmentProps> = ({
                     condition={currentStep === 2}
                     show={
                         <SegmentFormStepTwo
+                            project={project}
                             constraints={constraints}
                             setConstraints={setConstraints}
                             setCurrentStep={setCurrentStep}
diff --git a/frontend/src/component/segments/SegmentFormStepTwo.tsx b/frontend/src/component/segments/SegmentFormStepTwo.tsx
index fa130a42221a..95064904813c 100644
--- a/frontend/src/component/segments/SegmentFormStepTwo.tsx
+++ b/frontend/src/component/segments/SegmentFormStepTwo.tsx
@@ -8,6 +8,7 @@ import { CreateUnleashContext } from 'component/context/CreateUnleashContext/Cre
 import {
     CREATE_CONTEXT_FIELD,
     CREATE_SEGMENT,
+    UPDATE_PROJECT_SEGMENT,
     UPDATE_SEGMENT,
 } from 'component/providers/AccessProvider/permissions';
 import useUnleashContext from 'hooks/api/getters/useUnleashContext/useUnleashContext';
@@ -32,6 +33,7 @@ import { useSegmentLimits } from 'hooks/api/getters/useSegmentLimits/useSegmentL
 import { GO_BACK } from 'constants/navigate';
 
 interface ISegmentFormPartTwoProps {
+    project?: string;
     constraints: IConstraint[];
     setConstraints: React.Dispatch<React.SetStateAction<IConstraint[]>>;
     setCurrentStep: React.Dispatch<React.SetStateAction<SegmentFormStep>>;
@@ -101,6 +103,7 @@ const StyledCancelButton = styled(Button)(({ theme }) => ({
 
 export const SegmentFormStepTwo: React.FC<ISegmentFormPartTwoProps> = ({
     children,
+    project,
     constraints,
     setConstraints,
     setCurrentStep,
@@ -112,7 +115,10 @@ export const SegmentFormStepTwo: React.FC<ISegmentFormPartTwoProps> = ({
     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<ISegmentFormPartTwoProps> = ({
                         ref={constraintsAccordionListRef}
                         constraints={constraints}
                         setConstraints={
-                            hasAccess(modePermission)
+                            hasAccess(modePermission, project)
                                 ? setConstraints
                                 : undefined
                         }