working on votos

MocionesIUPI/App.js

@@ -1,16 +1,19 @@
 import React, { useEffect, useState } from 'react';
-import { ActivityIndicator, FlatList, Text, View } from 'react-native';
+import { ActivityIndicator, Button, FlatList, Text, View } from 'react-native';
 
 export default App = () => {
   const [isLoading, setLoading] = useState(true);
-  const [data, setData] = useState([]);
+  const[json, setJson] = useState(null);
+  const [mocion, setMocion] = useState([]);
+  const [description, setDescription] = useState([]);
 
   // this connects us to the API and fetches the json file with the mociones
   const getMociones = async () => {
      try {
-      const response = await fetch('http://127.0.0.1:5000/send?PIN=121071');
+      const response = await fetch('http://10.190.1.140:5000/send?PIN=121071');
       const json = await response.json();
-      setData(json.Description);
+      setMocion(json.Mocion);
+      setDescription(json.Description);
     } catch (error) {
       console.error(error);
     } finally {
@@ -22,19 +25,35 @@ export default App = () => {
     getMociones();
   }, []);
 
+  // this recieves the value of the button pressed and sends it to the api 
+  const sendVotos = (value) => {
+    console.log(value); // testing that we recied the value
+
+    //adding new values to json
+    fetch('http://10.190.1.140:5000', {
+      method: 'POST',
+      body: JSON.stringify(json),
+      headers: {
+        'Accept': 'application/json',
+        'Content-Type': 'application/json'
+      },
+    });
+  };
+
   // here we want to display each mocion in a flatlist 
   // it's supposed to be like buttons. Once clicked it would let you vote inside
   return (
     <View style={{ flex: 1, padding: 24 }}>
-      {isLoading ? <ActivityIndicator/> : (
-        <FlatList
-          data={data}
-          keyExtractor={({ id }, index) => id}
-          renderItem={({ item }) => (
-            <Text>{data}</Text>
-          )}
-        />
-      )}
+      <Text>{mocion}</Text>
+      <Text>{description}</Text>
+      
+      {/* container for the look of the buttons */}
+      <View >
+      <Button title='A favor' onPress={() => sendVotos('A Favor')} />
+      <Button title='En Contra'onPress={() => sendVotos('En Contra')} />
+      <Button title='Abstenido/a' onPress={() => sendVotos('Abstenido/a')} />
+      </View>
+
     </View>
   );
 };

MocionesIUPI/screens/HomeScreen.js

@@ -0,0 +1,43 @@
+import { propertiesListToString } from "@expo/config-plugins/build/android/Properties";
+import React, { useEffect, useState }from "react";
+import { StyleSheet, View, Text, Button } from 'react-native';
+import { globalStyles } from "../styles/global";
+
+export default App = ({ navigation }) => {
+    const [PIN, setPIN] = useState([]); // this is looking for 'PIN' and it's content
+  
+    // this connects us to the API and fetches the json file with the mociones
+    const getMociones = async () => {
+       try {
+        const response = await fetch('http://10.190.1.140:5000/send?PIN=613382'); // connection to the website 
+        const json = await response.json();
+  
+        // setting the content of each category 
+        setPIN(json.PIN);
+  
+      } catch (error) {
+        console.error(error);
+      } finally {
+        setLoading(false); // once found the loading icon will be replaced with the content of the json
+      }
+    }
+
+    const pressHandler = () => {
+        navigation.navigate('Pinpage', {Pin:PIN},) // with this we send parameters to other screens
+    }
+    
+    useEffect(() => {
+        getMociones();
+      }, []);
+
+    return (
+        <View style = {globalStyles.container}>
+            <Text style = {globalStyles.tittleText}>Home Screen</Text>
+            <Button title='Ir a pagina de pin' color={'#e81b39'} onPress={pressHandler} />
+        </View>
+
+        
+        
+
+    )
+}

MocionesIUPI/screens/MocionScreen.js

@@ -5,25 +5,22 @@ export default App = () => {
   const [isLoading, setLoading] = useState(true);
   const [Description, setDescription] = useState([]); // this is looking for 'Description' and it's content
   const [Mocion, setMocion] = useState([]); // this is looking for 'Mocion' and it's content
-  const [PIN, setPIN] = useState([]); // this is looking for 'PIN' and it's content
-
-  // this connects us to the API and fetches the json file with the mociones
-  const getMociones = async () => {
-     try {
-      const response = await fetch('http://10.190.1.140:5000/send?PIN=121071'); // connection to the website 
-      const json = await response.json();
-
-      // setting the content of each category 
-      setMocion(json.Mocion); 
-      setDescription(json.Description);
-      setPIN(json.PIN);
-
-    } catch (error) {
-      console.error(error);
-    } finally {
-      setLoading(false); // once found the loading icon will be replaced with the content of the json
-    }
-  }
+  
+      // this connects us to the API and fetches the json file with the mociones
+      const getMociones = async () => {
+        try {
+         const response = await fetch('http://10.190.1.140:5000/send?PIN=613382'); // connection to the website 
+         const json = await response.json();
+   
+         // setting the content of each category 
+         setMocion(json.Mocion); 
+         setDescription(json.Description);
+       } catch (error) {
+         console.error(error);
+       } finally {
+         setLoading(false); // once found the loading icon will be replaced with the content of the json
+       }
+     }
 
   useEffect(() => {
     getMociones();
@@ -33,9 +30,15 @@ export default App = () => {
   // it's supposed to be like buttons. Once clicked it would let you vote inside
   return (
     <View style={{ flex: 1, padding: 24 }}>
-      <Text>{Mocion}</Text>
-      <Text>{Description}</Text>
-      <Text>{PIN}</Text>
+      {isLoading ? <ActivityIndicator/> : (
+        <FlatList
+          data={data}
+          keyExtractor={({ id }, index) => id}
+          renderItem={({ item }) => (
+            <Text>{data}</Text>
+          )}
+        />
+      )}
     </View>
   );
 };