Fase 1 (isla 2): estado del servidor de la portada en React/TSX

Segunda isla de la home: la tabla de estado (nombre, online, login, hora,
dirección) pasa de plantilla Django a componente React.

- API: home_status_api -> /api/home/status/ (server_name, address, expansion,
  online_characters, status). Reutiliza check_server_status y
  get_online_characters_count de views/pages.
- React: ServerStatus.tsx (fetch + reloj en vivo con setInterval, mismas clases
  CSS). El entry home.tsx ahora monta dos islas: #home-news-app y #home-status-app.
- partials/noticias.html: la <table> de estado se sustituye por el contenedor.

Verificado: check OK, ambos endpoints 200, la home monta las dos islas.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>

home/api_urls.py

@@ -4,4 +4,5 @@ from . import views
 
 urlpatterns = [
     path('home/news/', views.home_news_api, name='api_home_news'),
+    path('home/status/', views.home_status_api, name='api_home_status'),
 ]

home/templates/partials/noticias.html

@@ -8,29 +8,9 @@
                         <div class="raf-index-holder">
                             <div class="right-content" id="right-content-min">
                                 <div class="right-body">
-                                    <table class="max-center-table">
-                                        <tr>
-                                            <td class="yellow-info">{{ server.name }} <span class="blue-info small-font">{{ expansion }}<span></td>
-                                            <td class="real-info-box green-info">{{ online_characters }}</td>
-                                        </tr>
-                                        <tr>
-                                            <td>Login</td>
-                                            <td class="real-info-box {% if status == 'Online' %}green-info{% else %}red-info{% endif %}">{{ status }}</td>
-											
-                                        </tr>
-                                        <tr>	
-                                            <td>Hora</td>
-                                           <td class="real-info-box"><span id="server-time">{{ server_time }}</span></td>
-                                        </tr>
-                                        <tr>
-                                            <td colspan="2"><hr /></td>
-                                        </tr>
-                                        <tr class="centered">
-                                       <td colspan="2">
-									<p><span>{{ server.address }}</span></p>
-									</td>
-                                        </tr>
-                                    </table>
+                                    <!-- Isla React (Vite): tabla de estado del servidor,
+                                         alimentada por /api/home/status/. Reloj en vivo en TSX. -->
+                                    <div id="home-status-app"></div>
                                 </div>
                                 <div class="raf-index-responsive"><a href="recruit-a-friend">¡RECLUTA A UN AMIGO!</a></div>
                             </div>

home/views/api.py

@@ -1,4 +1,5 @@
 from ._base import *
+from .pages import check_server_status, get_online_characters_count
 
 # Endpoints JSON que alimentan las islas React/TSX del frontend (Vite).
 # Se montan bajo /api/ (fuera de i18n_patterns). De momento con JsonResponse;
@@ -19,3 +20,20 @@ def home_news_api(request):
         for n in noticias
     ]
     return JsonResponse({"noticias": data})
+
+
+def home_status_api(request):
+    """Estado del servidor para la isla de la portada (nombre, online, login, dirección)."""
+    server = ServerSelection.objects.first()
+    online = get_online_characters_count()
+    status = "Online" if (server and check_server_status(server.address, server.port)) else "Offline"
+    expansion = "WotLK" if (server and server.gamebuild == 12340) else "Cataclysm"
+    return JsonResponse(
+        {
+            "server_name": server.name if server else None,
+            "address": server.address if server else None,
+            "expansion": expansion,
+            "online_characters": online,
+            "status": status,
+        }
+    )