From abb69cc700c89ad0d11bcf1984e4462f6f7e7498 Mon Sep 17 00:00:00 2001
From: "Jakub A. W" <jakubwasek@gmail.com>
Date: Mon, 20 Jul 2026 17:56:19 +0200
Subject: [PATCH] chore: added a helper for retention period

---
 .../admin/dashboard/static/css/dashboard.css  |  6 +++-
 .../dashboard/static/js/modules/audit-list.js | 25 +++++++++++++++--
 .../static/js/modules/audit-list.test.cjs     | 28 +++++++++++++++++++
 .../js/modules/dashboard-layout.test.cjs      |  5 +++-
 .../dashboard/templates/page-audit-logs.html  |  8 ++++--
 5 files changed, 65 insertions(+), 7 deletions(-)

diff --git a/internal/admin/dashboard/static/css/dashboard.css b/internal/admin/dashboard/static/css/dashboard.css
index 68a7ec55..a4ccc459 100644
--- a/internal/admin/dashboard/static/css/dashboard.css
+++ b/internal/admin/dashboard/static/css/dashboard.css
@@ -3227,11 +3227,15 @@ textarea:focus {
 
 /* Audit Log Section */
 .audit-retention-note {
-  margin-top: 5px;
   color: var(--text-muted);
   font-size: 13px;
 }
 
+.audit-retention-highlight {
+  color: var(--text);
+  font-weight: 600;
+}
+
 .audit-log-section {
   background: var(--bg-surface);
   border: 1px solid var(--border);
diff --git a/internal/admin/dashboard/static/js/modules/audit-list.js b/internal/admin/dashboard/static/js/modules/audit-list.js
index 76be97ad..a8ed3c82 100644
--- a/internal/admin/dashboard/static/js/modules/audit-list.js
+++ b/internal/admin/dashboard/static/js/modules/audit-list.js
@@ -123,17 +123,36 @@
             : null;
 
         return {
-            auditRetentionText() {
+            _auditRetentionDays() {
                 const raw = this.workflowRuntimeConfig && this.workflowRuntimeConfig.LOGGING_RETENTION_DAYS;
-                if (raw === undefined || raw === null || String(raw).trim() === '') return '';
+                if (raw === undefined || raw === null || String(raw).trim() === '') return null;
 
                 const days = Number(raw);
-                if (!Number.isInteger(days) || days < 0) return '';
+                if (!Number.isInteger(days) || days < 0) return null;
+                return days;
+            },
+
+            auditRetentionText() {
+                const days = this._auditRetentionDays();
+                if (days === null) return '';
                 if (days === 0) return 'Audit logs are retained indefinitely.';
                 if (days === 1) return 'Audit logs are retained for 1 day.';
                 return 'Audit logs are retained for ' + days + ' days.';
             },
 
+            auditRetentionPrefix() {
+                const days = this._auditRetentionDays();
+                if (days === null) return '';
+                return days === 0 ? 'Audit logs are retained ' : 'Audit logs are retained for ';
+            },
+
+            auditRetentionHighlight() {
+                const days = this._auditRetentionDays();
+                if (days === null) return '';
+                if (days === 0) return 'indefinitely';
+                return days === 1 ? '1 day' : days + ' days';
+            },
+
             _auditQueryStr() {
                 if (this.customStartDate && this.customEndDate) {
                     return 'start_date=' + this._formatDate(this.customStartDate) +
diff --git a/internal/admin/dashboard/static/js/modules/audit-list.test.cjs b/internal/admin/dashboard/static/js/modules/audit-list.test.cjs
index 97030954..26833568 100644
--- a/internal/admin/dashboard/static/js/modules/audit-list.test.cjs
+++ b/internal/admin/dashboard/static/js/modules/audit-list.test.cjs
@@ -60,6 +60,34 @@ test('auditRetentionText hides missing or invalid retention values', () => {
     assert.equal(module.auditRetentionText(), '');
 });
 
+test('auditRetentionPrefix and auditRetentionHighlight split finite and indefinite retention', () => {
+    const module = createAuditListModule();
+
+    module.workflowRuntimeConfig = { LOGGING_RETENTION_DAYS: '30' };
+    assert.equal(module.auditRetentionPrefix(), 'Audit logs are retained for ');
+    assert.equal(module.auditRetentionHighlight(), '30 days');
+
+    module.workflowRuntimeConfig.LOGGING_RETENTION_DAYS = '1';
+    assert.equal(module.auditRetentionPrefix(), 'Audit logs are retained for ');
+    assert.equal(module.auditRetentionHighlight(), '1 day');
+
+    module.workflowRuntimeConfig.LOGGING_RETENTION_DAYS = '0';
+    assert.equal(module.auditRetentionPrefix(), 'Audit logs are retained ');
+    assert.equal(module.auditRetentionHighlight(), 'indefinitely');
+});
+
+test('auditRetentionPrefix and auditRetentionHighlight hide missing or invalid retention values', () => {
+    const module = createAuditListModule();
+
+    module.workflowRuntimeConfig = {};
+    assert.equal(module.auditRetentionPrefix(), '');
+    assert.equal(module.auditRetentionHighlight(), '');
+
+    module.workflowRuntimeConfig.LOGGING_RETENTION_DAYS = '-1';
+    assert.equal(module.auditRetentionPrefix(), '');
+    assert.equal(module.auditRetentionHighlight(), '');
+});
+
 test('auditRequestPane returns the shared request-pane contract', () => {
     const module = createAuditListModule();
     const entry = {
diff --git a/internal/admin/dashboard/static/js/modules/dashboard-layout.test.cjs b/internal/admin/dashboard/static/js/modules/dashboard-layout.test.cjs
index c5fe94c3..4856db1c 100644
--- a/internal/admin/dashboard/static/js/modules/dashboard-layout.test.cjs
+++ b/internal/admin/dashboard/static/js/modules/dashboard-layout.test.cjs
@@ -864,11 +864,14 @@ test("audit toolbar uses a full-width search row above the select row with a rig
 
   assert.match(
     indexTemplate,
-    /<h2>Audit Logs<\/h2>\s*<p class="audit-retention-note" x-show="auditRetentionText\(\)" x-text="auditRetentionText\(\)"><\/p>/,
+    /copyId: 'audit-retention-help-copy'[\s\S]*If you want to change the retention period, set LOGGING_RETENTION_DAYS \(env var\) or logging\.retention_days \(config\.yaml\) and restart the gateway\. Default is 30 days; 0 keeps audit logs forever\.[\s\S]*<h2>Audit Logs<\/h2>[\s\S]*<div class="inline-help-title-row" x-show="auditRetentionText\(\)">[\s\S]*<p class="audit-retention-note"><span x-text="auditRetentionPrefix\(\)"><\/span><span class="audit-retention-highlight" x-text="auditRetentionHighlight\(\)"><\/span>\.<\/p>[\s\S]*{{template "inline-help-toggle" \.}}[\s\S]*<p :id="copyId" class="inline-help-copy" x-show="open" x-transition\.opacity\.duration\.200ms x-text="text"><\/p>/,
   );
   const retentionRule = readCSSRule(css, ".audit-retention-note");
   assert.match(retentionRule, /color:\s*var\(--text-muted\)/);
   assert.match(retentionRule, /font-size:\s*13px/);
+  const highlightRule = readCSSRule(css, ".audit-retention-highlight");
+  assert.match(highlightRule, /color:\s*var\(--text\)/);
+  assert.match(highlightRule, /font-weight:\s*600/);
 
   assert.match(
     indexTemplate,
diff --git a/internal/admin/dashboard/templates/page-audit-logs.html b/internal/admin/dashboard/templates/page-audit-logs.html
index 7d00b52a..66f882ba 100644
--- a/internal/admin/dashboard/templates/page-audit-logs.html
+++ b/internal/admin/dashboard/templates/page-audit-logs.html
@@ -3,9 +3,13 @@
 <template x-if="page==='audit-logs'">
 <div>
     <div class="page-header">
-        <div>
+        <div class="inline-help-section" x-data="{ open: false, copyId: 'audit-retention-help-copy', showLabel: 'Show retention help', hideLabel: 'Hide retention help', text: 'If you want to change the retention period, set LOGGING_RETENTION_DAYS (env var) or logging.retention_days (config.yaml) and restart the gateway. Default is 30 days; 0 keeps audit logs forever.' }">
             <h2>Audit Logs</h2>
-            <p class="audit-retention-note" x-show="auditRetentionText()" x-text="auditRetentionText()"></p>
+            <div class="inline-help-title-row" x-show="auditRetentionText()">
+                <p class="audit-retention-note"><span x-text="auditRetentionPrefix()"></span><span class="audit-retention-highlight" x-text="auditRetentionHighlight()"></span>.</p>
+                {{template "inline-help-toggle" .}}
+            </div>
+            <p :id="copyId" class="inline-help-copy" x-show="open" x-transition.opacity.duration.200ms x-text="text"></p>
         </div>
         <div class="page-header-controls">
             {{template "date-picker" .}}