From 8a4ad9924d8cfc605aaf165ec434333c687a0df4 Mon Sep 17 00:00:00 2001
From: Joerg <joerg@dj7nt.de>
Date: Sat, 17 Jan 2026 09:54:52 +0100
Subject: [PATCH] feat: add confirmation date and service type to QSO table

Replace Status column with Confirmed column that displays both the QSL service type (LoTW) and confirmation date, making it ready for future QSL services like eQSL and ClubLog.

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
---
 src/frontend/src/routes/qsos/+page.svelte | 30 ++++++++++++++++++++---
 1 file changed, 26 insertions(+), 4 deletions(-)

diff --git a/src/frontend/src/routes/qsos/+page.svelte b/src/frontend/src/routes/qsos/+page.svelte
index 531a75e..fefdd9b 100644
--- a/src/frontend/src/routes/qsos/+page.svelte
+++ b/src/frontend/src/routes/qsos/+page.svelte
@@ -401,7 +401,7 @@
             <th>Mode</th>
             <th>Entity</th>
             <th>Grid</th>
-            <th>Status</th>
+            <th>Confirmed</th>
           </tr>
         </thead>
         <tbody>
@@ -415,10 +415,13 @@
               <td>{qso.entity || '-'}</td>
               <td>{qso.grid || '-'}</td>
               <td>
-                {#if qso.lotwQslRstatus === 'Y'}
-                  <span class="badge badge-success">Confirmed</span>
+                {#if qso.lotwQslRstatus === 'Y' && qso.lotwQslRdate}
+                  <span class="confirmation-info">
+                    <span class="service-type">LoTW</span>
+                    <span class="confirmation-date">{formatDate(qso.lotwQslRdate)}</span>
+                  </span>
                 {:else}
-                  <span class="badge badge-pending">Pending</span>
+                  -
                 {/if}
               </td>
             </tr>
@@ -742,6 +745,25 @@
     color: #856404;
   }
 
+  .confirmation-info {
+    display: flex;
+    flex-direction: column;
+    gap: 0.25rem;
+  }
+
+  .service-type {
+    font-size: 0.7rem;
+    font-weight: 600;
+    color: #4a90e2;
+    text-transform: uppercase;
+    letter-spacing: 0.5px;
+  }
+
+  .confirmation-date {
+    font-size: 0.875rem;
+    color: #333;
+  }
+
   .loading, .error, .empty {
     text-align: center;
     padding: 3rem;