diff --git a/src/features/surveys/components/surveyForm/OptionsQuestion.tsx b/src/features/surveys/components/surveyForm/OptionsQuestion.tsx index c36a161cde..549ba1105b 100644 --- a/src/features/surveys/components/surveyForm/OptionsQuestion.tsx +++ b/src/features/surveys/components/surveyForm/OptionsQuestion.tsx @@ -20,7 +20,16 @@ const OptionsQuestion: FC<{ element: ZetkinSurveyOptionsQuestionElement }> = ({ }) => { return ( - + {element.question.question} {element.question.response_config.widget_type === 'checkbox' && ( diff --git a/src/features/surveys/components/surveyForm/TextQuestion.tsx b/src/features/surveys/components/surveyForm/TextQuestion.tsx index 7e305702bb..ea19646066 100644 --- a/src/features/surveys/components/surveyForm/TextQuestion.tsx +++ b/src/features/surveys/components/surveyForm/TextQuestion.tsx @@ -6,11 +6,21 @@ const OptionsQuestion: FC<{ element: ZetkinSurveyTextQuestionElement }> = ({ element, }) => { return ( - - + + {element.question.question} ( 'When you submit this survey, the information you provide will be stored and processed in Zetkin by {organization} in order to organize activism and in accordance with the Zetkin privacy policy.' diff --git a/src/pages/o/[orgId]/surveys/[surveyId]/index.tsx b/src/pages/o/[orgId]/surveys/[surveyId]/index.tsx index 9120c5f617..bd76fe3e02 100644 --- a/src/pages/o/[orgId]/surveys/[surveyId]/index.tsx +++ b/src/pages/o/[orgId]/surveys/[surveyId]/index.tsx @@ -22,12 +22,15 @@ import ZUIAvatar from 'zui/ZUIAvatar'; import { FC, useState } from 'react'; import { + Container, FormControlLabel, + FormControlLabelProps, Link, Radio, RadioGroup, TextField, Typography, + useRadioGroup, } from '@mui/material'; import { Msg, useMessages } from 'core/i18n'; @@ -163,6 +166,31 @@ type PageProps = { type FormStatus = 'editing' | 'invalid' | 'error' | 'submitted'; type SignatureOption = 'authenticated' | 'email' | 'anonymous'; +function RadioFormControlLabel(props: FormControlLabelProps) { + const radioGroup = useRadioGroup(); + + let checked = false; + + if (radioGroup) { + checked = radioGroup.value === props.value; + } + + if (checked) { + return ( + + ); + } + + return ; +} + const Page: FC = ({ orgId, status, survey }) => { const messages = useMessages(messageIds); @@ -177,7 +205,7 @@ const Page: FC = ({ orgId, status, survey }) => { const currentUser = useCurrentUser(); return ( - <> +

{survey.title}

{status === 'error' && } @@ -211,7 +239,15 @@ const Page: FC = ({ orgId, status, survey }) => { )} ))} - + @@ -220,7 +256,7 @@ const Page: FC = ({ orgId, status, survey }) => { onChange={(e) => handleRadioChange(e.target.value as SignatureOption)} value={selectedOption} > - } label={ @@ -236,7 +272,7 @@ const Page: FC = ({ orgId, status, survey }) => { value="authenticated" /> - } label={
@@ -254,8 +290,9 @@ const Page: FC = ({ orgId, status, survey }) => { } value="email" /> + {survey.signature === 'allow_anonymous' && ( - } label={ @@ -273,13 +310,13 @@ const Page: FC = ({ orgId, status, survey }) => { label={} name="privacy.approval" /> - + - + = ({ orgId, status, survey }) => { - + ); };