From be4ba003fbc06aeea6110272c91e3bcbb15ddf91 Mon Sep 17 00:00:00 2001
From: Wesley Nogueira <wesleysenan@gmail.com>
Date: Wed, 31 Mar 2021 23:23:34 -0300
Subject: [PATCH] Addition of function to differentiate types of buttons

---
 src/components/buttons/ButtonsBody.js   | 68 ++++++++++++++-----------
 src/components/buttons/CommandButton.js | 27 +++++++++-
 2 files changed, 63 insertions(+), 32 deletions(-)

diff --git a/src/components/buttons/ButtonsBody.js b/src/components/buttons/ButtonsBody.js
index 1d8b9aa..d1aae50 100644
--- a/src/components/buttons/ButtonsBody.js
+++ b/src/components/buttons/ButtonsBody.js
@@ -3,38 +3,46 @@ import { View, StyleSheet } from 'react-native';
 import CommandButton from './CommandButton';
 
 export default function() {
+  const button_text = [
+    {
+      line: ['C', '%', '*', '←'],
+      method: 'getButtonText()'
+    },
+    {
+      line: ['7', '8', '9', '/'],
+      method: 'getButtonText()'
+    },
+    {
+      line: ['4', '5', '6', '-'],
+      method: 'getButtonText()'
+    },
+    {
+      line: ['1', '2', '3', '+'],
+      method: 'getButtonText()'
+    },
+    {
+      line: ['≠', '0', '.', '='],
+      method: 'getButtonText()'
+    }
+  ]
+
   return (
     <View style={styles.marginAreaButton}>
-      <View style={styles.buttonAreaContainer}>
-        <CommandButton valueNumber={'C'}/>
-        <CommandButton valueNumber={'%'}/>
-        <CommandButton valueNumber={'*'}/>
-        <CommandButton valueNumber={'←'}/>
-      </View>
-      <View style={styles.buttonAreaContainer}>
-        <CommandButton valueNumber={7}/>
-        <CommandButton valueNumber={8}/>
-        <CommandButton valueNumber={9}/>
-        <CommandButton valueNumber={'/'}/>
-      </View>
-      <View style={styles.buttonAreaContainer}>
-        <CommandButton valueNumber={4}/>
-        <CommandButton valueNumber={5}/>
-        <CommandButton valueNumber={6}/>
-        <CommandButton valueNumber={'-'}/>
-      </View>
-      <View style={styles.buttonAreaContainer}>
-        <CommandButton valueNumber={1}/>
-        <CommandButton valueNumber={2}/>
-        <CommandButton valueNumber={3}/>
-        <CommandButton valueNumber={'+'}/>
-      </View>
-      <View style={styles.buttonAreaContainer}>
-        <CommandButton valueNumber={'≠'}/>
-        <CommandButton valueNumber={0}/>
-        <CommandButton valueNumber={'.'}/>
-        <CommandButton valueNumber={'='}/>
-      </View>
+      {
+        button_text.map((titles) => {
+          return (
+            <View style={styles.buttonAreaContainer}>
+              {
+                titles.line.map((text) => {
+                  return (
+                    <CommandButton valueButton={text} method={titles.method}/>
+                  )
+                })
+              }
+            </View>
+          )
+        })
+      }
     </View>
   );
 }
diff --git a/src/components/buttons/CommandButton.js b/src/components/buttons/CommandButton.js
index 85daa28..55527d6 100644
--- a/src/components/buttons/CommandButton.js
+++ b/src/components/buttons/CommandButton.js
@@ -2,9 +2,32 @@ import React from 'react';
 import { StyleSheet, TouchableOpacity, Text } from 'react-native';
 
 export default function(props) {
+  const operators = ['C', '%', '*', '←', '/', '-', '+', '.', '=', '≠']
+
+  const getButtonText = (value) => {
+    if(checkIsOperator(value)) { getOperator(value) }
+    if(checkIsNumeric(value)) { getNumber(value) }
+  }
+
+  const checkIsOperator = (value) => {
+    return operators.includes(value)
+  }
+
+  const checkIsNumeric = (value) => {
+    return /^-?\d+$/.test(value)
+  }
+
+  const getNumber = (value) => {
+    console.log('Number')
+  }
+
+  const getOperator = (value) => {
+    console.log('Operator')
+  }
+
   return (
-    <TouchableOpacity style={styles.buttonStyle}>
-      <Text style={styles.textButton}>{props.valueNumber}</Text>
+    <TouchableOpacity style={styles.buttonStyle} onPress={getButtonText(props.valueButton)}>
+      <Text style={styles.textButton}>{props.valueButton}</Text>
     </TouchableOpacity>
   )
 }