Changed User View and Ticket View

public/index.html

@@ -5,8 +5,8 @@
   <meta name="viewport" content="width=device-width, initial-scale=1.0" />
   <title>Laila Dashboard - Ticket System!</title>
   <link rel="icon" type="image/x-icon" href="/assets/favicon.ico">
-  <link rel="stylesheet" href="user.css" />
-  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css" />
+  <link rel="stylesheet" href="user.css?v=1.3" />
+  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css?v=1.3" />
 </head>
 <body>
   <div class="container">
@@ -133,7 +133,7 @@
     </button>
   </nav>
 
-  <script src="user-script.js"></script>
-  <script src="version.js"></script>
+  <script src="user-script.js?v=1.3"></script>
+  <script src="version.js?v=1.3"></script>
 </body>
 </html>

public/ticketview/ticket-shared.js

@@ -55,7 +55,7 @@ export function escapeHtml(str) {
 export function linkify(text) {
   const escaped = escapeHtml(text);
   const urlPattern = /(\bhttps?:\/\/[^\s<]+)/g;
-  return escaped.replace(urlPattern, '<a href="$1" target="_blank" rel="noopener noreferrer">$1</a>');
+  return escaped.replace(urlPattern, '<a href="$1" target="_blank" rel="noopener noreferrer">$1</a>').replace(/\n/g, '<br>');
 }
 
 export function formatDateTime(date) {

public/user-script.js

@@ -234,10 +234,11 @@ document.addEventListener('DOMContentLoaded', () => {
       const el = document.createElement('div');
       el.className = `ticket status-${statusSafe.replace(/\s+/g, '-')}`;
       el.innerHTML = `
-        <h3>${escapeHtml(ticket.title)} <span class="ticket-id">#${ticket.id}</span> <small class="total-time">Time: (${ticket.total_time} min)</small></h3>
+        <h3>${escapeHtml(ticket.title)} <span class="ticket-id">#${ticket.id}</span></h3>
         <p class="description">${escapeHtml(ticket.description)}</p>
         <div class="meta">
           <span class="date"><i class="fas fa-calendar"></i> ${formatDate(ticket.created_at)}</span>
+          <span class="total-time"><i class="fas fa-clock"></i> ${ticket.total_time} min</span>
         </div>
         <div class="status-row">
           <div class="status status-${statusSafe.replace(/\s+/g, '-')}">

public/user.css

@@ -406,9 +406,8 @@ a:hover, a:focus {
 }
 
 .total-time {
-  font-size: 0.8em;
+  font-size: inherit;
   color: var(--neutral-light);
-  margin-left: 8px;
 }
 
 /* ===== BADGES ===== */

public/version.js

@@ -1,9 +1,29 @@
-// Fetches app version and updates all footer texts
-fetch('/api/version')
-  .then(res => res.json())
-  .then(({ version }) => {
-    document.querySelectorAll('.app-footer-text').forEach(el => {
-      el.textContent = `Ticket System by Honey v${version} © 2026`;
-    });
-  })
-  .catch(() => {});
+// Auto cache-busting: detects version changes and forces reload
+(function() {
+  fetch('/api/version')
+    .then(res => res.json())
+    .then(({ version }) => {
+      const storedVersion = localStorage.getItem('app_version');
+
+      // Version changed → force hard reload
+      if (storedVersion && storedVersion !== version) {
+        localStorage.setItem('app_version', version);
+        // Clear caches if available
+        if ('caches' in window) {
+          caches.keys().then(names => names.forEach(name => caches.delete(name)));
+        }
+        window.location.reload(true);
+        return;
+      }
+
+      // Store current version
+      localStorage.setItem('app_version', version);
+
+      // Update footer
+      const year = new Date().getFullYear();
+      document.querySelectorAll('.app-footer-text').forEach(el => {
+        el.textContent = `Ticket System by Honey v${version} © ${year}`;
+      });
+    })
+    .catch(() => {});
+})();

server.js

@@ -28,6 +28,11 @@ const APP_VERSION = pkg.version || '0.0.0';
 app.use(cors());
 app.use(express.json());
 app.use(express.urlencoded({ extended: false }));
+// Never cache version.js — ensures auto cache-busting works
+app.get('/version.js', (req, res, next) => {
+  res.set('Cache-Control', 'no-store, no-cache, must-revalidate');
+  next();
+});
 app.use(express.static(path.join(__dirname, 'public')));
 app.use('/assets', express.static(path.join(__dirname, 'assets')));
 
@@ -304,6 +309,7 @@ app.get('/api/categories', (_req, res) => {
 
 // GET app version
 app.get('/api/version', (_req, res) => {
+  res.set('Cache-Control', 'no-store');
   res.json({ version: APP_VERSION });
 });