Change bd

App.js

@@ -1,10 +1,10 @@
-import React from 'react';
+import React, { useEffect } from 'react';
 import { Button, View } from 'react-native';
 import { MenuProvider } from 'react-native-popup-menu';
 import AppNavigator from './src/navigation/AppNavigator';
+import AsyncStorage from '@react-native-async-storage/async-storage';
 
 const App = () => {
-
   return (
     <MenuProvider>
       <AppNavigator />

config.js

@@ -0,0 +1,2 @@
+// config.js
+export const BASE_URL = "http://192.168.1.2:3000"; // Will

package.json

@@ -12,36 +12,38 @@
     "@expo-google-fonts/alex-brush": "^0.2.3",
     "@expo-google-fonts/montserrat": "^0.2.3",
     "@firebase/firestore": "^4.6.0",
-    "@react-native-community/datetimepicker": "^7.6.2",
+    "@react-native-async-storage/async-storage": "^1.23.1",
+    "@react-native-community/datetimepicker": "8.0.1",
     "@react-native-firebase/analytics": "^19.0.0",
     "@react-native-firebase/app": "^19.0.0",
     "@react-native-firebase/auth": "^19.0.0",
     "@react-native-firebase/firestore": "^19.0.0",
     "@react-navigation/bottom-tabs": "^6.5.20",
     "@react-navigation/native": "^6.1.14",
     "@react-navigation/native-stack": "^6.9.22",
-    "@types/react": "^18.2.77",
+    "@types/react": "~18.2.79",
+    "axios": "^1.7.2",
     "date-fns": "^3.3.1",
-    "expo": "~50.0.15",
+    "expo": "^51.0.8",
     "expo-app-loading": "^2.1.1",
     "expo-config": "^1.0.0",
-    "expo-dev-client": "~3.3.11",
-    "expo-font": "^11.10.3",
-    "expo-sharing": "~11.10.0",
-    "expo-status-bar": "~1.11.1",
+    "expo-dev-client": "~4.0.14",
+    "expo-font": "~12.0.5",
+    "expo-sharing": "~12.0.1",
+    "expo-status-bar": "~1.12.1",
     "firebase": "^10.10.0",
     "react": "18.2.0",
     "react-hook-form": "^7.51.0",
-    "react-native": "0.73.6",
+    "react-native": "0.74.1",
     "react-native-modal": "^13.0.1",
     "react-native-popup-menu": "^0.16.1",
-    "react-native-safe-area-context": "4.8.2",
-    "react-native-screens": "~3.29.0",
-    "react-native-svg": "14.1.0",
+    "react-native-safe-area-context": "4.10.1",
+    "react-native-screens": "3.31.1",
+    "react-native-svg": "15.2.0",
     "react-native-vector-icons": "^10.0.3",
     "react-native-view-shot": "^3.8.0",
     "remixicon": "^4.2.0",
-    "typescript": "^5.4.5",
+    "typescript": "~5.3.3",
     "zustand": "^4.5.2"
   },
   "devDependencies": {

src/components/ClientDebit.js

@@ -1,10 +1,5 @@
-//ClientDebit.js
 import React from "react";
-import {
-  View,
-  Dimensions,
-  StyleSheet,
-} from "react-native";
+import { View, Dimensions, StyleSheet } from "react-native";
 import { theme } from "../assets/Theme";
 import { StatusBar } from "expo-status-bar";
 import { useNavigation } from "@react-navigation/native";
@@ -15,16 +10,16 @@ const screenWidth = Dimensions.get("window").width;
 
 const ClientDebit = ({ clientInfo }) => {
   const vBalance = parseFloat(
-    clientInfo.NotasPendientes.reduce(
-      (total, nota) => total + nota.Saldo_pendiente,
+    (clientInfo.NotasPendientes || []).reduce(
+      (total, nota) => total + (parseFloat(nota.Saldo_pendiente) || 0),
       0
     ).toFixed(2)
   );
   const navigation = useNavigation();
 
   return (
     <View style={clientDebitStyles.container}>
-      <StatusBar style="ligth" backgroundColor={theme.colors.secondary} />
+      <StatusBar style="light" backgroundColor={theme.colors.secondary} />
       <StyledText balance style={clientDebitStyles.text}> {vBalance} Bs</StyledText>
       <View style={clientDebitStyles.spaceButtons}>
         <SimpleButton

src/components/NoteItem.js

@@ -28,47 +28,55 @@ const NoteItem = ({ note, onSelect }) => {
 
   const navigation = useNavigation();
 
+  const formatDate = (dateString) => {
+    const date = new Date(dateString);
+    return date.toLocaleDateString("es-ES", {
+      year: "numeric",
+      month: "2-digit",
+      day: "2-digit",
+    });
+  };
+
   return (
     <TouchableWithoutFeedback onPress={toggleExpansion}>
-      <Animated.View
-        style={[
-          noteItemstyles.container,
-          { height: animationHeight },
-        ]}
-      >
+      <Animated.View style={[noteItemstyles.container, { height: animationHeight }]}>
         <View style={noteItemstyles.row}>
           <View>
             <StyledText boldText>{note.nro_nota}</StyledText>
-            <StyledText regularText>{note.Fecha_venta}</StyledText>
+            <StyledText regularText>{formatDate(note.Fecha_venta)}</StyledText>
           </View>
           <StyledText money>{note.Saldo_pendiente} Bs</StyledText>
           <View>
             <SimpleButton 
               text="Pagar" 
-              onPress={() => navigation.navigate("SelectPaymentMethodScreen", { note,  payMode: "normal"})}
+              onPress={() => navigation.navigate("SelectPaymentMethodScreen", { note, payMode: "normal" })}
             />
           </View>
         </View>
-        <View style={[noteItemstyles.textLine, { marginTop: 20 }]}>
-          <StyledText regularText>importe :</StyledText>
-          <StyledText regularText>{note.importe_nota} Bs.</StyledText>
-        </View>
-        <View style={noteItemstyles.textLine}>
-          <StyledText regularText>monto pagado :</StyledText>
-          <StyledText regularText>{note.Monto_pagado} Bs.</StyledText>
-        </View>
-        <View style={noteItemstyles.textLine}>
-          <StyledText regularText>saldo pendiente :</StyledText>
-          <StyledText regularText>{note.Saldo_pendiente} Bs.</StyledText>
-        </View>
-        <View style={noteItemstyles.textLine}>
-          <StyledText regularText>venta :</StyledText>
-          <StyledText regularText>{note.Fecha_venta}</StyledText>
-        </View>
-        <View style={noteItemstyles.textLine}>
-          <StyledText regularText>vencimiento :</StyledText>
-          <StyledText regularText>{note.Fecha_vence}</StyledText>
-        </View>
+        {expanded && (
+          <>
+            <View style={[noteItemstyles.textLine, { marginTop: 20 }]}>
+              <StyledText regularText>Importe:</StyledText>
+              <StyledText regularText>{note.importe_nota} Bs</StyledText>
+            </View>
+            <View style={noteItemstyles.textLine}>
+              <StyledText regularText>Monto Pagado:</StyledText>
+              <StyledText regularText>{note.Monto_pagado} Bs</StyledText>
+            </View>
+            <View style={noteItemstyles.textLine}>
+              <StyledText regularText>Saldo Pendiente:</StyledText>
+              <StyledText regularText>{note.Saldo_pendiente} Bs</StyledText>
+            </View>
+            <View style={noteItemstyles.textLine}>
+              <StyledText regularText>Fecha de Venta:</StyledText>
+              <StyledText regularText>{formatDate(note.Fecha_venta)}</StyledText>
+            </View>
+            <View style={noteItemstyles.textLine}>
+              <StyledText regularText>Fecha de Vencimiento:</StyledText>
+              <StyledText regularText>{formatDate(note.Fecha_vence)}</StyledText>
+            </View>
+          </>
+        )}
       </Animated.View>
     </TouchableWithoutFeedback>
   );
@@ -78,13 +86,13 @@ const noteItemstyles = StyleSheet.create({
   container: {
     backgroundColor: theme.colors.primary,
     paddingVertical: 15,
-    paddingHorizontal: 20,
+    paddingHorizontal: 10,
     marginVertical: 8,
     marginHorizontal: 20,
     borderWidth: 2,
     borderRadius: 20,
     borderColor: theme.colors.otherWhite,
-    overflow: 'hidden',
+    overflow: "hidden",
   },
   row: {
     flexDirection: "row",

src/navigation/AppNavigator.js

@@ -3,16 +3,16 @@ import { createNativeStackNavigator } from '@react-navigation/native-stack';
 import { createBottomTabNavigator } from '@react-navigation/bottom-tabs';
 import { NavigationContainer } from '@react-navigation/native';
 import NewScreen from '../screens/HomeScreen';
-import ClientSearchScreen from '../screens/ClientSearchScreen';
+import ClientSearchScreen from '../screens/ClientSearch/ClientSearchScreen';
 import BillScreen from '../screens/BillScreen'
 import ClientPaymentScreen from '../screens/ClientPaymentScreen';
 import PayScreen from '../screens/PayScreen';
 import AutomaticPayScreen from '../screens/AutomaticPayScreen';
 import SelectPaymentMethodScreen from '../screens/SelectPaymentMethodScreen';
 import FacturaScreen from '../screens/FacturaScreen';
 import ProfileScreen from '../screens/ProfileScreen';
-import HistoryScreen from '../screens/HistoryScreen';
-import OthersScreen from '../screens/OthersScreen';
+// import HistoryScreen from '../screens/HistoryScreen';
+// import OthersScreen from '../screens/OthersScreen';
 import ActivationScreen from '../screens/ActivationScreen';
 import LoginScreen from '../screens/LoginScreen';
 import Icon from 'react-native-vector-icons/Ionicons';
@@ -22,11 +22,11 @@ import { theme } from '../assets/Theme';
 
 const Stack = createNativeStackNavigator();
 
-const Tab = createBottomTabNavigator();
+// const Tab = createBottomTabNavigator();
 
-const TabIcon = ({ name, color, size }) => {
-  return <Icon name={name} color={color} size={size} />;
-};
+// const TabIcon = ({ name, color, size }) => {
+//   return <Icon name={name} color={color} size={size} />;
+// };
 
 
 function AppNavigator() {
@@ -39,7 +39,7 @@ function AppNavigator() {
       }}>
         <Stack.Screen 
           name="NewScreen" 
-          component={TabNavigator}
+          component={NewScreen}
         />
         <Stack.Screen 
           name="ClientSearchScreen" 
@@ -94,46 +94,46 @@ function AppNavigator() {
   );
 }
 
-function TabNavigator() {
-  return (
-    <Tab.Navigator
-    screenOptions={{
-      tabBarActiveTintColor: theme.colors.tertiary,
-      tabBarInactiveTintColor: theme.colors.slateGrey,
-      headerShown: false,
-      }}
-    >
-      <Tab.Screen
-      name="Inicio"
-      component={NewScreen}
-      options={({ route }) => ({
-        tabBarIcon: ({ focused, color, size }) => (
-          <TabIcon name={focused ? 'home' : 'home-outline'} color={color} size={size}/>
+// function TabNavigator() {
+//   return (
+//     <Tab.Navigator
+//     screenOptions={{
+//       tabBarActiveTintColor: theme.colors.tertiary,
+//       tabBarInactiveTintColor: theme.colors.slateGrey,
+//       headerShown: false,
+//       }}
+//     >
+//       <Tab.Screen
+//       name="Inicio"
+//       component={NewScreen}
+//       options={({ route }) => ({
+//         tabBarIcon: ({ focused, color, size }) => (
+//           <TabIcon name={focused ? 'home' : 'home-outline'} color={color} size={size}/>
 
-        ),
-      })}
-    />
-      <Tab.Screen
-      name="Historial"
-      component={HistoryScreen}
-      options={({ route }) => ({
-        tabBarIcon: ({ focused, color, size }) => (
-          <TabIcon name={focused ? 'newspaper' : 'newspaper-outline'} color={color} size={size} />
-        ),
-        tabBarBadge: 3, //borrar
-      })}
-    />
-      <Tab.Screen
-      name="Otros"
-      component={OthersScreen}
-      options={({ route }) => ({
-        tabBarIcon: ({ focused, color, size }) => (
-          <TabIcon name={focused ? 'menu' : 'menu-outline'} color={color} size={size} />
-        ),
-      })}
-      />
-    </Tab.Navigator>
-  );
-}
+//         ),
+//       })}
+//     />
+//       <Tab.Screen
+//       name="Historial"
+//       component={HistoryScreen}
+//       options={({ route }) => ({
+//         tabBarIcon: ({ focused, color, size }) => (
+//           <TabIcon name={focused ? 'newspaper' : 'newspaper-outline'} color={color} size={size} />
+//         ),
+//         tabBarBadge: 3, //borrar
+//       })}
+//     />
+//       <Tab.Screen
+//       name="Otros"
+//       component={OthersScreen}
+//       options={({ route }) => ({
+//         tabBarIcon: ({ focused, color, size }) => (
+//           <TabIcon name={focused ? 'menu' : 'menu-outline'} color={color} size={size} />
+//         ),
+//       })}
+//       />
+//     </Tab.Navigator>
+//   );
+// }
 
 export default AppNavigator;