Fix/malwsp values as string type mismatch issue (#801)

* MALWSP: fix values as strings issue - define MeasurementEditorActionType * MALWSP: fix values as strings issue - fix 'value as string' issue; void unhandled promisses * MALWSP: fix values as strings issue - fix eslint warnings * MALWSP: fix values as strings issue - convert values to numbers * MALWSP: fix values as strings issue - clear edited on save * MALWSP: fix values as strings issue - adjust count progress * MALWSP: fix values as strings issue - adjust 'disabled' and clear 'edited' while changing child
CodersCrew · Oct 1, 2024 · c44ce7f · c44ce7f
1 parent e336212
commit c44ce7f
Show file tree

Hide file tree

Showing 12 changed files with 123 additions and 54 deletions.
diff --git a/client/src/operations/mutations/Results/updateAssessmentResult.tsx b/client/src/operations/mutations/Results/updateAssessmentResult.tsx
@@ -1,5 +1,5 @@
 import { gql, useMutation } from '@apollo/client';
-import { AssessmentResult } from '../../../graphql/types';
+import { AssessmentResult } from '@app/graphql/types';
 
 export interface Test {
     title: string;
@@ -80,7 +80,7 @@ export function useUpdateAssessmentResult() {
                 variables: { result },
             });
         },
-        isUpdateending: loading,
+        isUpdatePending: loading,
         data,
         error,
     };

diff --git a/client/src/pages/InstructorAddResultsPage/ChildListHeader.tsx b/client/src/pages/InstructorAddResultsPage/ChildListHeader.tsx
@@ -3,6 +3,7 @@ import { createStyles, Grid, makeStyles, MenuItem, TextField, Theme } from '@mat
 
 import { Assessment } from '@app/graphql/types';
 import { SearchChildField } from '@app/components/SearchChildField';
