diff --git a/apps/web/app/(app)/environments/[environmentId]/(actionsAndAttributes)/actions/components/ActionClassesTable.tsx b/apps/web/app/(app)/environments/[environmentId]/(actionsAndAttributes)/actions/components/ActionClassesTable.tsx index 1d9b23dd2c..fdbce1b7fd 100644 --- a/apps/web/app/(app)/environments/[environmentId]/(actionsAndAttributes)/actions/components/ActionClassesTable.tsx +++ b/apps/web/app/(app)/environments/[environmentId]/(actionsAndAttributes)/actions/components/ActionClassesTable.tsx @@ -84,6 +84,7 @@ export default function ActionClassesTable({ diff --git a/apps/web/app/(app)/environments/[environmentId]/(actionsAndAttributes)/actions/components/AddActionModal.tsx b/apps/web/app/(app)/environments/[environmentId]/(actionsAndAttributes)/actions/components/AddActionModal.tsx index 6120d69b53..c20707fa7a 100644 --- a/apps/web/app/(app)/environments/[environmentId]/(actionsAndAttributes)/actions/components/AddActionModal.tsx +++ b/apps/web/app/(app)/environments/[environmentId]/(actionsAndAttributes)/actions/components/AddActionModal.tsx @@ -24,7 +24,8 @@ interface AddNoCodeActionModalProps { environmentId: string; open: boolean; setOpen: (v: boolean) => void; - setActionClassArray?; + actionClasses: TActionClass[]; + setActionClasses?; isViewer: boolean; } @@ -45,7 +46,8 @@ export default function AddNoCodeActionModal({ environmentId, open, setOpen, - setActionClassArray, + actionClasses, + setActionClasses, isViewer, }: AddNoCodeActionModalProps) { const { register, control, handleSubmit, watch, reset } = useForm(); @@ -56,6 +58,7 @@ export default function AddNoCodeActionModal({ const [testUrl, setTestUrl] = useState(""); const [isMatch, setIsMatch] = useState(""); const [type, setType] = useState("noCode"); + const actionClassNames = actionClasses.map((actionClass) => actionClass.name); const filterNoCodeConfig = (noCodeConfig: TActionClassNoCodeConfig): TActionClassNoCodeConfig => { const { pageUrl, innerHtml, cssSelector } = noCodeConfig; @@ -92,7 +95,12 @@ export default function AddNoCodeActionModal({ throw new Error("You are not authorised to perform this action."); } setIsCreatingAction(true); - if (data.name === "") throw new Error("Please give your action a name"); + if (!data.name || data.name?.trim() === "") { + throw new Error("Please give your action a name"); + } + if (data.name && actionClassNames.includes(data.name)) { + throw new Error(`Action with name ${data.name} already exist`); + } if (type === "noCode") { if (!isPageUrl && !isCssSelector && !isInnerHtml) throw new Error("Please select at least one selector"); @@ -119,11 +127,8 @@ export default function AddNoCodeActionModal({ } const newActionClass: TActionClass = await createActionClassAction(updatedAction); - if (setActionClassArray) { - setActionClassArray((prevActionClassArray: TActionClass[]) => [ - ...prevActionClassArray, - newActionClass, - ]); + if (setActionClasses) { + setActionClasses((prevActionClasses: TActionClass[]) => [...prevActionClasses, newActionClass]); } reset(); resetAllStates(false); @@ -178,7 +183,7 @@ export default function AddNoCodeActionModal({
- +
diff --git a/apps/web/app/(app)/environments/[environmentId]/surveys/[surveyId]/edit/components/SettingsView.tsx b/apps/web/app/(app)/environments/[environmentId]/surveys/[surveyId]/edit/components/SettingsView.tsx index 4034608e55..e20421a305 100644 --- a/apps/web/app/(app)/environments/[environmentId]/surveys/[surveyId]/edit/components/SettingsView.tsx +++ b/apps/web/app/(app)/environments/[environmentId]/surveys/[surveyId]/edit/components/SettingsView.tsx @@ -47,7 +47,7 @@ export default function SettingsView({ localSurvey={localSurvey} setLocalSurvey={setLocalSurvey} environmentId={environment.id} - actionClasses={actionClasses} + propActionClasses={actionClasses} membershipRole={membershipRole} /> diff --git a/apps/web/app/(app)/environments/[environmentId]/surveys/[surveyId]/edit/components/WhenToSendCard.tsx b/apps/web/app/(app)/environments/[environmentId]/surveys/[surveyId]/edit/components/WhenToSendCard.tsx index 8fb937d517..89d0dc1f97 100644 --- a/apps/web/app/(app)/environments/[environmentId]/surveys/[surveyId]/edit/components/WhenToSendCard.tsx +++ b/apps/web/app/(app)/environments/[environmentId]/surveys/[surveyId]/edit/components/WhenToSendCard.tsx @@ -27,7 +27,7 @@ interface WhenToSendCardProps { localSurvey: TSurvey; setLocalSurvey: (survey: TSurvey) => void; environmentId: string; - actionClasses: TActionClass[]; + propActionClasses: TActionClass[]; membershipRole?: TMembershipRole; } @@ -35,13 +35,13 @@ export default function WhenToSendCard({ environmentId, localSurvey, setLocalSurvey, - actionClasses, + propActionClasses, membershipRole, }: WhenToSendCardProps) { const [open, setOpen] = useState(localSurvey.type === "web" ? true : false); const [isAddEventModalOpen, setAddEventModalOpen] = useState(false); const [activeIndex, setActiveIndex] = useState(null); - const [actionClassArray, setActionClassArray] = useState(actionClasses); + const [actionClasses, setActionClasses] = useState(propActionClasses); const { isViewer } = getAccessFlags(membershipRole); const autoClose = localSurvey.autoClose !== null; @@ -55,7 +55,7 @@ export default function WhenToSendCard({ const setTriggerEvent = useCallback( (idx: number, actionClassName: string) => { const updatedSurvey = { ...localSurvey }; - const newActionClass = actionClassArray!.find((actionClass) => { + const newActionClass = actionClasses!.find((actionClass) => { return actionClass.name === actionClassName; }); if (!newActionClass) { @@ -64,7 +64,7 @@ export default function WhenToSendCard({ updatedSurvey.triggers[idx] = newActionClass.name; setLocalSurvey(updatedSurvey); }, - [actionClassArray, localSurvey, setLocalSurvey] + [actionClasses, localSurvey, setLocalSurvey] ); const removeTriggerEvent = (idx: number) => { @@ -101,7 +101,7 @@ export default function WhenToSendCard({ useEffect(() => { if (isAddEventModalOpen) return; if (activeIndex !== null) { - const newActionClass = actionClassArray[actionClassArray.length - 1].name; + const newActionClass = actionClasses[actionClasses.length - 1].name; const currentActionClass = localSurvey.triggers[activeIndex]; if (newActionClass !== currentActionClass) { @@ -110,7 +110,7 @@ export default function WhenToSendCard({ setActiveIndex(null); } - }, [actionClassArray, activeIndex, setTriggerEvent, isAddEventModalOpen, localSurvey.triggers]); + }, [actionClasses, activeIndex, setTriggerEvent, isAddEventModalOpen, localSurvey.triggers]); useEffect(() => { if (localSurvey.type === "link") { @@ -200,7 +200,7 @@ export default function WhenToSendCard({ Add Action - {actionClassArray.map((actionClass) => ( + {actionClasses.map((actionClass) => (