Bug fixes (#79)

* Switch language in test & result in real time * Add problems full name * Add case if no potential problems
exemory · May 19, 2024 · 715b631 · 715b631
1 parent 229d7e2
commit 715b631
Show file tree

Hide file tree

Showing 5 changed files with 94 additions and 13 deletions.
diff --git a/frontend/src/i18n/locales/en.json b/frontend/src/i18n/locales/en.json
@@ -84,7 +84,8 @@
   },
   "general-test-result": {
     "title": "Result of the Comprehensive PTSD evaluation",
-    "sub-title": "Potential problems:"
+    "sub-title": "Potential problems:",
+    "no-problems-found": "No potential problems found"
   },
   "results": {
     "title": "Completed evaluations",
@@ -108,5 +109,16 @@
   "header": {
     "completed-evaluations": "Completed evaluations",
     "log-out": "Log out"
+  },
+  "problems": {
+    "SS": "Suicidal syndrome",
+    "CTSD": "Chronic traumatic stress disorder",
+    "PTSD": "Post-traumatic stress disorder",
+    "MT": "Moral injury",
+    "PCS": "Post-concussion syndrome",
+    "PTS": "Post-traumatic symptom",
+    "A": "Anxiety",
+    "D": "Discomfort",
+    "N": "Norm"
   }
 }
diff --git a/frontend/src/i18n/locales/ru.json b/frontend/src/i18n/locales/ru.json
@@ -84,7 +84,8 @@
   },
   "general-test-result": {
     "title": "Результат комплексной оценки ПТСР",
-    "sub-title": "Возможные проблемы:"
+    "sub-title": "Возможные проблемы:",
+    "no-problems-found": "Потенциальных проблем не обнаружено"
   },
   "results": {
     "title": "Завершенные оценки",
@@ -108,5 +109,16 @@
   "header": {
     "completed-evaluations": "Завершенные оценки",
     "log-out": "Выйти"
+  },
+  "problems": {
+    "SS": "Суицидальный cиндром",
+    "CTSD": "Хроническое травматическое стрессовое расстройство",
+    "PTSD": "Посттравматическое cтрессовое расстройство",
+    "MT": "Моральная травма",
+    "PCS": "Постконтузионный cиндром",
+    "PTS": "Посттравматический симптом",
+    "A": "Тревога",
+    "D": "Дискомфорт",
+    "N": "Норма"
   }
 }
diff --git a/frontend/src/i18n/locales/uk.json b/frontend/src/i18n/locales/uk.json
@@ -84,7 +84,8 @@
   },
   "general-test-result": {
     "title": "Результат комплексної оцінки ПТСР",
-    "sub-title": "Можливі проблеми:"
+    "sub-title": "Можливі проблеми:",
+    "no-problems-found": "Потенційних проблем не виявлено"
   },
   "results": {
     "title": "Завершені оцінки",
@@ -108,5 +109,16 @@
   "header": {
     "completed-evaluations": "Завершені оцінки",
     "log-out": "Вийти"
+  },
+  "problems": {
+    "SS": "Суїцидальний синдром",
+    "CTSD": "Хронічний травматичний стресовий розлад",
+    "PTSD": "Посттравматичний стресовий розлад",
+    "MT": "Моральна травма",
+    "PCS": "Постконтузійний синдром",
+    "PTS": "Посттравматичний симптом",
+    "A": "Тривога",
+    "D": "Дискомфорт",
+    "N": "Норма"
   }
 }
