start of errors views

app/(tabs)/(help)/HelpsScreen.tsx

@@ -1,12 +1,14 @@
 import {SafeAreaView, Text, View} from "react-native";
 import React from "react";
+import Error, {ProblemProps} from "@/app/(utility)/Error";
+import NotFound from "@/components/error/NotFoundProblem";
+import {NOT_FOUND} from "@/components/Errors";
 
 export default function HelpsScreen() {
     return (
         <SafeAreaView>
             <View>
-                <Text className="m-7 font-extrabold">Welcome to Help Screen </Text>
+                <NotFound/>
-                <Text>We will do it soon</Text>
             </View>
         </SafeAreaView>
 

app/(utility)/Error.tsx

@@ -0,0 +1,28 @@
+import Text from "@/components/ui/Text";
+import React, {forwardRef} from "react";
+import {Image, View, ViewProps} from "react-native";
+import BackButton from "@/components/BackButton";
+
+export interface ProblemProps extends ViewProps{
+    picture: string;
+    problem: string;
+    description: string;
+    information: string;
+    isVisible?: boolean;
+}
+
+export default forwardRef<any, ProblemProps> (({className, ...Props}, ref) => {
+    return (
+        <View className={"gap-4 justify-between h-full" + " " + className} {...Props} ref={ref}>
+            <View className="flex-row justify-between items-center p-4">
+                <BackButton/>
+            </View>
+
+            <Image source={Props.picture}/>
+            <Text position="center" weight="bold" size="3xl"> {Props.problem} </Text>
+            <Text size="lg" position="center"> {Props.description} </Text>
+
+            <Text size="lg" position="center"> {Props.information} </Text>
+        </View>
+    );
+});

components/Errors.tsx

@@ -1,3 +1,10 @@
 export const EMPTY_FIELD = "Un des champs est vide !";
 export const INVALID_EMAIL = "Adresse mail invalide !";
 export const NOT_MATCHING_PASSWORD = "Les mots de passe sont différents";
+
+export const NOT_FOUND = "Ressource introuvable :<";
+export const NO_INTERNET = "Pas de connexion à internet";
+export const INTERNAL_ERROR = "Erreur interne, veuillez nous pardonner";
+export const MAINTENANCE = "Le serveur est en maintenance, veuillez réessayer plus tard";
+export const NOT_AUTHORIZED = "Vous n'êtes pas autorisé à accéder à cette ressource";
+export const FEATURE_LOCKED = "Cette fonctionnalité est verrouillée";

components/error/NotFoundProblem.tsx

@@ -0,0 +1,15 @@
+import React from "react";
+import {NOT_FOUND} from "@/components/Errors";
+import Error from "@/app/(utility)/Error";
+import notFoundPict from "@/assets/images/NotFound.png";
+
+export default function NotFound() {
+    return (
+        <Error
+            picture={notFoundPict}
+            problem="Introuvable"
+            description={NOT_FOUND}
+            information="Status Code : 404"
+        />
+    );
+}