From de2ee99511abb211f2468daa85e5d13be57f4eb6 Mon Sep 17 00:00:00 2001
From: GabrielTrettel <gabrielmtrettel@gmail.com>
Date: Wed, 13 Jan 2021 11:48:57 -0300
Subject: [PATCH] Refactoring all string colors to use app/config/colors
 constants instead of string literals.

---
 src/app/components/Icon.js                    |  6 ++---
 src/app/components/ImageInput.js              | 27 ++++++++++---------
 src/app/components/forms/FormImagePicker.js   |  3 ++-
 src/app/config/colors.js                      |  1 +
 src/app/screens/RainSharingDataScreen.js      |  4 +--
 .../screens/RiverFloodSharingDataScreen.js    |  4 +--
 6 files changed, 25 insertions(+), 20 deletions(-)

diff --git a/src/app/components/Icon.js b/src/app/components/Icon.js
index f87fda8..c3b6bb8 100644
--- a/src/app/components/Icon.js
+++ b/src/app/components/Icon.js
@@ -1,12 +1,12 @@
 import React from "react";
 import { View } from "react-native";
 import { MaterialCommunityIcons } from "@expo/vector-icons";
-
+import colors from "../config/colors";
 function Icon({
   name,
   size = 40,
-  backgroundColor = "#000",
-  iconColor = "#fff",
+  backgroundColor = colors.black,
+  iconColor = colors.white,
 }) {
   return (
     <View
diff --git a/src/app/components/ImageInput.js b/src/app/components/ImageInput.js
index 6512dc4..b87ceef 100644
--- a/src/app/components/ImageInput.js
+++ b/src/app/components/ImageInput.js
@@ -1,4 +1,4 @@
-import React, { useEffect,  useState } from "react";
+import React, { useEffect, useState } from "react";
 import {
   View,
   StyleSheet,
@@ -20,7 +20,7 @@ function ImageInput({ imageUri, onChangeImage }) {
     //requestPermissionCamera();
   }, []);
 
- /* const requestPermissionCamera = async () => {
+  /* const requestPermissionCamera = async () => {
     const { granted } = await Permissions.askAsync(Permissions.CAMERA);
     if(granted) {
       launchCamera();
@@ -38,11 +38,12 @@ function ImageInput({ imageUri, onChangeImage }) {
     } catch (error) {
       console.log("Erro ao ler imagem", error);
     }
-  };*/  
+  };*/
 
   const requestPermission = async () => {
     const { granted } = await ImagePicker.requestCameraRollPermissionsAsync();
-    if (!granted) alert("Você precisa habilitar permissão para acessar a biblioteca.");
+    if (!granted)
+      alert("Você precisa habilitar permissão para acessar a biblioteca.");
   };
 
   const handlePress = () => {
@@ -77,7 +78,9 @@ function ImageInput({ imageUri, onChangeImage }) {
               size={40}
             />
           )}
-          {imageUri && <Image source={{ uri: imageUri }} style={styles.image} />}
+          {imageUri && (
+            <Image source={{ uri: imageUri }} style={styles.image} />
+          )}
         </View>
       </TouchableWithoutFeedback>
     </View>
@@ -101,17 +104,17 @@ const styles = StyleSheet.create({
   },
   centeredView: {
     flex: 1,
-    justifyContent: 'center',
-    alignItems: 'center',
+    justifyContent: "center",
+    alignItems: "center",
     marginTop: 22,
   },
   modalView: {
     margin: 20,
-    backgroundColor: '#d3d3d3',
+    backgroundColor: colors.lightGray,
     borderRadius: 20,
     padding: 30,
-    alignItems: 'center',
-    shadowColor: 'grey',
+    alignItems: "center",
+    shadowColor: "grey",
     shadowOffset: {
       width: 10,
       height: 2,
@@ -123,7 +126,7 @@ const styles = StyleSheet.create({
   },
   modalText: {
     marginTop: 15,
-    textAlign: 'center',
+    textAlign: "center",
     fontSize: 16,
     color: colors.primary,
   },
@@ -135,7 +138,7 @@ const styles = StyleSheet.create({
     fontSize: 18,
     textAlign: "center",
     fontWeight: "bold",
-    height: 35
+    height: 35,
   },
 });
 
diff --git a/src/app/components/forms/FormImagePicker.js b/src/app/components/forms/FormImagePicker.js
index 2ec91cc..e100dd0 100644
--- a/src/app/components/forms/FormImagePicker.js
+++ b/src/app/components/forms/FormImagePicker.js
@@ -4,6 +4,7 @@ import { useFormikContext } from "formik";
 import ErrorMessage from "./ErrorMessage";
 import ImageInputList from "../ImageInputList";
 import { View, Text, StyleSheet } from "react-native";
+import colors from "../../config/colors";
 
 function FormImagePicker({ name }) {
   const { errors, setFieldValue, touched, values } = useFormikContext();
@@ -38,7 +39,7 @@ const styles = StyleSheet.create({
     fontSize: 16,
     fontWeight: "bold",
     textAlign: "left",
-    color: "#1976D2",
+    color: colors.primary,
     marginBottom: 5,
     marginTop: 15,
   },
diff --git a/src/app/config/colors.js b/src/app/config/colors.js
index 675da33..92eb6e6 100644
--- a/src/app/config/colors.js
+++ b/src/app/config/colors.js
@@ -7,4 +7,5 @@ export default {
   light: "#f8f4f4",
   dark: "#0c0c0c",
   danger: "#ff5252",
+  lightGray: "#d3d3d3",
 };
diff --git a/src/app/screens/RainSharingDataScreen.js b/src/app/screens/RainSharingDataScreen.js
index 7fcdbdc..74456b0 100644
--- a/src/app/screens/RainSharingDataScreen.js
+++ b/src/app/screens/RainSharingDataScreen.js
@@ -30,7 +30,7 @@ function RainSharingDataScreen(props) {
         style={{
           fontSize: 18,
           fontWeight: "bold",
-          color: "#1976D2",
+          color: colors.primary,
           textAlign: "center",
           marginBottom: 30,
         }}
@@ -138,7 +138,7 @@ function RainSharingDataScreen(props) {
               </TouchableNativeFeedback>
             </View>
           </View>
-          <FormImagePicker backgroundColor="#1976D2" name="images" />
+          <FormImagePicker backgroundColor={colors.primary} name="images" />
 
           <SubmitButton title="Enviar" backgroundColor={colors.primary} />
         </Form>
diff --git a/src/app/screens/RiverFloodSharingDataScreen.js b/src/app/screens/RiverFloodSharingDataScreen.js
index 8948433..1056868 100644
--- a/src/app/screens/RiverFloodSharingDataScreen.js
+++ b/src/app/screens/RiverFloodSharingDataScreen.js
@@ -30,7 +30,7 @@ function RiverFloodSharingDataScreen(props) {
         style={{
           fontSize: 18,
           fontWeight: "bold",
-          color: "#1976D2",
+          color: colors.primary,
           textAlign: "center",
           marginBottom: 30,
         }}
@@ -124,7 +124,7 @@ function RiverFloodSharingDataScreen(props) {
             </View>
           </View>
 
-          <FormImagePicker backgroundColor="#1976D2" name="images" />
+          <FormImagePicker backgroundColor={colors.primary} name="images" />
 
           <SubmitButton title="Enviar" backgroundColor={colors.primary} />
         </Form>