From d076bff10c00953dda5225bca641b478888c2ec1 Mon Sep 17 00:00:00 2001
From: Alexander Schmidt <alexander@schmidt.eco>
Date: Sat, 7 Feb 2026 10:05:14 +0100
Subject: [PATCH] refactor: use status field instead of expires_at for expired
 badge on listing cards

---
 js/components/listing-card.js           | 7 +++----
 js/components/pages/page-my-listings.js | 2 +-
 2 files changed, 4 insertions(+), 5 deletions(-)

diff --git a/js/components/listing-card.js b/js/components/listing-card.js
index 3f75787..44fc2b1 100644
--- a/js/components/listing-card.js
+++ b/js/components/listing-card.js
@@ -7,7 +7,7 @@ let cachedRates = null
 
 class ListingCard extends HTMLElement {
     static get observedAttributes() {
-        return ['listing-id', 'title', 'price', 'currency', 'location', 'image', 'owner-id', 'payment-status', 'expires-at']
+        return ['listing-id', 'title', 'price', 'currency', 'location', 'image', 'owner-id', 'payment-status', 'status']
     }
 
     constructor() {
@@ -130,11 +130,10 @@ class ListingCard extends HTMLElement {
         ` : ''
         
         const paymentStatus = this.getAttribute('payment-status')
-        const expiresAt = this.getAttribute('expires-at')
-        const isExpired = expiresAt && new Date(expiresAt) < new Date()
+        const status = this.getAttribute('status')
 
         let paymentBadge = ''
-        if (isExpired) {
+        if (status === 'archived') {
             paymentBadge = /* html */`<span class="payment-badge payment-expired">${t('myListings.status.expired')}</span>`
         } else if (paymentStatus === 'processing' || paymentStatus === 'pending') {
             paymentBadge = /* html */`<span class="payment-badge payment-processing"><span class="pulse-dot"></span>${t('myListings.status.processing')}</span>`
diff --git a/js/components/pages/page-my-listings.js b/js/components/pages/page-my-listings.js
index 4846176..25e93a3 100644
--- a/js/components/pages/page-my-listings.js
+++ b/js/components/pages/page-my-listings.js
@@ -227,7 +227,7 @@ class PageMyListings extends HTMLElement {
                         image="${imageUrl}"
                         owner-id="${listing.user_created || ''}"
                         payment-status="${listing.payment_status || ''}"
-                        expires-at="${listing.expires_at || ''}"
+                        status="${listing.status || ''}"
                     ></listing-card>
                 </div>
             `