Add quiz base

app/(quiz)/_layout.tsx

@@ -0,0 +1,9 @@
+import { Stack } from "expo-router";
+
+export default function QuizLayout() {
+  return (
+    <Stack initialRouteName="quiz">
+      <Stack.Screen name="quiz" options={{ headerShown: false }} />
+    </Stack>
+  );
+}

app/(quiz)/quiz.tsx

@@ -0,0 +1,53 @@
+import BackButton from "@/components/BackButton";
+import GoalQuestion from "@/components/quiz/GoalQuestion";
+import LvlQuestion from "@/components/quiz/LvlQuestion";
+import { QuestionChildProps } from "@/components/quiz/Question";
+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 { View } from "react-native";
+
+export default function Quiz() {
+  const [currentQuestionIndex, setCurrentQuestionIndex] = React.useState(0);
+  const questions: ForwardRefExoticComponent<
+    QuestionChildProps & RefAttributes<any>
+  >[] = [GoalQuestion, LvlQuestion];
+
+  const goBack = () => {
+    if (currentQuestionIndex >= 1) {
+      setCurrentQuestionIndex(currentQuestionIndex - 1);
+    }
+  };
+
+  const goNext = () => {
+    if (currentQuestionIndex < questions.length - 1) {
+      setCurrentQuestionIndex(currentQuestionIndex + 1);
+    }
+  };
+
+  return (
+    <Screen>
+      <View className="gap-4 justify-between h-full">
+        <View className="flex-row justify-between items-center">
+          <BackButton onPress={goBack} />
+          <View>
+            <Text>
+              Question {currentQuestionIndex + 1} / {questions.length}
+            </Text>
+          </View>
+        </View>
+        {questions.map((QuestionComponent, index) => (
+          <React.Fragment key={index}>
+            {index == currentQuestionIndex && (
+              <QuestionComponent isVisible={true} />
+            )}
+          </React.Fragment>
+        ))}
+        <Button afterIcon="arrowright" onPress={goNext}>
+          Suivant
+        </Button>
+      </View>
+    </Screen>
+  );
+}

app/(tabs)/_layout.tsx

@@ -18,7 +18,7 @@ export default function TabBarLayout() {
   if (!session) {
     // On web, static rendering will stop here as the user is not authenticated
     // in the headless Node process that the pages are rendered in.
-    return <Redirect href="/log-in" />;
+    return <Redirect href="/quiz" />;
   }
   return (
     <Tabs

components/quiz/GoalQuestion.tsx

@@ -0,0 +1,15 @@
+import React from "react";
+import Question, { QuestionChildProps } from "./Question";
+
+export default React.forwardRef<any, QuestionChildProps>(
+  (props, ref): React.ReactElement => {
+    const { ...rest } = props;
+    return (
+      <Question
+        question="Quel est votre objectif dans l'application ?"
+        {...ref}
+        {...rest}
+      ></Question>
+    );
+  }
+);

components/quiz/LvlQuestion.tsx

@@ -0,0 +1,15 @@
+import React from "react";
+import Question, { QuestionChildProps } from "./Question";
+
+export default React.forwardRef<any, QuestionChildProps>(
+  (props, ref): React.ReactElement => {
+    const { ...rest } = props;
+    return (
+      <Question
+        question="Comment estimez vous votre niveau d'activité ?"
+        {...ref}
+        {...rest}
+      ></Question>
+    );
+  }
+);

components/quiz/Question.tsx

@@ -0,0 +1,29 @@
+import Text from "@/components/ui/Text";
+import React from "react";
+import { View, ViewProps } from "react-native";
+
+export interface QuestionChildProps extends ViewProps {
+  isVisible: boolean;
+}
+
+interface QuestionProps extends QuestionChildProps {
+  question: string;
+}
+
+export default React.forwardRef<any, QuestionProps>(
+  (props, ref): React.ReactElement => {
+    const { question, isVisible, children, ...rest } = props;
+    const getClassName = () => {
+      return "gap-4" + " " + (isVisible ? "block" : "hidden");
+    };
+
+    return (
+      <View className={getClassName()} {...ref} {...rest}>
+        <Text size="3xl" position="center">
+          {question}
+        </Text>
+        {children}
+      </View>
+    );
+  }
+);