Skip to content

Commit 56695a8

Browse files
alexander-schefealexander-schefe
committed
fix: fixed trainee paper dashboard page spaghetti code. Why did it show papers and placeholder if no papers for every trainee in the db? trainees sould only be able to view their own papers
1 parent c1e8eff commit 56695a8

File tree

1 file changed

+84
-89
lines changed

1 file changed

+84
-89
lines changed

‎packages/frontend/src/pages/trainee-paper-page.tsx‎

Lines changed: 84 additions & 89 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@ import { Container, H1, Paragraph, Spacer, StyledIcon, Text } from '@lara/compon
22
import React from 'react'
33
import Loader from '../components/loader'
44
import { Template } from '../templates/template'
5-
import { PaperStatus, useTraineePageDataQuery } from '../graphql'
5+
import { PaperStatus, Trainee, useTraineePaperPageDataQuery } from '../graphql'
66
import { Box, Flex } from '@lara/components'
77
import strings from '../locales/localization'
88
import ProgressBar from '../components/progress-bar'
@@ -12,7 +12,7 @@ import { useNavigate } from 'react-router'
1212
import { mapStatusToProgess } from '../helper/paper-helper'
1313

1414
export const TraineePaperPage: React.FC = () => {
15-
const { loading, data } = useTraineePageDataQuery()
15+
const { loading, data } = useTraineePaperPageDataQuery()
1616
const navigate = useNavigate()
1717

1818
const navigateToPaperFeedbackPage = (paperId: string) => {
@@ -27,7 +27,7 @@ export const TraineePaperPage: React.FC = () => {
2727
)
2828
}
2929

30-
const { currentUser } = data
30+
const currentUser = data.currentUser as Trainee
3131
if (!currentUser) {
3232
return (
3333
<Template type="Main">
@@ -39,94 +39,89 @@ export const TraineePaperPage: React.FC = () => {
3939
return (
4040
<Template type="Main">
4141
{loading && <Loader />}
42-
{!loading &&
43-
data.trainees.map((trainee) => (
44-
<div key={trainee?.id}>
45-
{trainee?.papers && trainee?.papers?.length >= 1 ? (
46-
trainee?.papers.map((paper) =>
47-
paper?.traineeId == currentUser.id ? (
48-
<Spacer bottom="xl" key={paper?.id}>
49-
<Container overflow={'visible'} padding={'l'}>
50-
<Box width={1}>
51-
<H1 center>{strings.paper.dashboard.title + ' ' + paper?.client + ' - ' + paper?.subject}</H1>
52-
<Spacer bottom="xl">
53-
<Text size={'copy'}>
54-
{strings.paper.dashboard.traineeDiscription.a +
55-
paper?.client +
56-
strings.paper.dashboard.traineeDiscription.b}
57-
</Text>
58-
</Spacer>
59-
<Flex alignItems={'center'} width={'100%'}>
60-
<Box width={2 / 5}>
61-
<Flex flexDirection={'row'} alignItems={'center'}>
62-
{paper?.briefing.length ? (
63-
<StyledIcon name={'CheckMark'} size="24px" color={'successGreen'} />
64-
) : (
65-
<StyledIcon name={'X'} size="24px" color={'errorRed'} />
66-
)}
67-
<Spacer left="xs">
68-
<Text>{strings.paper.dashboard.briefing}</Text>
69-
</Spacer>
70-
</Flex>
71-
</Box>
72-
<Box width={3 / 5}>
73-
<Flex flexDirection={'row'} alignItems={'center'}>
74-
{paper?.status === PaperStatus.TraineeDone ? (
75-
<StyledIcon name={'CheckMark'} size="24px" color={'successGreen'} />
76-
) : (
77-
<StyledIcon name={'X'} size="24px" color={'errorRed'} />
78-
)}
79-
<Spacer left="xs">
80-
<Text>{strings.paper.dashboard.feedback}</Text>
81-
</Spacer>
82-
</Flex>
83-
</Box>
84-
</Flex>
85-
<Flex alignItems={'center'} width={'100%'}>
86-
<Box width={2 / 5}>
87-
<Flex flexDirection={'row'} alignItems={'center'}>
88-
<StyledIcon name={'X'} size="24px" color={'errorRed'} />
89-
<Spacer left="xs">
90-
<Text>{strings.paper.dashboard.conclusion}</Text>
91-
</Spacer>
92-
</Flex>
93-
</Box>
94-
<Box width={3 / 5}>
95-
<Flex flexDirection={'row'} alignItems={'center'}>
96-
<StyledIcon name={'X'} size="24px" color={'errorRed'} />
97-
<Spacer left="xs">
98-
<Text>{strings.paper.dashboard.pdfFeedback}</Text>
99-
</Spacer>
100-
</Flex>
101-
</Box>
102-
</Flex>
103-
</Box>
104-
<Spacer y="xl">
105-
<ProgressBar progress={mapStatusToProgess(paper.status)} color={'primaryDefault'} />
106-
</Spacer>
107-
{paper?.status === PaperStatus.InProgress ? (
108-
<Flex justifyContent={'flex-end'}>
109-
<PrimaryButton onClick={() => navigateToPaperFeedbackPage(paper.id)}>
110-
{paper?.feedback.length > 0 ? strings.edit : strings.start}
111-
</PrimaryButton>
112-
</Flex>
113-
) : null}
114-
</Container>
42+
{!loading && currentUser && currentUser.papers && currentUser.papers?.length >= 1 ? (
43+
currentUser?.papers.map((paper) =>
44+
paper?.traineeId == currentUser.id ? (
45+
<Spacer bottom="xl" key={paper?.id}>
46+
<Container overflow={'visible'} padding={'l'}>
47+
<Box width={1}>
48+
<H1 center>{strings.paper.dashboard.title + ' ' + paper?.client + ' - ' + paper?.subject}</H1>
49+
<Spacer bottom="xl">
50+
<Text size={'copy'}>
51+
{strings.paper.dashboard.traineeDiscription.a +
52+
paper?.client +
53+
strings.paper.dashboard.traineeDiscription.b}
54+
</Text>
11555
</Spacer>
116-
) : null
117-
)
118-
) : (
119-
<Flex alignItems={'center'} flexDirection={'column'}>
120-
<Box width={[1, 3 / 5]}>
121-
<H1 center>{strings.paper.emptyTrainee.headline}</H1>
122-
<Paragraph center>{strings.paper.emptyTrainee.description}</Paragraph>
123-
124-
<EmptyPaper />
56+
<Flex alignItems={'center'} width={'100%'}>
57+
<Box width={2 / 5}>
58+
<Flex flexDirection={'row'} alignItems={'center'}>
59+
{paper?.briefing.length ? (
60+
<StyledIcon name={'CheckMark'} size="24px" color={'successGreen'} />
61+
) : (
62+
<StyledIcon name={'X'} size="24px" color={'errorRed'} />
63+
)}
64+
<Spacer left="xs">
65+
<Text>{strings.paper.dashboard.briefing}</Text>
66+
</Spacer>
67+
</Flex>
68+
</Box>
69+
<Box width={3 / 5}>
70+
<Flex flexDirection={'row'} alignItems={'center'}>
71+
{paper?.status === PaperStatus.TraineeDone ? (
72+
<StyledIcon name={'CheckMark'} size="24px" color={'successGreen'} />
73+
) : (
74+
<StyledIcon name={'X'} size="24px" color={'errorRed'} />
75+
)}
76+
<Spacer left="xs">
77+
<Text>{strings.paper.dashboard.feedback}</Text>
78+
</Spacer>
79+
</Flex>
80+
</Box>
81+
</Flex>
82+
<Flex alignItems={'center'} width={'100%'}>
83+
<Box width={2 / 5}>
84+
<Flex flexDirection={'row'} alignItems={'center'}>
85+
<StyledIcon name={'X'} size="24px" color={'errorRed'} />
86+
<Spacer left="xs">
87+
<Text>{strings.paper.dashboard.conclusion}</Text>
88+
</Spacer>
89+
</Flex>
90+
</Box>
91+
<Box width={3 / 5}>
92+
<Flex flexDirection={'row'} alignItems={'center'}>
93+
<StyledIcon name={'X'} size="24px" color={'errorRed'} />
94+
<Spacer left="xs">
95+
<Text>{strings.paper.dashboard.pdfFeedback}</Text>
96+
</Spacer>
97+
</Flex>
98+
</Box>
99+
</Flex>
125100
</Box>
126-
</Flex>
127-
)}
128-
</div>
129-
))}
101+
<Spacer y="xl">
102+
<ProgressBar progress={mapStatusToProgess(paper.status)} color={'primaryDefault'} />
103+
</Spacer>
104+
{paper?.status === PaperStatus.InProgress ? (
105+
<Flex justifyContent={'flex-end'}>
106+
<PrimaryButton onClick={() => navigateToPaperFeedbackPage(paper.id)}>
107+
{paper?.feedback.length > 0 ? strings.edit : strings.start}
108+
</PrimaryButton>
109+
</Flex>
110+
) : null}
111+
</Container>
112+
</Spacer>
113+
) : null
114+
)
115+
) : (
116+
<Flex alignItems={'center'} flexDirection={'column'}>
117+
<Box width={[1, 3 / 5]}>
118+
<H1 center>{strings.paper.emptyTrainee.headline}</H1>
119+
<Paragraph center>{strings.paper.emptyTrainee.description}</Paragraph>
120+
121+
<EmptyPaper />
122+
</Box>
123+
</Flex>
124+
)}
130125
</Template>
131126
)
132127
}

0 commit comments

Comments
 (0)