Ruff fix

backend/app/data/build_history.json

@@ -0,0 +1,44 @@
+{
+    "builds": [
+        {
+            "number": 205,
+            "status": "success",
+            "branch": "main",
+            "commit": "9ac3f91",
+            "author": "Miau",
+            "finished_at": "2024-05-04T10:20:00Z",
+            "duration_seconds": 312
+        },
+        {
+            "number": 204,
+            "status": "failed",
+            "branch": "feature/nosetioestoesunmock",
+            "commit": "75c4ba2",
+            "author": "Miau",
+            "finished_at": "2024-05-04T09:50:00Z",
+            "duration_seconds": 188,
+            "failed_stage": "tests",
+            "fun_message": "woops"
+        },
+        {
+            "number": 203,
+            "status": "failed",
+            "branch": "main",
+            "commit": "512ca7e",
+            "author": "Miau",
+            "finished_at": "2024-05-04T09:10:00Z",
+            "duration_seconds": 140,
+            "failed_stage": "lint",
+            "fun_message": "Nadie pasa en local el linter"
+        },
+        {
+            "number": 202,
+            "status": "success",
+            "branch": "hotfix/tehedichoqueestoesunmock?",
+            "commit": "c73d8ab",
+            "author": "Miau",
+            "finished_at": "2024-05-03T18:30:00Z",
+            "duration_seconds": 276
+        }
+    ]
+}

backend/app/main.py

@@ -3,6 +3,7 @@ import time
 from fastapi import FastAPI
 from fastapi.middleware.cors import CORSMiddleware
 
+from app.services.builds import build_history
 from app.services.menu import build_menu
 from app.services.prices import prices_payload, random_price
 from app.settings import settings
@@ -55,3 +56,8 @@ def prices():
 @app.get("/prices/{item}")
 def price_for_item(item: str):
     return random_price(item)
+
+
+@app.get("/builds")
+def builds():
+    return build_history()

backend/app/services/builds.py

@@ -0,0 +1,22 @@
+import json
+from pathlib import Path
+from typing import Dict, List
+
+DATA_DIR = Path(__file__).resolve().parent.parent / "data"
+
+
+def _load_json(filename: str) -> Dict:
+    path = DATA_DIR / filename
+    with open(path, encoding="utf-8") as file:
+        return json.load(file)
+
+
+def _sort_builds(builds: List[Dict]) -> List[Dict]:
+    return sorted(builds, key=lambda build: build.get("number", 0), reverse=True)
+
+
+def build_history() -> Dict:
+    """Return Jenkins build history data."""
+    history = _load_json("build_history.json")
+    builds = history.get("builds", [])
+    return {"builds": _sort_builds(builds)}

backend/tests/test_api.py

@@ -34,3 +34,24 @@ def test_prices_random_list():
     first = items[0]
     assert "item" in first and "price" in first and "currency" in first
     assert all(item["price"] <= 3 for item in items)
+
+
+def test_build_history():
+    response = client.get("/builds")
+    assert response.status_code == 200
+    body = response.json()
+    builds = body["builds"]
+    assert isinstance(builds, list)
+    assert len(builds) >= 1
+
+    first = builds[0]
+    assert "number" in first and "status" in first and "branch" in first
+
+    # Ensure descending order by build number
+    numbers = [build["number"] for build in builds]
+    assert numbers == sorted(numbers, reverse=True)
+
+    failed_builds = [build for build in builds if build["status"] == "failed"]
+    if failed_builds:
+        failed = failed_builds[0]
+        assert "failed_stage" in failed and "fun_message" in failed

frontend/src/App.svelte

@@ -1,7 +1,7 @@
 <script>
     import { onMount } from 'svelte';
     import { API_BASE, ENABLE_POLLING } from './config';
-    import { getCiStatus, getMenu, getPrices } from './services/api';
+    import { getBuildHistory, getCiStatus, getMenu, getPrices } from './services/api';
     import { prettify } from './utils/text';
 
     let menu = null;
@@ -11,6 +11,8 @@
     let errorMessage = '';
     let ciStatus = null;
     let loadingCiStatus = true;
+    let buildHistory = [];
+    let loadingHistory = true;
 
     async function fetchMenu() {
         loadingMenu = true;
@@ -45,8 +47,20 @@
         }
     }
 
+    async function fetchBuildHistory() {
+        loadingHistory = true;
+        try {
+            const history = await getBuildHistory();
+            buildHistory = history.builds || [];
+        } catch (error) {
+            errorMessage = `No pudimos leer el historial CI: ${error.message}`;
+        } finally {
+            loadingHistory = false;
+        }
+    }
+
     async function loadInitialData() {
-        await Promise.all([fetchMenu(), fetchPrices(), fetchCiStatus()]);
+        await Promise.all([fetchMenu(), fetchPrices(), fetchCiStatus(), fetchBuildHistory()]);
     }
     onMount(() => {
         loadInitialData();
@@ -55,10 +69,12 @@
 
         const pricesInterval = setInterval(fetchPrices, 8000);
         const ciInterval = setInterval(fetchCiStatus, 10000);
+        const historyInterval = setInterval(fetchBuildHistory, 15000);
 
         return () => {
             clearInterval(pricesInterval);
             clearInterval(ciInterval);
+            clearInterval(historyInterval);
         };
     });
 </script>
@@ -246,6 +262,63 @@
             {/if}
         </article>
 
