diff --git a/src/langs/en.json b/src/langs/en.json index 8b811062..35c41bdd 100644 --- a/src/langs/en.json +++ b/src/langs/en.json @@ -27,7 +27,8 @@ "KEY_LABEL": "Key", "VALUE_LABEL": "Value", "ANSWER_LABEL": "Answer" - } + }, + "HELPER_TEXT": "[Optional] If there is one correct answer, then you can include it here and you can automatically see who submitted a correct answer." }, "GENERAL": { "TITLE": "General" diff --git a/src/modules/answers/AnswersView.tsx b/src/modules/answers/AnswersView.tsx index 9601d401..4f723c63 100644 --- a/src/modules/answers/AnswersView.tsx +++ b/src/modules/answers/AnswersView.tsx @@ -24,7 +24,7 @@ const AnswersView: FC = () => { return ( - {t('TITLE')} + {t('TITLE')} diff --git a/src/modules/main/PlayerView.tsx b/src/modules/main/PlayerView.tsx index cc8b7b8b..29b09da8 100644 --- a/src/modules/main/PlayerView.tsx +++ b/src/modules/main/PlayerView.tsx @@ -1,4 +1,4 @@ -import { ChangeEvent, useMemo, useState } from 'react'; +import { ChangeEvent, useEffect, useMemo, useState } from 'react'; import { useTranslation } from 'react-i18next'; import { Box, Grid, TextField, Typography } from '@mui/material'; @@ -30,20 +30,23 @@ const PlayerView = (): JSX.Element => { const { data: appData } = hooks.useAppData(); const { mutate: postAppData } = mutations.usePostAppData(); - // use effect to get required app data - let savedAnswer = ''; + const [answer, setAnswer] = useState(''); + const [savedAnswer, setSavedAnswer] = useState(''); - if (appData) { - // only show the last answer - const savedAnswerObject = sortBy(appData, ['createdAt']) - .reverse() - .find(isAnswer) as AppData; - if (savedAnswerObject) { - savedAnswer = savedAnswerObject.data.answer ?? ''; + // use effect to get required app data + useEffect(() => { + if (appData) { + // only show the last answer + const savedAnswerObject = sortBy(appData, ['createdAt']) + .reverse() + .find(isAnswer) as AppData; + if (savedAnswerObject) { + const savedAnswerText = savedAnswerObject.data.answer ?? ''; + setAnswer(savedAnswerText); + setSavedAnswer(savedAnswerText); + } } - } - - const [answer, setAnswer] = useState(savedAnswer); + }, [appData]); const disableSave = useMemo(() => { // disable if there is no user (logged out or anonymous) diff --git a/src/modules/settings/AnswersSettings.tsx b/src/modules/settings/AnswersSettings.tsx index e0ca566b..ab98ffb3 100644 --- a/src/modules/settings/AnswersSettings.tsx +++ b/src/modules/settings/AnswersSettings.tsx @@ -25,6 +25,7 @@ const AnswerSettings: FC = ({ answer, onChange }) => { }} value={answerContent} onChange={(e) => onChange({ content: e.target.value })} + helperText={t('SETTINGS.ANSWER.HELPER_TEXT')} /> );