From 399e01c6a88a95c2039af94a873bcb22a76c45f0 Mon Sep 17 00:00:00 2001
From: Tiago Vasconcelos <talvasconcelos@gmail.com>
Date: Tue, 14 Jul 2026 16:09:57 +0100
Subject: [PATCH] reduce ui inline conditionals

---
 lnbits/static/js/pages/account.js  | 24 ++++++++++++++++++++++++
 lnbits/templates/pages/account.vue | 30 ++++--------------------------
 2 files changed, 28 insertions(+), 26 deletions(-)

diff --git a/lnbits/static/js/pages/account.js b/lnbits/static/js/pages/account.js
index 4f2a7515e..942e9520a 100644
--- a/lnbits/static/js/pages/account.js
+++ b/lnbits/static/js/pages/account.js
@@ -222,6 +222,30 @@ window.PageAccount = {
       return this.selectedApiAcl.token_id_list.find(
         token => token.id === this.apiAcl.selectedTokenId
       )
+    },
+    expiryAt() {
+      if (this.selectedApiToken.expires_at) {
+        return `${this.$t('expiry')}: ${LNbits.utils.formatTimestamp(this.selectedApiToken.expires_at)}`
+      } else {
+        return ''
+      }
+    },
+    tokenStatus() {
+      if (this.selectedApiToken.expires_at) {
+        const now = new Date()
+        const expiresAt = new Date(this.selectedApiToken.expires_at * 1000)
+        let status = ''
+        let badgeColor = 'positive'
+        if (expiresAt < now) {
+          status = this.$t('acl_token_expired')
+          badgeColor = 'negative'
+        } else {
+          status = this.$t('acl_token_active')
+        }
+        return {status, badgeColor}
+      } else {
+        return ''
+      }
     }
   },
   methods: {
diff --git a/lnbits/templates/pages/account.vue b/lnbits/templates/pages/account.vue
index ac1a5f2e2..aa5cf9530 100644
--- a/lnbits/templates/pages/account.vue
+++ b/lnbits/templates/pages/account.vue
@@ -890,36 +890,14 @@
                         </div>
                       </div>
                       <div
-                        v-if="selectedApiToken"
+                        v-if="selectedApiToken && selectedApiToken.expires_at"
                         class="row items-center q-mb-md q-gutter-sm"
                       >
-                        <span v-text="$t('expiry') + ':'"></span>
-                        <span
-                          v-text="
-                            selectedApiToken.expires_at
-                              ? utils.formatTimestamp(
-                                  selectedApiToken.expires_at
-                                )
-                              : 'Unknown'
-                          "
-                        ></span>
+                        <span v-text="expiryAt"></span>
                         <span v-text="$t('status') + ':'"></span>
                         <q-badge
-                          :color="
-                            selectedApiToken.expires_at &&
-                            selectedApiToken.expires_at * 1000 > Date.now()
-                              ? 'positive'
-                              : selectedApiToken.expires_at
-                                ? 'negative'
-                                : 'grey'
-                          "
-                          :label="
-                            selectedApiToken.expires_at
-                              ? selectedApiToken.expires_at * 1000 > Date.now()
-                                ? 'Active'
-                                : 'Expired'
-                              : 'Unknown'
-                          "
+                          :color="tokenStatus.badgeColor"
+                          :label="tokenStatus.status"
                         ></q-badge>
                       </div>
                       <div v-if="apiAcl.apiToken" class="row q-mb-md">