login register

src/screens/Register.js

@@ -27,6 +27,7 @@ const Register = () => {
   const [email, setEmail] = useState("");
   const [firstName, setFirstName] = useState("");
   const [lastName, setLastName] = useState("");
+  const [city, setCity] = useState("");
   const [selectedCountry, setSelectedCountry] = useState(null);
   const [countrySearch, setCountrySearch] = useState("");
   const [isCountryModalVisible, setIsCountryModalVisible] = useState(false);
@@ -58,6 +59,7 @@ const Register = () => {
     email.trim().length > 0 &&
     firstName.trim().length > 0 &&
     lastName.trim().length > 0 &&
+    city.trim().length > 0 &&
     selectedCountry;
 
   const handleSelectCountry = (country) => {
@@ -79,7 +81,7 @@ const Register = () => {
       title="Inscription"
     >
       <View style={styles.pageContent}>
-        <ItemContainer height={620} disableKeyboardHeight>
+        <ItemContainer height={680} disableKeyboardHeight>
           <View style={styles.formContent}>
             <Text style={styles.title}>Renseigne tes informations</Text>
             {preferredLanguage && (
@@ -106,24 +108,34 @@ const Register = () => {
                   value={lastName}
                   setValue={setLastName}
                 />
-                <Pressable
-                  style={[
-                    styles.countryButton,
-                    selectedCountry ? styles.countryButtonFilled : null,
-                  ]}
-                  onPress={() => setIsCountryModalVisible(true)}
-                >
-                  <Text
+                <View style={styles.countryField}>
+                  <Text style={styles.inputLabel}>Pays</Text>
+                  <Pressable
                     style={[
-                      styles.countryButtonText,
-                      !selectedCountry && styles.countryButtonPlaceholder,
+                      styles.countryButton,
+                      selectedCountry ? styles.countryButtonFilled : null,
                     ]}
+                    onPress={() => setIsCountryModalVisible(true)}
                   >
-                    {selectedCountry
-                      ? selectedCountry.name
-                      : "Choisis ton pays"}
-                  </Text>
-                </Pressable>
+                    <Text
+                      style={[
+                        styles.countryButtonText,
+                        !selectedCountry && styles.countryButtonPlaceholder,
+                      ]}
+                    >
+                      {selectedCountry
+                        ? selectedCountry.name
+                        : "Choisis ton pays"}
+                    </Text>
+                  </Pressable>
+                </View>
+                <Input
+                  placeholder="Ville"
+                  label="Ville"
+                  isBlur
+                  value={city}
+                  setValue={setCity}
+                />
               </View>
               <Input
                 placeholder="Adresse mail"
@@ -145,6 +157,7 @@ const Register = () => {
                   email: email.trim(),
                   firstName: firstName.trim(),
                   lastName: lastName.trim(),
+                  city: city.trim(),
                   country: selectedCountry,
                   preferredLanguage,
                 })
@@ -258,6 +271,14 @@ const styles = StyleSheet.create({
   countryButtonPlaceholder: {
     color: Palette.gray,
   },
+  countryField: {
+    gap: 4,
+  },
+  inputLabel: {
+    fontSize: 14,
+    color: Palette.white,
+    fontFamily: FONT_FAMILY.HelveticaNeueRegular,
+  },
   footer: {
     alignItems: "center",
     gap: 4,