diff --git a/frontend/src/pages/GeneralTest/GeneralTest.tsx b/frontend/src/pages/GeneralTest/GeneralTest.tsx
@@ -19,15 +19,26 @@ export const GeneralTest = () => {
   const [currentQuestion, setCurrentQuestion] = useState(0);
   const [totalQuestions, setTotalQuestions] = useState(0);
 
-  const { register, handleSubmit, watch } = useForm({});
+  const { register, handleSubmit, watch, reset } = useForm({});
   const watchedValues = watch();
 
   const navigate = useNavigate();
 
-  const [getQuestions, { loading: isQuestionsLoading, data: questionsData }] = useLazyQuery(GET_GENERAL_TEST_QUESTIONS);
+  const [getQuestions, { loading: isQuestionsLoading, data: questionsData }] = useLazyQuery(
+    GET_GENERAL_TEST_QUESTIONS,
+    {
+      fetchPolicy: 'no-cache',
+    }
+  );
   const [submitAnswers, { loading: isSubmitLoading }] = useMutation(SUBMIT_GENERAL_TEST_ANSWERS);
 
   useEffect(() => {
+    setCurrentQuestion(0);
+    setQuestions([]);
+    setEndCursor(undefined);
+    setHasNextPage(undefined);
+    reset();
+
     getQuestions({
       variables: {
         input: {
@@ -36,7 +47,7 @@ export const GeneralTest = () => {
         first: 1,
       },
     });
-  }, []);
+  }, [i18n.language]);
 
   useEffect(() => {
     if (questionsData) {

diff --git a/frontend/src/pages/GeneralTest/GeneralTestResult.tsx b/frontend/src/pages/GeneralTest/GeneralTestResult.tsx
@@ -1,7 +1,19 @@
 /* eslint-disable @typescript-eslint/no-explicit-any */
 import { GET_GENERAL_TEST_RESULT } from '@/graphql/queries';
 import { useLazyQuery } from '@apollo/client';
-import { Box, CircularProgress, List, ListItem, Tab, TabList, TabPanel, Tabs, Typography } from '@mui/joy';
+import {
+  Box,
+  Chip,
+  CircularProgress,
+  Divider,
+  List,
+  ListItem,
+  Tab,
+  TabList,
+  TabPanel,
+  Tabs,
+  Typography,
+} from '@mui/joy';
 import { tabClasses } from '@mui/joy/Tab';
 import { useEffect, useState } from 'react';
 import { useTranslation } from 'react-i18next';
@@ -22,7 +34,9 @@ export const GeneralTestResult = () => {
   const [index, setIndex] = useState(0);
 
   const { id } = useParams();
-  const [getResult, { loading: isResultLoading }] = useLazyQuery(GET_GENERAL_TEST_RESULT);
+  const [getResult, { loading: isResultLoading }] = useLazyQuery(GET_GENERAL_TEST_RESULT, {
+    fetchPolicy: 'no-cache',
+  });
 
   useEffect(() => {
     getResult({
@@ -35,7 +49,7 @@ export const GeneralTestResult = () => {
     }).then((result) => {
       setResult(result.data?.generalTestResult?.result);
     });
-  }, [id]);
+  }, [id, i18n.language]);
 
   if (isResultLoading) {
     return (
@@ -45,15 +59,35 @@ export const GeneralTestResult = () => {
     );
   }
 
+  if (result?.potentialProblems.length === 0) {
+    return (
+      <div className="flex flex-col mx-auto gap-4">
+        <Typography level="h2">{t('general-test-result.title')}</Typography>
+
+        <Divider />
+
+        <Typography level="title-lg">{t('general-test-result.no-problems-found')}</Typography>
+      </div>
+    );
+  }
+
   return (
     <>
       {result && (
-        <div className="flex flex-col mx-auto gap-4 max-w-[960px]">
+        <div className="flex flex-col mx-auto gap-4">
           <Typography level="h2">{t('general-test-result.title')}</Typography>
 
-          <Typography level="h4">
-            {t('general-test-result.sub-title')}{' '}
-            <span className="inline-flex gap-1">{result.potentialProblems.join(', ')}</span>
+          <Divider />
+
+          <Typography level="title-lg">
+            {t('general-test-result.sub-title')}
+            <div className="flex flex-wrap gap-1 mt-2">
+              {result.potentialProblems.map((problem: any) => (
+                <Chip key={problem} variant="soft" color="primary">
+                  {t(`problems.${problem}`)} ({problem})
+                </Chip>
+              ))}
+            </div>
           </Typography>
 
           <Box