Ajout indicateur validité mot de passe

bob_party/src/screens/SignUp.tsx

@@ -113,16 +113,38 @@ function SignUp(props: { navigation: any; }) {
             dispatch(updateImpossibleBirthDate(false));
             break;
     }
+
+    function indicatorStatus(){
+        let passwordRegex : RegExp = /^(?=.*?[A-Z])(?=.*?[a-z])(?=.*?[0-9])(?=.*?[#?!@$%^&*-])(?!.*?[.\n\\{}[\],]).{8,}$/;
+        
+        if(passwordRegex.test(password)){
+            return{
+                backgroundColor:"green",
+            }
+        }
+        return{
+            backgroundColor:"red",
+        }
+    }
     
     return (
     <View style={stylesScreen.container}>
         <View style={stylesScreen.bodyCenter}>
             
             <Text style={styles.text}>Login</Text>
-            <TextInput style={styles.textInput} placeholder='Login' onChangeText={(val) => setPseudo(val) } autoCapitalize='none' />
+            <TextInput style={styles.textInputLogin} placeholder='Login' onChangeText={(val) => setPseudo(val) } autoCapitalize='none' />
             
             <Text style={styles.text}>Password</Text>
-            <TextInput style={styles.textInput} placeholder='Password' onChangeText={(val) => setPassword(val)} autoCapitalize='none' secureTextEntry={true}/>
+            <View style={[styles.viewTextInputPassword, {flexDirection: 'row'}]}>
+                <TextInput style={styles.textInputPassword} placeholder='Password' onChangeText={(val) => setPassword(val)} autoCapitalize='none' secureTextEntry={true}/>
+                <View style={styles.viewIndicator}>
+                    {
+                        
+                        <View style={[styles.indicator, indicatorStatus()]}></View>
+                    }
+                
+                </View>
+            </View>
             
             
             <View style={{width: '70%', alignItems: 'center'}}>

bob_party/src/screens/style/SignUp.style.js

@@ -2,12 +2,34 @@ import { StyleSheet } from "react-native";
 
 
 export default StyleSheet.create({
-      textInput: {
+      textInputLogin: {
         width: '70%',
-        height: '5%',
+        height:  60,
         backgroundColor: 'white',
-        padding: 10,
         marginTop: 10,
+        paddingLeft: 15,
+      },
+      textInputPassword: {
+        width: '70%',
+        height: '100%',
+        backgroundColor: 'white',
+      },
+      viewTextInputPassword: {
+        width: '70%',
+        height: 60,
+        backgroundColor: 'white',
+        paddingHorizontal: 15,
+        marginTop: 10,
+      },
+      viewIndicator: {
+        flex: 1,
+        alignSelf: 'center'
+      },
+      indicator: {
+        width: 20,
+        height: 20,
+        alignSelf: 'flex-end',
+        borderRadius: 50,
       },
       button: {
         alignItems: 'center',