Merge branch 'Freehand' of https://git.ccom.uprrp.edu/ccorrada/ErEduGilMor

Home_page.js

+
+import React, {useState, useEffect} from 'react'
+import { Button, Text, View, StyleSheet} from 'react-native'
+import {FlatList, ListViewBase } from 'react-native'
+import {TouchableOpacity} from 'react-native-gesture-handler'
+import {List, Divider} from 'react-native-paper'
+import Loading from '../components/Loading'
+import firebase from 'firebase';
+import { styles } from "../config/styles";
+import { TextInput, TouchableWithoutFeedback, Keyboard, ImageBackground} from "react-native";
+
+export default function Home_page({navigation}) {
+  const [threads, setThreads] = useState([]);  
+  const [loading, setLoading] = useState(true);
+
+  useEffect(() => {
+
+    const fire = firebase.firestore()
+    .collection('THREADS')
+    
+    .onSnapshot(querySnapshot => {
+      const threads = querySnapshot.docs.map(documentSnapshot => {
+        return{
+          _id:documentSnapshot.id,
+          name:'',
+          ...documentSnapshot.data()
+        };
+
+      });
+
+      setThreads(threads);
+
+      if(loading){
+        setLoading(false);
+      }
+
+    });
+
+    return () => fire();
+  }, []);
+  
+  if (loading) {
+    return <Loading />;
+  }
+  
+  return (
+    <View>
+    <ImageBackground style={styles.stdcontainer} source={require('../assets/yellow-white.jpg')}>
+        <FlatList
+          data={threads}
+          keyExtractor = {item => item._id}
+          ItemSeparatorComponent={() => <Divider />}
+          renderItem = {({item}) => (
+
+            <TouchableOpacity
+            onPress={() => navigation.navigate('Room', {thread: item})}
+            
+            >
+            <List.Item
+              title={item.name}
+              description='Item description'
+              titleNumberOfLines={1}
+              titleStyle={styles.listTitle}
+              descriptionStyle={styles.listDescription}
+              descriptionNumberOfLines={1}
+            />
+          </TouchableOpacity>
+        )}
+      />
+
+      <Button
+        title='Ver mensajes'
+        onPress={() => navigation.navigate('Add')}
+      />
+
+        <Button
+        title ='Hacer Busqueda'
+        onPress= {() => navigation.navigate('Room')}
+        />
+        </ImageBackground>
+      </View>
+    );
+  }
+
+
+
+
+

Loading.js

+import React from 'react';
+import { View, ActivityIndicator, StyleSheet } from 'react-native';
+
+export default function Loading() {
+  return (
+    <View style={styles.loadingContainer}>
+      <ActivityIndicator size='large' color='#6646ee' />
+    </View>
+  );
+}
+
+const styles = StyleSheet.create({
+  loadingContainer: {
+    flex: 1,
+    alignItems: 'center',
+    justifyContent: 'center'
+  }
+});