diff --git a/frontend/src/features/admin-form/create/builder-and-design/BuilderAndDesignDrawer/EditFieldDrawer/edit-fieldtype/EditEmail/EditEmail.tsx b/frontend/src/features/admin-form/create/builder-and-design/BuilderAndDesignDrawer/EditFieldDrawer/edit-fieldtype/EditEmail/EditEmail.tsx index dd456dfb0a..dfa29143a8 100644 --- a/frontend/src/features/admin-form/create/builder-and-design/BuilderAndDesignDrawer/EditFieldDrawer/edit-fieldtype/EditEmail/EditEmail.tsx +++ b/frontend/src/features/admin-form/create/builder-and-design/BuilderAndDesignDrawer/EditFieldDrawer/edit-fieldtype/EditEmail/EditEmail.tsx @@ -139,6 +139,18 @@ export const EditEmail = ({ field }: EditEmailProps): JSX.Element => { } }, [isPdfResponseEnabled]) + // vfn is not supported on MRF + const isToggleVfnDisabled = useMemo( + () => form?.responseMode === FormResponseMode.Multirespondent, + [form], + ) + + // email confirmation is not supported on MRF + const isToggleEmailConfirmationDisabled = useMemo( + () => form?.responseMode === FormResponseMode.Multirespondent, + [form], + ) + return ( @@ -158,7 +170,7 @@ export const EditEmail = ({ field }: EditEmailProps): JSX.Element => { - + { )} - + { const { data: freeSmsCount } = useFreeSmsQuota() const isToggleVfnDisabled = useMemo(() => { + // vfn is not supported on MRF + if (form?.responseMode === FormResponseMode.Multirespondent) return true if (!freeSmsCount) return true return ( !field.isVerifiable && !hasTwilioCredentials && freeSmsCount.freeSmsCounts >= freeSmsCount.quota ) - }, [field.isVerifiable, freeSmsCount, hasTwilioCredentials]) + }, [ + field.isVerifiable, + freeSmsCount, + hasTwilioCredentials, + form?.responseMode, + ]) const smsCountsDisclosure = useDisclosure() diff --git a/frontend/src/features/admin-form/create/builder-and-design/BuilderAndDesignDrawer/FieldListDrawer/field-panels/BasicFieldPanel.tsx b/frontend/src/features/admin-form/create/builder-and-design/BuilderAndDesignDrawer/FieldListDrawer/field-panels/BasicFieldPanel.tsx index 0e9667fc1b..b3c75d58e0 100644 --- a/frontend/src/features/admin-form/create/builder-and-design/BuilderAndDesignDrawer/FieldListDrawer/field-panels/BasicFieldPanel.tsx +++ b/frontend/src/features/admin-form/create/builder-and-design/BuilderAndDesignDrawer/FieldListDrawer/field-panels/BasicFieldPanel.tsx @@ -1,6 +1,9 @@ import { Droppable } from 'react-beautiful-dnd' import { Box } from '@chakra-ui/react' +import { BasicField, FormResponseMode } from '~shared/types' + +import { useAdminForm } from '~features/admin-form/common/queries' import { BASIC_FIELDS_ORDERED, CREATE_FIELD_DROP_ID, @@ -13,20 +16,33 @@ import { FieldSection } from './FieldSection' export const BasicFieldPanel = () => { const { isLoading } = useCreateTabForm() + const { data: form } = useAdminForm() return ( {(provided) => ( - {BASIC_FIELDS_ORDERED.map((fieldType, index) => ( - - ))} + {BASIC_FIELDS_ORDERED.map((fieldType, index) => { + let shouldDisableField = isLoading + + // Attachment is not supported on MRF + if ( + fieldType === BasicField.Attachment && + form?.responseMode === FormResponseMode.Multirespondent + ) { + shouldDisableField = true + } + + return ( + + ) + })} {provided.placeholder} diff --git a/frontend/src/features/public-form/components/FormEndPage/FormEndPage.stories.tsx b/frontend/src/features/public-form/components/FormEndPage/FormEndPage.stories.tsx index e33db29525..c135214869 100644 --- a/frontend/src/features/public-form/components/FormEndPage/FormEndPage.stories.tsx +++ b/frontend/src/features/public-form/components/FormEndPage/FormEndPage.stories.tsx @@ -43,6 +43,8 @@ Default.args = { title: 'Thank you for your submission with some super long backstory about how important the submission is to them', paragraph: 'We will get back to you shortly.\n\nOnce again,\r\nthank you.', + paymentTitle: '', + paymentParagraph: '', }, submissionData: { id: 'mockSubmissionId', @@ -84,7 +86,7 @@ ColorThemeOrange.args = { export const FeedbackSubmitted = Template.bind({}) FeedbackSubmitted.args = { ...Default.args, - isFeedbackSubmitted: true, + isFeedbackSectionHidden: true, } export const Mobile = Template.bind({}) diff --git a/frontend/src/features/public-form/components/FormEndPage/FormEndPage.tsx b/frontend/src/features/public-form/components/FormEndPage/FormEndPage.tsx index 798dea40e8..c3eb632e64 100644 --- a/frontend/src/features/public-form/components/FormEndPage/FormEndPage.tsx +++ b/frontend/src/features/public-form/components/FormEndPage/FormEndPage.tsx @@ -13,13 +13,13 @@ export interface FormEndPageProps { endPage: FormDto['endPage'] submissionData: SubmissionData handleSubmitFeedback: (inputs: FeedbackFormInput) => void - isFeedbackSubmitted: boolean + isFeedbackSectionHidden: boolean colorTheme: FormColorTheme } export const FormEndPage = ({ handleSubmitFeedback, - isFeedbackSubmitted, + isFeedbackSectionHidden, colorTheme, ...endPageProps }: FormEndPageProps): JSX.Element => { @@ -40,7 +40,7 @@ export const FormEndPage = ({ {...endPageProps} colorTheme={colorTheme} /> - {isFeedbackSubmitted ? null : ( + {isFeedbackSectionHidden ? null : ( { /> ) } + + const isFeedbackHidden = + // Feedback is not supported on MRF + form.responseMode === FormResponseMode.Multirespondent || + isFeedbackSubmitted + return ( { submissionData={submissionData} formTitle={form.title} endPage={form.endPage} - isFeedbackSubmitted={isFeedbackSubmitted} + isFeedbackSectionHidden={isFeedbackHidden} handleSubmitFeedback={handleSubmitFeedback} />