refactor: treating duplicity

fga-eps-mds · Sep 21, 2024 · 64bd31d · 64bd31d
1 parent 95adc12
commit 64bd31d
Show file tree

Hide file tree

Showing 4 changed files with 96 additions and 98 deletions.
diff --git a/src/app/components/ModalButtons.tsx b/src/app/components/ModalButtons.tsx
@@ -0,0 +1,76 @@
+import React from 'react';
+import { Pressable, Text, View, StyleSheet } from 'react-native';
+
+interface IErrors {
+    valor?: string;
+  }
+
+interface IModalButtonsProps {
+    onCancel: () => void;
+    onSave: () => void;
+    showErrors: boolean;
+    setShowErrors: (value: boolean) => void;
+    erros: IErrors; 
+}
+
+const ModalButtons: React.FC<IModalButtonsProps> = ({
+  onCancel,
+  onSave,
+  showErrors,
+  setShowErrors,
+  erros,
+}) => {
+  return (
+    <View style={styles.buttonContainer}>
+      <Pressable
+        testID="cancelarBtn"
+        style={[styles.button, styles.buttonCancel]}
+        onPress={onCancel}
+      >
+        <Text style={styles.textStyle}>Cancelar</Text>
+      </Pressable>
+      <Pressable
+        testID="callbackBtn"
+        style={[styles.button, styles.buttonClose]}
+        onPress={() => {
+          if (Object.keys(erros).length > 0) {
+            setShowErrors(true);
+          } else {
+            onSave();
+          }
+        }}
+      >
+        <Text style={styles.textStyle}>Salvar</Text>
+      </Pressable>
+    </View>
+  );
+};
+
+const styles = StyleSheet.create({
+  buttonContainer: {
+    flexDirection: "row",
+    justifyContent: "space-between",
+    marginTop: 20,
+  },
+  button: {
+    borderRadius: 20,
+    padding: 10,
+    elevation: 2,
+    width: 100,
+  },
+  buttonClose: {
+    backgroundColor: "#2CCDB5",
+    marginHorizontal: 15,
+  },
+  buttonCancel: {
+    backgroundColor: "#FF7F7F",
+    marginHorizontal: 15,
+  },
+  textStyle: {
+    color: "white",
+    fontWeight: "bold",
+    textAlign: "center",
+  },
+});
+
+export default ModalButtons;
diff --git a/src/app/components/ModalConfirmation.tsx b/src/app/components/ModalConfirmation.tsx
@@ -3,11 +3,11 @@ import { Modal, StyleSheet, Text, Pressable, View } from "react-native";
 
 interface IProps {
   visible: boolean;
-  callbackFn: () => void;  // Atualizado para void
-  closeModal: () => void;  // Atualizado para void
+  callbackFn: () => void; 
+  closeModal: () => void;  
   message: string;
   messageButton: string;
-  testID?: string;  // Adicione esta linha para suportar o testID
+  testID?: string;  
 }
 
 export default function ModalConfirmation({
@@ -16,7 +16,7 @@ export default function ModalConfirmation({
   closeModal,
   message,
   messageButton,
-  testID, // Receba o testID
+  testID, 
 }: Readonly<IProps>) {
   return (
     <Modal animationType="fade" transparent={true} visible={visible} testID={testID}>

diff --git a/src/app/components/ModalMeta.tsx b/src/app/components/ModalMeta.tsx
@@ -5,6 +5,7 @@ import { MaterialCommunityIcons } from "@expo/vector-icons";
 import { TextInput } from "react-native-gesture-handler";
 import ErrorMessage from "./ErrorMessage";
 import { validateValue } from "../shared/helpers/modal.helper";
+import ModalButtons from "./ModalButtons";
 
 interface IProps {
   visible: boolean;
@@ -59,28 +60,13 @@ export default function ModalMeta({
               </View>
             </View>
           </View>
-          <View style={styles.buttonContainer}>
-            <Pressable
-              testID="cancelarBtn"
-              style={[styles.button, styles.buttonCancel]}
-              onPress={() => closeModal()}
-            >
-              <Text style={styles.textStyle}>Cancelar</Text>
-            </Pressable>
-            <Pressable
-              testID="callbackBtn"
-              style={[styles.button, styles.buttonClose]}
-              onPress={() => {
-                if (Object.keys(erros).length > 0) {
-                  setShowErrors(true);
-                } else {
-                  callbackFn(valor);
-                }
-              }}
-            >
-              <Text style={styles.textStyle}>{"Salvar"}</Text>
-            </Pressable>
-          </View>
+          <ModalButtons
+          onCancel={closeModal}
+          onSave={() => callbackFn(valor)}
+          showErrors={showErrors}
+          setShowErrors={setShowErrors}
+          erros={erros}
+          />
         </View>
       </View>
     </Modal>
@@ -127,34 +113,9 @@ const styles = StyleSheet.create({
     shadowRadius: 4,
     elevation: 5,
   },
-  button: {
-    borderRadius: 20,
-    padding: 10,
-    elevation: 2,
-    width: 100,
-  },
-  buttonOpen: {
-    backgroundColor: "#F194FF",
-  },
-  buttonClose: {
-    backgroundColor: "#2CCDB5",
-    marginHorizontal: 15,
-  },
-  buttonCancel: {
-    backgroundColor: "#FF7F7F",
-    marginHorizontal: 15,
-  },
-  textStyle: {
-    color: "white",
-    fontWeight: "bold",
-    textAlign: "center",
-  },
   modalText: {
     marginBottom: 35,
     textAlign: "center",
     fontWeight: "bold",
   },
-  buttonContainer: {
-    flexDirection: "row",
-  },
 });
diff --git a/src/app/components/ModalMetrica.tsx b/src/app/components/ModalMetrica.tsx
@@ -7,6 +7,7 @@ import { FontAwesome, Entypo } from "@expo/vector-icons";
 import { TextInput } from "react-native";
 import ErrorMessage from "./ErrorMessage";
 import { validateValue } from "../shared/helpers/modal.helper";
+import ModalButtons from "./ModalButtons";
 
 interface IProps {
   visible: boolean;
@@ -97,28 +98,13 @@ export default function ModalMetrica({
               </View>
             </View>
           </View>
-          <View style={styles.buttonContainer}>
-            <Pressable
-              testID="cancelarBtn"
-              style={[styles.button, styles.buttonCancel]}
-              onPress={() => closeModal()}
-            >
-              <Text style={styles.textStyle}>Cancelar</Text>
-            </Pressable>
-            <Pressable
-              testID="callbackBtn"
-              style={[styles.button, styles.buttonClose]}
-              onPress={() => {
-                if (Object.keys(erros).length > 0) {
-                  setShowErrors(true);
-                } else {
-                  callbackFn(valor);
-                }
-              }}
-            >
-              <Text style={styles.textStyle}>{"Salvar"}</Text>
-            </Pressable>
-          </View>
+          <ModalButtons
+          onCancel={closeModal}
+          onSave={() => callbackFn(valor)}
+          showErrors={showErrors}
+          setShowErrors={setShowErrors}
+          erros={erros}
+          />
         </View>
       </View>
     </Modal>
@@ -165,34 +151,9 @@ const styles = StyleSheet.create({
     shadowRadius: 4,
     elevation: 5,
   },
-  button: {
-    borderRadius: 20,
-    padding: 10,
-    elevation: 2,
-    width: 100,
-  },
-  buttonOpen: {
-    backgroundColor: "#F194FF",
-  },
-  buttonClose: {
-    backgroundColor: "#2CCDB5",
-    marginHorizontal: 15,
-  },
-  buttonCancel: {
-    backgroundColor: "#FF7F7F",
-    marginHorizontal: 15,
-  },
-  textStyle: {
-    color: "white",
-    fontWeight: "bold",
-    textAlign: "center",
-  },
   modalText: {
     marginBottom: 35,
     textAlign: "center",
     fontWeight: "bold",
   },
-  buttonContainer: {
-    flexDirection: "row",
-  },
 });