From a155e64ec75a02da8126bb09c169cb7a789509e4 Mon Sep 17 00:00:00 2001
From: jose-rZM <100773386+jose-rZM@users.noreply.github.com>
Date: Thu, 18 Dec 2025 11:53:44 +0100
Subject: [PATCH] Fix build history styles

---
 frontend/src/App.svelte     | 48 ++++++++++++++++++++-----------------
 frontend/src/styles/app.css |  6 ++---
 2 files changed, 29 insertions(+), 25 deletions(-)

diff --git a/frontend/src/App.svelte b/frontend/src/App.svelte
index 776835f..5e1298b 100644
--- a/frontend/src/App.svelte
+++ b/frontend/src/App.svelte
@@ -360,8 +360,7 @@ along with this program.  If not, see <https://www.gnu.org/licenses/>.
                     <p class="label">Historial</p>
                     <p class="sub">
                         Builds recientes en Jenkins. Esto lo conseguimos gracias a que Jenkins nos
-                        expone una API REST muy maja para consultar información de los jobs y
-                        builds.
+                        expone una API REST para consultar información de los jobs y builds.
                     </p>
                 </div>
                 {#if loadingHistory}
@@ -371,39 +370,44 @@ along with this program.  If not, see <https://www.gnu.org/licenses/>.
 
             {#if buildHistory.length}
                 <div class="history-list">
-                    {#each buildHistory as build}
-                        <details
-                            class={`history-item ${build.status}`}
-                            open={build === buildHistory[0]}
-                        >
+                    {#each buildHistory as build, i}
+                        <details class={`history-item ${build.status}`} open={i === 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>
+
+                                    {#if build.commits.length === 0}
+                                        <span class="muted">Ejecución manual</span>
+                                    {:else}
+                                        <span class="summary-commit">
+                                            {build.commits[0].commit} · {build.commits[0].author}
+                                        </span>
+                                    {/if}
                                 </div>
+
                                 <div class="summary-meta">
-                                    <span class="mono">#{build.commit}</span>
-                                    <span>{build.finished_at}</span>
+                                    <span>
+                                        {new Date(build.finished_at).toLocaleDateString()}
+                                    </span>
                                 </div>
                             </summary>
+
                             <div class="history-body">
-                                <p class="history-row">
-                                    <span>Autor</span>
-                                    <span>{build.author}</span>
-                                </p>
+                                {#if build.commits.length > 0}
+                                    <p class="history-row">
+                                        <span>Mensaje</span>
+                                        <span>{build.commits[0].message}</span>
+                                    </p>
+                                {/if}
+
                                 <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>
+
+                                {#if build.status === 'failure'}
+                                    <p class="history-message danger">Build fallida</p>
                                 {:else}
                                     <p class="history-message success">Correcto</p>
                                 {/if}
diff --git a/frontend/src/styles/app.css b/frontend/src/styles/app.css
index 412cea7..89e48c6 100644
--- a/frontend/src/styles/app.css
+++ b/frontend/src/styles/app.css
@@ -691,7 +691,7 @@ li {
     color: #f8fafc;
 }
 
-.summary-branch {
+.summary-commit {
     color: #a5b4fc;
     font-weight: 700;
     font-size: 0.95rem;
@@ -718,7 +718,7 @@ li {
     box-shadow: 0 0 8px rgba(34, 197, 94, 0.6);
 }
 
-.status-dot.failed {
+.status-dot.failure {
     background: #f87171;
     box-shadow: 0 0 8px rgba(248, 113, 113, 0.5);
 }
@@ -766,7 +766,7 @@ li {
     border-color: rgba(34, 197, 94, 0.3);
 }
 
-.history-item.failed {
+.history-item.failure {
     border-color: rgba(248, 113, 113, 0.35);
 }