Deat Dockerfiles y Fix Base_URL

frontend/Dockerfile

@@ -0,0 +1,19 @@
+# --- Etapa 1: Build ---
+FROM node:20-alpine AS build
+WORKDIR /app
+COPY package*.json ./
+RUN npm install
+COPY . .
+RUN npm run build
+
+# --- Etapa 2: Producción ---
+FROM nginx:1.25-alpine
+
+# Copia los archivos estáticos construidos a la carpeta que Nginx sirve por defecto
+COPY --from=build /app/dist /usr/share/nginx/html
+
+# Copia la configuración de Nginx específica para el frontend
+COPY frontend.nginx.conf /etc/nginx/conf.d/default.conf
+
+EXPOSE 80
+CMD ["nginx", "-g", "daemon off;"]

frontend/frontend.nginx.conf

@@ -0,0 +1,10 @@
+server {
+    listen 80;
+
+    location / {
+        root   /usr/share/nginx/html;
+        index  index.html index.htm;
+        # Esta línea es crucial para que las rutas de React (SPA) funcionen
+        try_files $uri $uri/ /index.html;
+    }
+}

frontend/proxy/nginx.conf

@@ -0,0 +1,21 @@
+server {
+    listen 80;
+
+    # Pasa todas las peticiones a la API al servicio del backend
+    location /api/ {
+        proxy_pass http://inventario-api:8080/api/;
+        proxy_set_header Host $host;
+        proxy_set_header X-Real-IP $remote_addr;
+        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
+        proxy_set_header X-Forwarded-Proto $scheme;
+    }
+
+    # Pasa el resto de las peticiones al servicio del frontend
+    location / {
+        proxy_pass http://inventario-frontend:80;
+        proxy_set_header Host $host;
+        proxy_set_header X-Real-IP $remote_addr;
+        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
+        proxy_set_header X-Forwarded-Proto $scheme;
+    }
+}

frontend/src/components/GestionComponentes.tsx

@@ -2,7 +2,7 @@ import { useState, useEffect } from 'react';
 import toast from 'react-hot-toast';
 import styles from './SimpleTable.module.css';
 
-const BASE_URL = 'http://localhost:5198/api';
+const BASE_URL = '/api';
 
 // Interfaces para los diferentes tipos de datos
 interface TextValue {

frontend/src/components/GestionSectores.tsx

@@ -4,7 +4,7 @@ import type { Sector } from '../types/interfaces';
 import styles from './SimpleTable.module.css';
 import ModalSector from './ModalSector';
 
-const BASE_URL = 'http://localhost:5198/api';
+const BASE_URL = '/api';
 
 const GestionSectores = () => {
     const [sectores, setSectores] = useState<Sector[]>([]);

frontend/src/components/ModalAnadirEquipo.tsx

@@ -10,7 +10,7 @@ interface ModalAnadirEquipoProps {
   onSave: (nuevoEquipo: Omit<Equipo, 'id' | 'created_at' | 'updated_at'>) => void;
 }
 
-const BASE_URL = 'http://localhost:5198/api';
+const BASE_URL = '/api';
 
 const ModalAnadirEquipo: React.FC<ModalAnadirEquipoProps> = ({ sectores, onClose, onSave }) => {
   const [nuevoEquipo, setNuevoEquipo] = useState({

frontend/src/components/ModalAnadirUsuario.tsx

@@ -7,7 +7,7 @@ interface Props {
   onSave: (usuario: { username: string }) => void;
 }
 
-const BASE_URL = 'http://localhost:5198/api';
+const BASE_URL = '/api';
 
 const ModalAnadirUsuario: React.FC<Props> = ({ onClose, onSave }) => {
   const [username, setUsername] = useState('');

frontend/src/components/ModalDetallesEquipo.tsx

@@ -19,7 +19,7 @@ interface ModalDetallesEquipoProps {
     onAddComponent: (type: 'disco' | 'ram' | 'usuario') => void;
 }
 
-const BASE_URL = 'http://localhost:5198/api';
+const BASE_URL = '/api';
 
 const ModalDetallesEquipo: React.FC<ModalDetallesEquipoProps> = ({
     equipo, isOnline, historial, sectores, onClose, onDelete, onRemoveAssociation, onEdit, onAddComponent

frontend/src/components/SimpleTable.tsx

@@ -37,7 +37,7 @@ const SimpleTable = () => {
   const [isAddModalOpen, setIsAddModalOpen] = useState(false);
   const [addingComponent, setAddingComponent] = useState<'disco' | 'ram' | 'usuario' | null>(null);
   const [isLoading, setIsLoading] = useState(true);
-  const BASE_URL = 'http://localhost:5198/api';
+  const BASE_URL = '/api';
 
   useEffect(() => {
     const scrollBarWidth = window.innerWidth - document.documentElement.clientWidth;