diff --git a/app/(quiz)/quiz.tsx b/app/(quiz)/quiz.tsx index 951ce6a..16501db 100644 --- a/app/(quiz)/quiz.tsx +++ b/app/(quiz)/quiz.tsx @@ -1,37 +1,36 @@ import BackButton from "@/components/BackButton"; import { toBgColor, toTextColor } from "@/components/Constants"; -import AgeQuestion from "@/components/quiz/AgeQuestion"; -import BeginnerQuestion from "@/components/quiz/BeginnerQuestion"; -import HeightQuestion from "@/components/quiz/HeightQuestion"; -import { QuestionChildProps } from "@/components/quiz/Question"; -import WeightQuestion from "@/components/quiz/WeightQuestion"; import Button from "@/components/ui/Button"; import Screen from "@/components/ui/Screen"; import Text from "@/components/ui/Text"; -import React, { ForwardRefExoticComponent, RefAttributes } from "react"; +import React from "react"; import { View } from "react-native"; +import FrequencyQuestion from "@/components/quiz/FrequencyQuestion"; import GoalQuestion from "@/components/quiz/GoalQuestion"; -import LvlQuestion from "@/components/quiz/LvlQuestion"; import GenderQuestion from "@/components/quiz/GenderQuestion"; -import ActivityQuestion from "@/components/quiz/ActivityQuestion"; +import WeightQuestion from "@/components/quiz/WeightQuestion"; +import HeightQuestion from "@/components/quiz/HeightQuestion"; +import AgeQuestion from "@/components/quiz/AgeQuestion"; +import BeginnerQuestion from "@/components/quiz/BeginnerQuestion"; +import LvlQuestion from "@/components/quiz/LvlQuestion"; import SleepQuestion from "@/components/quiz/SleepQuestion"; -import SportQuestion from "@/components/quiz/SportQuestion"; export default function Quiz() { const [currentQuestionIndex, setCurrentQuestionIndex] = React.useState(0); - const questions: ForwardRefExoticComponent< - QuestionChildProps & RefAttributes - >[] = [ - GoalQuestion, - GenderQuestion, - WeightQuestion, - HeightQuestion, - LvlQuestion, - AgeQuestion, - BeginnerQuestion, - ActivityQuestion, - SleepQuestion, - SportQuestion + interface Question { + component: React.ForwardRefExoticComponent>; + props: T; + } + const questions: Question[] = [ + { component: GoalQuestion, props: {} }, + { component: GenderQuestion, props: {} }, + { component: WeightQuestion, props: {} }, + { component: HeightQuestion, props: {} }, + { component: AgeQuestion, props: {} }, + { component: BeginnerQuestion, props: {} }, + { component: LvlQuestion, props: {} }, + { component: FrequencyQuestion, props: { isMale: true } }, + { component: SleepQuestion, props: {} }, ]; const goBack = () => { @@ -57,13 +56,13 @@ export default function Quiz() { - {questions.map((QuestionComponent, index) => ( - - {index == currentQuestionIndex && ( - - )} - - ))} + {questions.map((question, index) => + React.createElement(question.component, { + isVisible: index === currentQuestionIndex, + key: index, + ...question.props, + }) + )} diff --git a/components/CheckButtonComponent.tsx b/components/CheckButtonComponent.tsx index 909aaef..97007f4 100644 --- a/components/CheckButtonComponent.tsx +++ b/components/CheckButtonComponent.tsx @@ -13,7 +13,7 @@ interface CheckButtonProps { const CheckButton: React.FC = ({ label, value, onChange, icon }) => { let AwesomIconList = ["weight-scale", "beer"]; return ( - + {AwesomIconList.includes(icon) ? ( diff --git a/components/quiz/FrequencyQuestion.tsx b/components/quiz/FrequencyQuestion.tsx new file mode 100644 index 0000000..3b8d5a1 --- /dev/null +++ b/components/quiz/FrequencyQuestion.tsx @@ -0,0 +1,35 @@ +import React from "react"; +import Question, { QuestionChildProps } from "./Question"; +import Text from "../ui/Text"; +import SegmentedControl from "../ui/SegmentedControl"; +import { View } from "react-native"; + +export interface FrequencyQuestionProps extends QuestionChildProps { + isMale: boolean; +} + +export default React.forwardRef( + (props, ref): React.ReactElement => { + const { isMale, ...rest } = props; + const ANSWERS = ["1", "2", "3", "4", "5"]; + const [answer, setAnswer] = React.useState("1"); + return ( + + + + Je suis {isMale ? "prêt" : "prête"} à m'entraîner + + + {answer} + + fois par semaine ! + + + + ); + } +); diff --git a/components/quiz/Question.tsx b/components/quiz/Question.tsx index 6b1ba0b..1dea95d 100644 --- a/components/quiz/Question.tsx +++ b/components/quiz/Question.tsx @@ -3,7 +3,7 @@ import React from "react"; import { View, ViewProps } from "react-native"; export interface QuestionChildProps extends ViewProps { - isVisible: boolean; + isVisible?: boolean; } interface QuestionProps extends QuestionChildProps { @@ -26,4 +26,4 @@ export default React.forwardRef( ); } -); \ No newline at end of file +); diff --git a/components/quiz/SportQuestion.tsx b/components/quiz/SportQuestion.tsx index ea9520e..4cb1dd1 100644 --- a/components/quiz/SportQuestion.tsx +++ b/components/quiz/SportQuestion.tsx @@ -1,6 +1,6 @@ import React from "react"; import Question, { QuestionChildProps } from "./Question"; -import CheckButton from "../CheckboxComponent"; +import CheckButton from "../CheckButtonComponent"; import {View} from "react-native"; import {FontAwesome6} from "@expo/vector-icons"; @@ -83,7 +83,7 @@ export default React.forwardRef( } }; const handleChangeSix = () => { - if(!checkedFive) { + if(!checkedSix) { setCheckedOne(false); setCheckedTwo(false); setCheckedThree(false); @@ -96,7 +96,7 @@ export default React.forwardRef( } }; const handleChangeSeven = () => { - if(!checkedFive) { + if(!checkedSeven) { setCheckedOne(false); setCheckedTwo(false); setCheckedThree(false); @@ -109,7 +109,7 @@ export default React.forwardRef( } }; const handleChangeEight = () => { - if(!checkedFive) { + if(!checkedEight) { setCheckedOne(false); setCheckedTwo(false); setCheckedThree(false); @@ -122,7 +122,7 @@ export default React.forwardRef( } }; const handleChangeNine = () => { - if(!checkedFive) { + if(!checkedNine) { setCheckedOne(false); setCheckedTwo(false); setCheckedThree(false); @@ -141,13 +141,15 @@ export default React.forwardRef( {...ref} {...rest} > - + + +