diff --git a/frontend/src/features/public-form/components/FormEndPage/components/FeedbackBlock.tsx b/frontend/src/features/public-form/components/FormEndPage/components/FeedbackBlock.tsx index 0648a24370..a40b37536c 100644 --- a/frontend/src/features/public-form/components/FormEndPage/components/FeedbackBlock.tsx +++ b/frontend/src/features/public-form/components/FormEndPage/components/FeedbackBlock.tsx @@ -1,5 +1,6 @@ import { useMemo } from 'react' import { Controller, useForm } from 'react-hook-form' +import { useTranslation } from 'react-i18next' import { chakra, Flex, FormControl } from '@chakra-ui/react' import { FormColorTheme } from '~shared/types/form' @@ -27,6 +28,8 @@ export const FeedbackBlock = ({ onSubmit, colorTheme = FormColorTheme.Blue, }: FeedbackBlockProps): JSX.Element => { + const { t } = useTranslation() + const { control, register, @@ -39,8 +42,8 @@ export const FeedbackBlock = ({ const { isPaymentEnabled } = usePublicFormContext() const feedbackTitle = isPaymentEnabled - ? 'How was your experience making payment on this form?' - : 'How was your form filling experience today?' + ? t('features.publicForm.components.feedbackBlock.title.payment') + : t('features.publicForm.components.feedbackBlock.title.general') const colorScheme = useMemo(() => { return `theme-${colorTheme}` as const @@ -54,13 +57,19 @@ export const FeedbackBlock = ({ {feedbackTitle} ( diff --git a/frontend/src/features/public-form/components/FormFields/PublicFormSubmitButton.tsx b/frontend/src/features/public-form/components/FormFields/PublicFormSubmitButton.tsx index aa58bd8ce8..874c87d6e1 100644 --- a/frontend/src/features/public-form/components/FormFields/PublicFormSubmitButton.tsx +++ b/frontend/src/features/public-form/components/FormFields/PublicFormSubmitButton.tsx @@ -129,26 +129,18 @@ export const PublicFormSubmitButton = ({ isLoading={isSubmitting} isDisabled={!!preventSubmissionLogic || !onSubmit} loadingText={t( - 'features.publicForm.components.PublicFormSubmitButton.loadingText', + 'features.publicForm.components.submitButton.loadingText', )} onClick={isPaymentEnabled && !isPreview ? checkBeforeOpen : onSubmit} > - {t( - 'features.publicForm.components.PublicFormSubmitButton.visuallyHidden', - )} + {t('features.publicForm.components.submitButton.visuallyHidden')} {preventSubmissionLogic - ? t( - 'features.publicForm.components.PublicFormSubmitButton.preventSubmission', - ) + ? t('features.publicForm.components.submitButton.preventSubmission') : isPaymentEnabled - ? t( - 'features.publicForm.components.PublicFormSubmitButton.proceedToPay', - ) - : t( - 'features.publicForm.components.PublicFormSubmitButton.submitNow', - )} + ? t('features.publicForm.components.submitButton.proceedToPay') + : t('features.publicForm.components.submitButton.submitNow')} {preventSubmissionLogic ? ( diff --git a/frontend/src/i18n/locales/features/public-form/en-sg.ts b/frontend/src/i18n/locales/features/public-form/en-sg.ts index 868588f010..f6fa06dc1f 100644 --- a/frontend/src/i18n/locales/features/public-form/en-sg.ts +++ b/frontend/src/i18n/locales/features/public-form/en-sg.ts @@ -24,7 +24,7 @@ export const enSG: PublicForm = { 'Your verified fields have expired. Please verify those fields again.', }, components: { - PublicFormSubmitButton: { + submitButton: { loadingText: 'Submitting', visuallyHidden: 'End of form.', preventSubmission: 'Submission disabled', @@ -32,5 +32,17 @@ export const enSG: PublicForm = { submitNow: 'Submit now', }, table, + feedbackBlock: { + title: { + payment: 'How was your experience making payment on this form?', + general: 'How was your form filling experience today?', + }, + rating: { + label: 'Form feedback rating', + error: 'Please select a rating', + }, + commentPlaceholder: 'Tell us more about your experience', + submitButton: 'Submit feedback', + }, }, } diff --git a/frontend/src/i18n/locales/features/public-form/index.ts b/frontend/src/i18n/locales/features/public-form/index.ts index f76a555bab..d91bdb53a0 100644 --- a/frontend/src/i18n/locales/features/public-form/index.ts +++ b/frontend/src/i18n/locales/features/public-form/index.ts @@ -19,7 +19,7 @@ export interface PublicForm { verifiedFieldExpired: string } components: { - PublicFormSubmitButton: { + submitButton: { loadingText: string visuallyHidden: string preventSubmission: string @@ -27,5 +27,17 @@ export interface PublicForm { submitNow: string } table: Table + feedbackBlock: { + title: { + payment: string + general: string + } + rating: { + label: string + error: string + } + commentPlaceholder: string + submitButton: string + } } }