Fixing key prop error in AccountScreen

src/app/navigation/AccountNavigator.js

@@ -1,7 +1,7 @@
 import React from "react";
 import { createStackNavigator } from "@react-navigation/stack";
 import AccountScreen from "../screens/AccountScreen";
-import PluviometerRegisterScreen from '../screens/PluviometerRegisterScreen';
+import PluviometerRegisterScreen from "../screens/PluviometerRegisterScreen";
 import MapFormScreen from "../screens/MapFormScreen";
 import Abbout from "../screens/Abbout";
 import ActivateInstitution from "../screens/ActivateInstitution";
@@ -42,7 +42,7 @@ const AccountNavigator = () => (
           backgroundColor: "white",
         },
       }}
-    /> 
+    />
     <Stack.Screen
       name="ActivateInstitution"
       component={ActivateInstitution}
@@ -52,7 +52,7 @@ const AccountNavigator = () => (
           backgroundColor: "white",
         },
       }}
-    /> 
+    />
     <Stack.Screen
       name="UpdatePassword"
       component={UpdatePassword}
@@ -73,8 +73,6 @@ const AccountNavigator = () => (
         },
       }}
     />
-
-
     <Stack.Screen
       name="FormMap"
       component={MapFormScreen}

src/app/screens/AccountScreen.js

@@ -1,11 +1,5 @@
 import React, { useContext } from "react";
-import {
-  Text,
-  Image,
-  View,
-  StyleSheet,
-  ScrollView,
-} from "react-native";
+import { Text, Image, View, StyleSheet, ScrollView } from "react-native";
 import Screen from "../components/Screen";
 import { AuthContext } from "../auth/context";
 import authStorage from "../auth/storage";
@@ -53,7 +47,16 @@ function ProfileItensList({ icon, IconProvider, title, onPress }) {
           }}
         >
           <IconProvider name={icon} size={18} color={colors.dark} />
-          <Text style={{ fontSize: 16, marginLeft: 16 }}>{title}</Text>
+          <Text
+            style={{
+              fontSize: 16,
+              marginLeft: 16,
+              textTransform: "uppercase",
+              fontWeight: "500",
+            }}
+          >
+            {title}
+          </Text>
           <View
             style={{
               alignItems: "flex-end",
@@ -126,7 +129,7 @@ function AccountScreen(props) {
     {
       icon: "trash-can",
       IconProvider: MaterialCommunityIcons,
-      title: "Desativar conta",
+      title: "DESATIVAR CONTA",
       onPress: () => {
         console.log("7");
       },
@@ -145,12 +148,14 @@ function AccountScreen(props) {
 
           <View style={{ marginTop: 24 }}>
             {profileItems.map(({ icon, IconProvider, title, onPress }) => (
-              <ProfileItensList
-                icon={icon}
-                IconProvider={IconProvider}
-                title={title}
-                onPress={onPress}
-              />
+              <View key={title}>
+                <ProfileItensList
+                  icon={icon}
+                  IconProvider={IconProvider}
+                  title={title}
+                  onPress={onPress}
+                />
+              </View>
             ))}
           </View>
         </View>