+import { MeasurementEditorActionType } from '@app/pages/InstructorResultCreatorPage/InstructorResultCreatorPage.types';
 
 interface Props {
     assessments: Assessment[];
@@ -55,7 +56,7 @@ export function ChildListHeader({
                         select
                         classes={{ root: classes.selectKindergarten }}
                         label={t('add-results-page.kindergarten-name')}
-                        onChange={({ target: { value } }) => onChange('kindergarten', value)}
+                        onChange={({ target: { value } }) => onChange(MeasurementEditorActionType.KINDERGARTEN, value)}
                         variant="outlined"
                         value={selectedKindergarten}
                         fullWidth

diff --git a/client/src/pages/InstructorAddResultsPage/GroupsModal/GroupsSubheader.tsx b/client/src/pages/InstructorAddResultsPage/GroupsModal/GroupsSubheader.tsx
@@ -4,9 +4,10 @@ import { Grid, Typography, Box } from '@material-ui/core';
 
 import PermIdentityIcon from '@material-ui/icons/PermIdentity';
 
-import { useIsDevice } from '../../../queries/useBreakpoints';
-import { Assessment, Group } from '../../../graphql/types';
-import { ButtonSecondary } from '../../../components/Button/ButtonSecondary';
+import { MeasurementEditorActionType } from '@app/pages/InstructorResultCreatorPage/InstructorResultCreatorPage.types';
+import { useIsDevice } from '@app/queries/useBreakpoints';
+import { Assessment, Group } from '@app/graphql/types';
+import { ButtonSecondary } from '@app/components/Button';
 
 import { openGroupsModal } from './GroupsModal';
 import { GroupsChip } from './GroupsChip';
@@ -22,7 +23,7 @@ export function GroupsSubheader(props: GroupsSubheaderProps) {
     const [groups, setGroups] = useState<Group[]>([]);
     const currentAssessment = props.assessments.find((a) => a._id === props.selectedAssessment);
     const toggleOrSelect = (groupId: string) => {
-        props.onChange('group', props.selectedGroup === groupId ? '' : groupId);
+        props.onChange(MeasurementEditorActionType.GROUP, props.selectedGroup === groupId ? '' : groupId);
     };
 
     const { t } = useTranslation();
@@ -85,7 +86,8 @@ export function GroupsSubheader(props: GroupsSubheaderProps) {
     );
 
     function onGroupClicked() {
-        openGroupsModal({
+        // eslint-disable-next-line no-void
+        void openGroupsModal({
             ...props,
             assessment: props.assessments.find((a) => a._id === props.selectedAssessment),
         });

diff --git a/client/src/pages/InstructorAddResultsPage/InstructorAddResultsPage.tsx b/client/src/pages/InstructorAddResultsPage/InstructorAddResultsPage.tsx
@@ -18,6 +18,7 @@ import {
     useUpdateAssessmentResult,
     UpdatedAssessmentInput,
 } from '@app/operations/mutations/Results/updateAssessmentResult';
+import { MeasurementEditorActionType } from '@app/pages/InstructorResultCreatorPage/InstructorResultCreatorPage.types';
 import { AssessmentSubheader } from './AssessmentSubheader';
 import { ChildListCompactContainer } from './ChildListCompactContainer';
 import { NoAssessmentView } from './NoAssessmentsView';
@@ -160,13 +161,13 @@ export default function InstructorAddResultsPage() {
             return;
         }
 
-        if (type === 'group') {
+        if (type === MeasurementEditorActionType.GROUP) {
             setSelectedGroup(value);
 
             return;
         }
 
-        if (type === 'kindergarten') {
+        if (type === MeasurementEditorActionType.KINDERGARTEN) {
             setSelectedGroup('');
             setSelectedKindergarten(value);
         }

diff --git a/client/src/pages/InstructorResultCreatorPage/ChildPicker/ChildPicker.tsx b/client/src/pages/InstructorResultCreatorPage/ChildPicker/ChildPicker.tsx
@@ -6,6 +6,7 @@ import { CustomContainer } from '@app/components/CustomContainer';
 import { SelectList } from '@app/components/SelectList';
 import { SearchChildField } from '@app/components/SearchChildField';
 import { Assessment, Child, Kindergarten, AssessmentResult } from '@app/graphql/types';
+import { MeasurementEditorActionType } from '@app/pages/InstructorResultCreatorPage/InstructorResultCreatorPage.types';
 import { countProgress } from '../countProgress';
 import { ChildItem } from './ChildItem';
 
@@ -63,7 +64,7 @@ export function ChildPicker({
                                         <div className={classes.helperLabel}>{k.address}</div>
                                     </MenuItem>
                                 ))}
-                                onSelect={(value) => onClick('kindergarten', value)}
+                                onSelect={(value) => onClick(MeasurementEditorActionType.KINDERGARTEN, value)}
                             />
                         </Grid>
 
@@ -80,7 +81,7 @@ export function ChildPicker({
                                         {t('add-result-page.last')}
                                     </MenuItem>,
                                 ]}
-                                onSelect={(value) => onClick('measurement', value)}
+                                onSelect={(value) => onClick(MeasurementEditorActionType.MEASUREMENT, value)}
                             />
                         </Grid>
 
@@ -93,7 +94,7 @@ export function ChildPicker({
                                         {g.label}
                                     </MenuItem>
                                 ))}
-                                onSelect={(value) => onClick('group', value)}
+                                onSelect={(value) => onClick(MeasurementEditorActionType.GROUP, value)}
                             />
                         </Grid>
 
@@ -116,7 +117,7 @@ export function ChildPicker({
                                     child={c}
                                     selected={c._id === selected}
                                     progress={countResultProgress(c._id)}
-                                    onClick={() => onClick('child', c._id)}
+                                    onClick={() => onClick(MeasurementEditorActionType.CHILD, c._id)}
                                 />
                             );
                         })}

diff --git a/client/src/pages/InstructorResultCreatorPage/EditorPanel.tsx b/client/src/pages/InstructorResultCreatorPage/EditorPanel.tsx
@@ -11,6 +11,7 @@ import {
 import { ButtonSecondary } from '@app/components/Button';
 import { ActionMenuButtonSecondary } from '@app/components/Button/ActionMenuButtonSecondary';
 import { AssessmentParam } from '@app/graphql/types';
+import { MeasurementEditorActionType } from '@app/pages/InstructorResultCreatorPage/InstructorResultCreatorPage.types';
 
 interface EditorPanelProps {
     isLoading: boolean;
@@ -96,7 +97,10 @@ export function EditorPanel({ resultCreator, measurement, onClick, isLoading }:
                 <Grid container justifyContent="flex-end">
                     <Grid item>
                         <Box mr={2}>
-                            <ButtonSecondary onClick={() => onClick('back-to-table', '')} variant="text">
+                            <ButtonSecondary
+                                onClick={() => onClick(MeasurementEditorActionType.BACK_TO_TABLE, '')}
+                                variant="text"
+                            >
                                 {t('add-result-page.back-to-table')}
                             </ButtonSecondary>
                         </Box>
@@ -107,19 +111,32 @@ export function EditorPanel({ resultCreator, measurement, onClick, isLoading }:
                             <ButtonSecondary
                                 variant="contained"
                                 disabled={isLoading}
-                                onClick={() => onClick('save-and-back-to-table', { ...localResult, note: localNote })}
+                                onClick={() =>
+                                    onClick(MeasurementEditorActionType.SAVE_AND_BACK_TO_TABLE, {
+                                        ...localResult,
+                                        note: localNote,
+                                    })
+                                }
                             >
                                 {t('add-result-page.save-and-back-to-table')}
                             </ButtonSecondary>
                         ) : (
                             <ActionMenuButtonSecondary
                                 isDisabled={isLoading}
                                 label={t('add-result-page.save-and-next')}
-                                onClick={() => onClick('save-and-next', { ...localResult, note: localNote })}
+                                onClick={() =>
+                                    onClick(MeasurementEditorActionType.SAVE_AND_NEXT, {
+                                        ...localResult,
+                                        note: localNote,
+                                    })
+                                }
                                 options={[
                                     <MenuItem
                                         onClick={() =>
-                                            onClick('save-and-back-to-table', { ...localResult, note: localNote })
+                                            onClick(MeasurementEditorActionType.SAVE_AND_BACK_TO_TABLE, {
+                                                ...localResult,
+                                                note: localNote,
+                                            })
                                         }
                                         key="add-result-page.save-and-back-to-table"
                                     >

diff --git a/client/src/pages/InstructorResultCreatorPage/InstructorResultCreatorPage.tsx b/client/src/pages/InstructorResultCreatorPage/InstructorResultCreatorPage.tsx
@@ -15,6 +15,7 @@ import {
     CreatedAssessmentInput,
     useCreateAssessmentResult,
 } from '@app/operations/mutations/Results/createAssessmentResult';
+import { MeasurementEditorActionType } from '@app/pages/InstructorResultCreatorPage/InstructorResultCreatorPage.types';
 import {
     ResultCreatorErrorReturnProps,
     ResultCreatorReturnProps,
@@ -41,7 +42,7 @@ interface HistoryResultCreatorParams {
 export default function InstructorResultCreatorPage() {
     const { assessmentId, kindergartenId, childId, groupId, measurement } = useParams<PageParams>();
     const { createAssessmentResult, isCreationPending } = useCreateAssessmentResult();
-    const { updateAssessmentResult, isUpdateending: isUpdatePending } = useUpdateAssessmentResult();
+    const { updateAssessmentResult, isUpdatePending } = useUpdateAssessmentResult();
 
     const history = useHistory<HistoryResultCreatorParams | undefined>();
 
@@ -86,62 +87,91 @@ export default function InstructorResultCreatorPage() {
             return;
         }
 
-        if (type === 'child') {
+        const convertValuesToNumber = (valuesToConvert: AssessmentValues) => {
+            return Object.fromEntries(
+                Object.entries(valuesToConvert).map(([key, val]) => (key === 'note' ? [key, val] : [key, Number(val)])),
+            );
+        };
+
+        if (type === MeasurementEditorActionType.CHILD) {
+            if (value !== resultCreator.selectedChild?._id) {
+                resultCreator.add();
+            }
+
             pushHistory(
-                `${measurement}/${resultCreator.selectedAssessment._id}/${resultCreator.selectedKindergarten?._id}/${resultCreator.selectedGroup}/${value}`,
+                `${measurement}/${resultCreator.selectedAssessment._id}/${resultCreator.selectedKindergarten?._id}/${
+                    resultCreator.selectedGroup
+                }/${value as string}`,
             );
         }
 
-        if (type === 'measurement') {
-            pushHistory(`${value}/${assessmentId}/${kindergartenId}/${resultCreator.selectedGroup}/${childId}`);
+        if (type === MeasurementEditorActionType.MEASUREMENT) {
+            pushHistory(
+                `${value as string}/${assessmentId}/${kindergartenId}/${resultCreator.selectedGroup}/${childId}`,
+            );
         }
 
-        if (type === 'kindergarten') {
+        if (type === MeasurementEditorActionType.KINDERGARTEN) {
             const currentSelectedKindergarten = resultCreator.selectedAssessment?.kindergartens.find(
                 (k) => k.kindergarten?._id === value,
             )?.kindergarten;
             const firstChildren = currentSelectedKindergarten?.children![0];
 
             if (firstChildren) {
-                pushHistory(`${measurement}/${resultCreator.selectedAssessment._id}/${value}/all/${firstChildren._id}`);
+                pushHistory(
+                    `${measurement}/${resultCreator.selectedAssessment._id}/${value as string}/all/${
+                        firstChildren._id
+                    }`,
+                );
             }
         }
 
-        if (type === 'group') {
-            pushHistory(`${measurement}/${assessmentId}/${kindergartenId}/${value}/${childId}`);
+        if (type === MeasurementEditorActionType.GROUP) {
+            pushHistory(`${measurement}/${assessmentId}/${kindergartenId}/${value as string}/${childId}`);
         }
 
-        if (type === 'back-to-table') {
+        if (type === MeasurementEditorActionType.BACK_TO_TABLE) {
+            resultCreator.add();
+
             redirectToResultTable();
         }
 
-        if (type === 'save-and-next') {
+        if (type === MeasurementEditorActionType.SAVE_AND_NEXT) {
+            const results = convertValuesToNumber(value as AssessmentValues);
+
             createOrUpdateResult(
-                { childId, assessmentId, kindergartenId, ...mapValuesToResult(value as AssessmentValues) },
+                { childId, assessmentId, kindergartenId, ...mapValuesToResult(results as AssessmentValues) },
                 resultCreator,
             );
 
             onSaveSnackbar(resultCreator);
 
+            resultCreator.add();
+
             redirectToNextChild();
         }
 
-        if (type === 'save-and-back-to-table') {
+        if (type === MeasurementEditorActionType.SAVE_AND_BACK_TO_TABLE) {
+            const results = convertValuesToNumber(value as AssessmentValues);
+
             createOrUpdateResult(
-                { childId, assessmentId, kindergartenId, ...mapValuesToResult(value as AssessmentValues) },
+                { childId, assessmentId, kindergartenId, ...mapValuesToResult(results as AssessmentValues) },
                 resultCreator,
             );
 
             onSaveSnackbar(resultCreator);
 
+            resultCreator.add();
+
             redirectToResultTable();
         }
     }
 
     function onSaveSnackbar(results: ResultCreatorReturnProps) {
         const { edited, selectedChild } = results;
 
-        openSnackbar({
+        // eslint-disable-next-line no-void
+        void openSnackbar({
             text: `${t('add-result-page.result-saved-snackbar-1')}${t(`add-result-page.${edited}`)}${t(
                 'add-result-page.result-saved-snackbar-2',
             )}${selectedChild.firstname} ${selectedChild?.lastname}`,
@@ -174,9 +204,11 @@ export default function InstructorResultCreatorPage() {
         const childResult = results.kindergartenResults.find((r) => r.childId === update.childId);
 
         if (childResult) {
-            updateAssessmentResult({ _id: childResult._id, ...update });
+            // eslint-disable-next-line no-void
+            void updateAssessmentResult({ _id: childResult._id, ...update });
         } else {
-            createAssessmentResult(update);
+            // eslint-disable-next-line no-void
+            void createAssessmentResult(update);
         }
     }
 
@@ -205,7 +237,9 @@ export default function InstructorResultCreatorPage() {
 
         if (foundNextChild) {
             pushHistory(
-                `${measurement}/${resultCreator.selectedAssessment._id}/${resultCreator.selectedKindergarten._id}/${resultCreator.selectedGroup}/${foundNextChild._id}`,
+                `${measurement}/${resultCreator.selectedAssessment._id}/${resultCreator.selectedKindergarten._id}/${
+                    resultCreator.selectedGroup || ''
+                }/${foundNextChild._id}`,
             );
         }
     }

diff --git a/client/src/pages/InstructorResultCreatorPage/InstructorResultCreatorPage.types.ts b/client/src/pages/InstructorResultCreatorPage/InstructorResultCreatorPage.types.ts
@@ -0,0 +1,10 @@
+// eslint-disable-next-line no-shadow
+export enum MeasurementEditorActionType {
+    BACK_TO_TABLE = 'back-to-table',
+    CHILD = 'child',
+    GROUP = 'group',
+    KINDERGARTEN = 'kindergarten',
+    MEASUREMENT = 'measurement',
+    SAVE_AND_BACK_TO_TABLE = 'save-and-back-to-table',
+    SAVE_AND_NEXT = 'save-and-next',
+}
diff --git a/client/src/pages/InstructorResultCreatorPage/MeasurementEditor/MeasurementEditor.tsx b/client/src/pages/InstructorResultCreatorPage/MeasurementEditor/MeasurementEditor.tsx
@@ -55,7 +55,7 @@ export function MeasurementEditor({
                 <MeasurementPoint
                     changeDate={getPendelumRunMeasurementDate()}
                     color={getInvertedColor(value.pendelumRun, pendelumRun)}
-                    disabled={resultCreator.edited === 'pendelumRun'}
+                    disabled={resultCreator.edited !== 'pendelumRun'}
                     isEmpty={resultCreator.values.pendelumRun === 0 && resultCreator.edited !== 'pendelumRun'}
                     label={t('add-result-page.dexterity')}
                     maxValue={pendelumRun.lowerLimitPoints}
@@ -73,7 +73,7 @@ export function MeasurementEditor({
                 <MeasurementPoint
                     changeDate={getJumpMeasurementDate()}
                     color={getColor(value.jump, jump)}
-                    disabled={resultCreator.edited === 'jump'}
+                    disabled={resultCreator.edited !== 'jump'}
                     isEmpty={resultCreator.values.jump === 0 && resultCreator.edited !== 'jump'}
                     label={t('add-result-page.power')}
                     maxValue={jump.upperLimitPoints}
@@ -91,7 +91,7 @@ export function MeasurementEditor({
                 <MeasurementPoint
                     changeDate={getThrowMeasurementDate()}
                     color={getColor(value.throw, _throw)}
-                    disabled={resultCreator.edited === 'throw'}
+                    disabled={resultCreator.edited !== 'throw'}
                     isEmpty={resultCreator.values.throw === 0 && resultCreator.edited !== 'throw'}
                     label={t('add-result-page.strength')}
                     maxValue={_throw.upperLimitPoints}
@@ -109,7 +109,7 @@ export function MeasurementEditor({
                 <MeasurementPoint
                     changeDate={getRunMeasurementDate()}
                     color={getInvertedColor(value.run, run)}
-                    disabled={resultCreator.edited === 'run'}
+                    disabled={resultCreator.edited !== 'run'}
                     isEmpty={resultCreator.values.run === 0 && resultCreator.edited !== 'run'}
                     label={t('add-result-page.velocity')}
                     maxValue={run.lowerLimitPoints}