+        <article class="card history-card">
+            <div class="card-head">
+                <div>
+                    <p class="label">Historial</p>
+                    <p class="sub">Builds recientes en Jenkins</p>
+                </div>
+                {#if loadingHistory}
+                    <span class="tag">actualizando...</span>
+                {/if}
+            </div>
+
+            {#if buildHistory.length}
+                <div class="history-list">
+                    {#each buildHistory as build}
+                        <details class={`history-item ${build.status}`} open={build === buildHistory[0]}>
+                            <summary>
+                                <div class="summary-left">
+                                    <span class={`status-dot ${build.status}`}></span>
+                                    <span class="summary-title">#{build.number}</span>
+                                    <span class="summary-branch">{build.branch}</span>
+                                </div>
+                                <div class="summary-meta">
+                                    <span class="mono">#{build.commit}</span>
+                                    <span>{build.finished_at}</span>
+                                </div>
+                            </summary>
+                            <div class="history-body">
+                                <p class="history-row">
+                                    <span>Autor</span>
+                                    <span>{build.author}</span>
+                                </p>
+                                <p class="history-row">
+                                    <span>Duración</span>
+                                    <span>{build.duration_seconds} s</span>
+                                </p>
+                                {#if build.status === 'failed'}
+                                    <p class="history-row">
+                                        <span>Stage</span>
+                                        <span class="chip danger">{build.failed_stage}</span>
+                                    </p>
+                                    <p class="history-message">
+                                        {build.fun_message}
+                                    </p>
+                                {:else}
+                                    <p class="history-message success">
+                                        Correcto
+                                    </p>
+                                {/if}
+                            </div>
+                        </details>
+                    {/each}
+                </div>
+            {:else if !loadingHistory}
+                <p>No hay builds registradas aún.</p>
+            {/if}
+        </article>
+
         <article class="card">
             <div class="card-head">
                 <div class="label">Desayunos</div>

frontend/src/services/api.js

@@ -20,3 +20,7 @@ export async function getPrices() {
 export async function getCiStatus() {
     return getJson('/health');
 }
+
+export async function getBuildHistory() {
+    return getJson('/builds');
+}

frontend/src/styles/app.css

@@ -477,3 +477,132 @@ li {
 .mono {
     font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
 }
+
+.history-card {
+    background: linear-gradient(180deg, #0f172a, #0c1228);
+}
+
+.history-list {
+    display: flex;
+    flex-direction: column;
+    gap: 0.6rem;
+}
+
+.history-item {
+    border: 1px solid rgba(255, 255, 255, 0.06);
+    border-radius: 12px;
+    background: rgba(255, 255, 255, 0.02);
+    overflow: hidden;
+    transition: border-color 160ms ease, box-shadow 160ms ease;
+}
+
+.history-item summary {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    gap: 0.8rem;
+    padding: 0.75rem 0.9rem;
+    list-style: none;
+    cursor: pointer;
+}
+
+.history-item summary::-webkit-details-marker {
+    display: none;
+}
+
+.summary-left {
+    display: flex;
+    align-items: center;
+    gap: 0.55rem;
+    flex-wrap: wrap;
+}
+
+.summary-title {
+    font-weight: 800;
+    color: #f8fafc;
+}
+
+.summary-branch {
+    color: #a5b4fc;
+    font-weight: 700;
+    font-size: 0.95rem;
+}
+
+.summary-meta {
+    display: flex;
+    gap: 0.6rem;
+    flex-wrap: wrap;
+    color: #cbd5f5;
+    font-size: 0.9rem;
+    justify-content: flex-end;
+}
+
+.status-dot {
+    width: 10px;
+    height: 10px;
+    border-radius: 50%;
+    display: inline-block;
+}
+
+.status-dot.success {
+    background: #22c55e;
+    box-shadow: 0 0 8px rgba(34, 197, 94, 0.6);
+}
+
+.status-dot.failed {
+    background: #f87171;
+    box-shadow: 0 0 8px rgba(248, 113, 113, 0.5);
+}
+
+.history-body {
+    padding: 0.75rem 0.9rem 0.9rem;
+    border-top: 1px solid rgba(255, 255, 255, 0.05);
+    display: flex;
+    flex-direction: column;
+    gap: 0.35rem;
+}
+
+.history-row {
+    margin: 0;
+    display: flex;
+    justify-content: space-between;
+    font-weight: 700;
+    color: #e2e8f0;
+}
+
+.history-row span:last-child {
+    color: #cbd5f5;
+}
+
+.history-message {
+    margin: 0.2rem 0 0;
+    background: rgba(248, 113, 113, 0.12);
+    border: 1px dashed rgba(248, 113, 113, 0.5);
+    padding: 0.5rem 0.75rem;
+    border-radius: 10px;
+    color: #fecaca;
+}
+
+.history-message.success {
+    background: rgba(34, 197, 94, 0.12);
+    border-color: rgba(34, 197, 94, 0.4);
+    color: #bbf7d0;
+}
+
+.history-item[open] {
+    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.28);
+}
+
+.history-item.success {
+    border-color: rgba(34, 197, 94, 0.3);
+}
+
+.history-item.failed {
+    border-color: rgba(248, 113, 113, 0.35);
+}
+
+.chip.danger {
+    background: rgba(248, 113, 113, 0.2);
+    color: #fecdd3;
+    border: 1px solid rgba(248, 113, 113, 0.4);
+}