diff --git a/assets/images/arrow-right-circle-icon-white.svg b/assets/images/arrow-right-circle-icon-white.svg new file mode 100644 index 000000000..325e7bf9e --- /dev/null +++ b/assets/images/arrow-right-circle-icon-white.svg @@ -0,0 +1,6 @@ + + + + + + diff --git a/assets/images/index.ts b/assets/images/index.ts index c34ae8570..7aae81044 100644 --- a/assets/images/index.ts +++ b/assets/images/index.ts @@ -1,6 +1,7 @@ import AddCircleIcon from './add-circle-icon.svg' import ArrowLeftCircleIconBlue from './arrow-left-circle-icon-blue.svg' import ArrowLeftCircleIconWhite from './arrow-left-circle-icon-white.svg' +import ArrowRightCircleIconWhite from './arrow-right-circle-icon-white.svg' import ArrowRightIcon from './arrow-right-icon.svg' import BannerGreen from './banner-green.png' import BannerRed from './banner-red.png' @@ -55,6 +56,7 @@ export { ArrowLeftCircleIconBlue, ArrowLeftCircleIconWhite, ArrowRightIcon, + ArrowRightCircleIconWhite, BannerGreen, BannerRed, BannerYellow, diff --git a/src/constants/data.ts b/src/constants/data.ts index 1740e99d0..c44a371bb 100644 --- a/src/constants/data.ts +++ b/src/constants/data.ts @@ -3,6 +3,7 @@ import { SvgProps } from 'react-native-svg' import { CheckCloseCircleIcon, CheckCircleIcon, CloseCircleIcon } from '../../assets/images' import { RoutesParams } from '../navigation/NavigationTypes' +import { Document } from './endpoints' import labels from './labels.json' export const ExerciseKeys = { @@ -61,6 +62,11 @@ export interface NextExercise { exerciseKey: number } +export type NextExerciseData = NextExercise & { + documents: Document[] + title: string +} + export const BUTTONS_THEME = { outlined: 'outlined', contained: 'contained', diff --git a/src/constants/endpoints.ts b/src/constants/endpoints.ts index a8b50c551..3c7a3b92d 100644 --- a/src/constants/endpoints.ts +++ b/src/constants/endpoints.ts @@ -40,6 +40,7 @@ export const ENDPOINTS = { disciplinesByGroup: 'disciplines_by_group', groupInfo: 'group_info', trainingSet: 'training_set', + trainingSets: 'training_sets', documents: 'documents/:id' } diff --git a/src/constants/labels.json b/src/constants/labels.json index a5d1746aa..36c8d93dd 100644 --- a/src/constants/labels.json +++ b/src/constants/labels.json @@ -10,7 +10,8 @@ "haveFun": "Viel Spaß beim Lernen", "progressDescription": "Modulen erledigt", "start": "Beginnen", - "continue": "Weitermachen", + "continue": "Fortsetzen", + "viewModules": "Module ansehen", "addCustomDiscipline": "Bereich hinzufügen", "customDisciplineSection": "Individueller Lernbereich", "customDisciplineExplanation": "Hier kannst du eigene Lernbereiche hinzufügen", diff --git a/src/hooks/useLoadNextExercise.ts b/src/hooks/useLoadNextExercise.ts new file mode 100644 index 000000000..5664962c0 --- /dev/null +++ b/src/hooks/useLoadNextExercise.ts @@ -0,0 +1,22 @@ +import { NextExerciseData } from '../constants/data' +import { Discipline } from '../constants/endpoints' +import { getNextExercise, loadTrainingsSet } from '../services/helpers' +import { formatDiscipline } from './helpers' +import useLoadAsync, { Return } from './useLoadAsync' +import { loadDocuments } from './useLoadDocuments' + +export const loadNextExercise = async (profession: Discipline): Promise => { + const nextExercise = await getNextExercise(profession) + const trainingSet = await loadTrainingsSet(nextExercise.disciplineId) + const documents = await loadDocuments({ disciplineId: nextExercise.disciplineId }) + return { + documents, + title: formatDiscipline(trainingSet, { parent: null }).title, + exerciseKey: nextExercise.exerciseKey, + disciplineId: nextExercise.disciplineId + } +} + +const useLoadNextExercise = (loadData: Discipline): Return => useLoadAsync(loadNextExercise, loadData) + +export default useLoadNextExercise diff --git a/src/hooks/useReadNextExercise.ts b/src/hooks/useReadNextExercise.ts index ebbe3db45..1ed1c3ef2 100644 --- a/src/hooks/useReadNextExercise.ts +++ b/src/hooks/useReadNextExercise.ts @@ -3,7 +3,6 @@ import { Discipline } from '../constants/endpoints' import { getNextExercise } from '../services/helpers' import useLoadAsync, { Return } from './useLoadAsync' -const useReadNextExercise = (profession: Discipline | null): Return => - useLoadAsync(getNextExercise, profession) +const useReadNextExercise = (profession: Discipline): Return => useLoadAsync(getNextExercise, profession) export default useReadNextExercise diff --git a/src/routes/home/HomeScreen.tsx b/src/routes/home/HomeScreen.tsx index 90ea1e567..e2a391930 100644 --- a/src/routes/home/HomeScreen.tsx +++ b/src/routes/home/HomeScreen.tsx @@ -1,4 +1,4 @@ -import { useFocusEffect } from '@react-navigation/native' +import { CommonActions, useFocusEffect } from '@react-navigation/native' import { StackNavigationProp } from '@react-navigation/stack' import React from 'react' import { View } from 'react-native' @@ -6,6 +6,8 @@ import styled from 'styled-components/native' import { ContentSecondary } from '../../components/text/Content' import { Heading } from '../../components/text/Heading' +import { EXERCISES, NextExerciseData } from '../../constants/data' +import { Discipline } from '../../constants/endpoints' import labels from '../../constants/labels.json' import useReadCustomDisciplines from '../../hooks/useReadCustomDisciplines' import useReadSelectedProfessions from '../../hooks/useReadSelectedProfessions' @@ -48,16 +50,38 @@ const HomeScreen = ({ navigation }: HomeScreenProps): JSX.Element => { navigation.navigate('AddCustomDiscipline') } + const navigateToDiscipline = (discipline: Discipline): void => { + navigation.navigate('DisciplineSelection', { + discipline + }) + } + + const navigateToNextExercise = (nextExerciseData: NextExerciseData) => { + const { exerciseKey, disciplineId, title: disciplineTitle, documents } = nextExerciseData + navigation.navigate(EXERCISES[exerciseKey].screen, { + disciplineId, + disciplineTitle, + documents, + closeExerciseAction: CommonActions.navigate('Home') + }) + } + const customDisciplineItems = customDisciplines?.map(customDiscipline => ( )) const selectedProfessionItems = selectedProfessions?.map(profession => ( - + )) return ( diff --git a/src/routes/home/__tests__/HomeScreen.spec.tsx b/src/routes/home/__tests__/HomeScreen.spec.tsx index 6be6d3c9a..810de26e6 100644 --- a/src/routes/home/__tests__/HomeScreen.spec.tsx +++ b/src/routes/home/__tests__/HomeScreen.spec.tsx @@ -6,6 +6,7 @@ import labels from '../../../constants/labels.json' import { useLoadDiscipline } from '../../../hooks/useLoadDiscipline' import { useLoadDisciplines } from '../../../hooks/useLoadDisciplines' import useReadCustomDisciplines from '../../../hooks/useReadCustomDisciplines' +import useReadProgress from '../../../hooks/useReadProgress' import useReadSelectedProfessions from '../../../hooks/useReadSelectedProfessions' import AsyncStorageService from '../../../services/AsyncStorage' import createNavigationMock from '../../../testing/createNavigationPropMock' @@ -15,8 +16,10 @@ import { mockDisciplines } from '../../../testing/mockDiscipline' import render from '../../../testing/render' import HomeScreen from '../HomeScreen' +jest.mock('../../../services/helpers') jest.mock('@react-navigation/native') jest.mock('../../../hooks/useReadCustomDisciplines') +jest.mock('../../../hooks/useReadProgress') jest.mock('../../../hooks/useReadSelectedProfessions') jest.mock('../../../hooks/useLoadDisciplines') jest.mock('../../../hooks/useLoadDiscipline') @@ -34,7 +37,7 @@ describe('HomeScreen', () => { mocked(useLoadDiscipline) .mockReturnValueOnce(getReturnOf(mockDisciplines()[0])) .mockReturnValueOnce(getReturnOf(mockDisciplines()[1])) - + mocked(useReadProgress).mockReturnValue(getReturnOf(0)) const { getByText } = render() const firstDiscipline = getByText('First Discipline') const secondDiscipline = getByText('Second Discipline') @@ -42,8 +45,6 @@ describe('HomeScreen', () => { expect(secondDiscipline).toBeDefined() }) - // TODO LUN-328 add test for navigate to child disciplines - it('should show custom discipline', async () => { await AsyncStorageService.setCustomDisciplines(['test']) mocked(useLoadDisciplines).mockReturnValueOnce(getReturnOf(mockDisciplines())) diff --git a/src/routes/home/components/Card.tsx b/src/routes/home/components/Card.tsx index 80b4ccd4d..14de0d690 100644 --- a/src/routes/home/components/Card.tsx +++ b/src/routes/home/components/Card.tsx @@ -16,7 +16,7 @@ const Box = styled.Pressable` justify-content: space-between; margin: ${props => props.theme.spacings.sm}; padding: 0 ${props => props.theme.spacings.sm}; - height: ${hp('28%')}px; + min-height: ${hp('28%')}px; ` const BoxHeading = styled.View` diff --git a/src/routes/home/components/CustomDisciplineDetails.tsx b/src/routes/home/components/CustomDisciplineDetails.tsx index 07d44f3a8..5456467f0 100644 --- a/src/routes/home/components/CustomDisciplineDetails.tsx +++ b/src/routes/home/components/CustomDisciplineDetails.tsx @@ -1,5 +1,3 @@ -import { useNavigation } from '@react-navigation/native' -import { StackNavigationProp } from '@react-navigation/stack' import React from 'react' import styled from 'styled-components/native' @@ -7,7 +5,6 @@ import Button from '../../../components/Button' import { BUTTONS_THEME } from '../../../constants/data' import { Discipline } from '../../../constants/endpoints' import labels from '../../../constants/labels.json' -import { RoutesParams } from '../../../navigation/NavigationTypes' import { childrenLabel } from '../../../services/helpers' import { ButtonContainer, NumberText, UnitText } from './DisciplineCard' @@ -20,28 +17,23 @@ const TextContainer = styled.View` interface PropsType { discipline: Discipline + navigateToDiscipline: (discipline: Discipline) => void } -const CustomDisciplineDetails = ({ discipline }: PropsType): JSX.Element => { - const navigation = useNavigation>() - - const navigate = (): void => { - navigation.navigate('DisciplineSelection', { - discipline - }) - } - - return ( - <> - - {discipline.numberOfChildren} - {childrenLabel(discipline)} - - -