lee clientes

src/components/cardList/CardList.tsx

@@ -0,0 +1,58 @@
+import React, { FC, useEffect, useState } from 'react'
+import { Card } from '../Card'
+import { FlatList, Text, TouchableOpacity } from 'react-native'
+import { useFetchWithAuth } from '../../hooks/useFetchWithAuth'
+import { useNavigation } from '@react-navigation/native';
+
+interface Props {
+    endpoint: string
+}
+
+export const CardList:FC <Props> = ({endpoint}) => {
+
+    const navitation = useNavigation();
+
+    let defaultData:[] = [];
+
+  const [entities, setEntities] = useState(defaultData);
+
+
+  const getInitData = async () => {
+    
+      const { data, error } = await useFetchWithAuth(endpoint);
+
+      if (!error) {
+          setEntities(data);
+      } else {
+          console.log(error)
+      }
+  }
+
+  useEffect(() => {
+      getInitData();
+  }, [endpoint])
+
+
+ return (
+   <>
+   
+    <FlatList
+        data={entities}
+        renderItem={({item}) => 
+        <Card>
+            <TouchableOpacity
+                onPress={()=>navitation.navigate("CustomerFormScreen" as never)}
+            >
+                <Text>
+                    {item["nombre"]}
+                </Text>
+            </TouchableOpacity>
+        </Card>
+        }
+        keyExtractor={item => item["id"]}
+      />
+    
+   
+   </>
+ )
+}

src/hooks/postBasicAuth.ts

@@ -19,7 +19,7 @@ const fecher = async (url: string, token: string) => {
       
       //url = "http://149.56.97.9:8080"+url;
       url = "http://192.168.1.21:8082"+url;
-      console.debug(url)
+      
       const response = await fecher(url, token)
       
       if (response.ok){

src/hooks/useFetchWithAuth.ts

@@ -0,0 +1,36 @@
+import AsyncStorage from '@react-native-async-storage/async-storage'
+
+const fecher = async (url: string, token: string) => {
+  return await fetch(url, {
+    method: "GET",
+    headers: { 
+      "Content-Type": "application/json",
+      "Authorization":token
+    },
+  });
+}
+
+export const useFetchWithAuth = async (url: string) => {
+
+  url=  "http://192.168.1.21:8082/api/"+url+"/";
+  const token = await AsyncStorage.getItem("token") || "";
+  let data;
+  let error;
+  try{
+    const response = await fecher(url, token)
+    if (response.ok){
+      data = await response.json();
+    }else {
+      
+      error = "Servidor: "+ ((await response.json()).trace);
+    }
+  }catch (e){
+    error = "Cliente: "+e;
+  }
+
+  return {
+    data,
+    error
+  }
+
+}

src/navigator/MainStackNavigator.tsx

@@ -23,7 +23,7 @@ export const MainStackNavitagor:FC = () => {
           headerShown: false,
         }}
       >
-        {isAuthenticated==true?(
+        {isAuthenticated==false?(
           <>          
             <Stack.Screen name="LoginScreen" component={LoginScreen} />
           </>

src/screens/customer/CustomerListScreen.tsx

@@ -1,23 +1,38 @@
 import { FC } from 'react'
-import { Text } from 'react-native'
+import { FlatList, Text, View } from 'react-native'
 import { Background } from '../../components/Background'
 import { Card } from '../../components/Card'
-import { Input } from '../../components/Input'
 import { Button } from '../../components/Button'
 import { useNavigation } from '@react-navigation/native';
+import { CardList } from '../../components/cardList/CardList'
 
 interface Props {
 }
 
 export const CustomerListScreen:FC <Props> = () => {
   const navigation = useNavigation();
+
  return (
-    <Background >
-    <Card>
-      <Text className='text-xl text-center my-4'>Listado de clientes</Text>
-      <Button title='Nuevo' onClick={()=>navigation.navigate("CustomerFormScreen" as never)} />
-    </Card>
+    <View className=''>
+      <Button title=' + ' additionalStyle='z-10 absolute bottom-2 right-0'  onClick={()=>navigation.navigate("CustomerFormScreen" as never)} />
+      <FlatList 
+      data={[""]}
+          renderItem={({item}) => 
+          <View id={item} className='flex-1 items-center'>
+            <Card>
+              <Text className='text-xl text-center my-4'>Listado de clientes</Text>
+              <CardList endpoint='cliente'/>        
+            </Card>
+            
+          </View>
+
+          }
+          keyExtractor={item => item}
+      
+      />
+      
+    </View>
 
- </Background>
+ 
  )
 }

src/screens/customer/CustomerStack.tsx

@@ -18,9 +18,9 @@ export const CustomerStack:FC <Props> = () => {
         }}
         
     >
-        {!isAuthenticated&&(
+        {isAuthenticated&&(
             <>          
-                <Stack.Screen name="CustomerListScreen" component={CustomerListScreen} />
+                <Stack.Screen name="Clientes" component={CustomerListScreen} />
                 <Stack.Screen name="CustomerFormScreen" component={CustomerFormScreen} />
             </>
         )}

src/screens/login/AuthContext.tsx

@@ -20,7 +20,6 @@ export const AuthProvider = ({ children }: {children: JSX.Element | JSX.Element[
     }
 
     const logOut = () => {
-        console.debug(isAuthenticated)
         setIsAuthenticated(false);
         AsyncStorage.clear();
         

src/screens/login/LoginScreen.tsx

@@ -33,7 +33,6 @@ export const LoginScreen:FC <Props> = ({ navigation }) => {
             if (data && data.length>0){
                 AsyncStorage.setItem("token",data);
                 signIn();
-                
             }
         }
     } catch (e) {