Fix: API_BASE_URL to /

frontend/src/api/apiClient.ts

@@ -2,7 +2,7 @@ import axios from 'axios';
 
 // Durante el desarrollo, nuestra API corre en un puerto específico (ej. 5045).
 // En producción, esto debería apuntar a la URL real del servidor donde se despliegue la API.
-const API_BASE_URL = 'http://192.168.10.78:5045/api';
+const API_BASE_URL = '/';
 
 const apiClient = axios.create({
   baseURL: API_BASE_URL,

frontend/src/hooks/useApiData.ts

@@ -2,8 +2,7 @@ import { useState, useEffect, useCallback } from 'react';
 import apiClient from '../api/apiClient';
 import { AxiosError } from 'axios';
 
-// T es el tipo de dato que esperamos de la API (ej. CotizacionBolsa[])
-export function useApiData<T>(url: string) {
+export function useApiData<T>(endpoint: string) {
   const [data, setData] = useState<T | null>(null);
   const [loading, setLoading] = useState<boolean>(true);
   const [error, setError] = useState<string | null>(null);
@@ -12,11 +11,13 @@ export function useApiData<T>(url: string) {
     setLoading(true);
     setError(null);
     try {
-      const response = await apiClient.get<T>(url);
+      // Anteponemos '/api' a cada endpoint solicitado.
+      // Ejemplo: si el endpoint es '/mercados/granos', la URL final será '/api/mercados/granos'
+      const response = await apiClient.get<T>(`/api${endpoint}`);
       setData(response.data);
     } catch (err) {
       if (err instanceof AxiosError) {
-        setError(`Error al cargar datos: ${err.message}`);
+        setError(`Error de red o de la API: ${err.message}`);
       } else {
         setError('Ocurrió un error inesperado.');
       }
@@ -24,7 +25,7 @@ export function useApiData<T>(url: string) {
     } finally {
       setLoading(false);
     }
-  }, [url]);
+  }, [endpoint]);
 
   useEffect(() => {
     fetchData();