From a764c66070d8879ed5b1eab081092c7da9165df5 Mon Sep 17 00:00:00 2001
From: MarekWo <mwojtaszek@gmail.com>
Date: Thu, 22 Jan 2026 08:18:14 +0100
Subject: [PATCH] fix: Improve update UI and install script

- Add sudo to journalctl command in install.sh help text
- Move "Update now" link below version number to prevent line wrap
- Add "What's new?" link in update modal pointing to GitHub commits

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
---
 app/static/js/app.js       | 25 +++++++++++++++++++++----
 app/templates/base.html    | 20 ++++++++++++--------
 scripts/updater/install.sh |  6 +++---
 3 files changed, 36 insertions(+), 15 deletions(-)

diff --git a/app/static/js/app.js b/app/static/js/app.js
index 845d118..4d5f265 100644
--- a/app/static/js/app.js
+++ b/app/static/js/app.js
@@ -1352,12 +1352,21 @@ async function checkForAppUpdates() {
                 // Check if remote update is available
                 const updaterStatus = await fetch('/api/updater/status').then(r => r.json()).catch(() => ({ available: false }));
 
+                const updateLinkContainer = document.getElementById('updateLinkContainer');
+                const newVersion = `${data.latest_date}+${data.latest_commit}`;
+                const githubUrl = data.github_url;
                 if (updaterStatus.available) {
-                    // Show "Update Now" link that opens modal
-                    versionText.innerHTML = `${data.current_version} <a href="#" onclick="openUpdateModal('${data.latest_date}+${data.latest_commit}'); return false;" class="text-success" title="Click to update"><i class="bi bi-arrow-up-circle-fill"></i> Update now</a>`;
+                    // Show "Update Now" link below version
+                    if (updateLinkContainer) {
+                        updateLinkContainer.innerHTML = `<a href="#" onclick="openUpdateModal('${newVersion}', '${githubUrl}'); return false;" class="text-success" title="Click to update"><i class="bi bi-arrow-up-circle-fill"></i> Update now</a>`;
+                        updateLinkContainer.classList.remove('d-none');
+                    }
                 } else {
                     // Show link to GitHub (no remote update available)
-                    versionText.innerHTML = `${data.current_version} <a href="${data.github_url}" target="_blank" class="text-success" title="Update available: ${data.latest_date}+${data.latest_commit}"><i class="bi bi-arrow-up-circle-fill"></i> Update available</a>`;
+                    if (updateLinkContainer) {
+                        updateLinkContainer.innerHTML = `<a href="${githubUrl}" target="_blank" class="text-success" title="Update available: ${newVersion}"><i class="bi bi-arrow-up-circle-fill"></i> Update available</a>`;
+                        updateLinkContainer.classList.remove('d-none');
+                    }
                 }
                 icon.className = 'bi bi-check-circle-fill text-success';
                 showNotification(`Update available: ${data.latest_date}+${data.latest_commit}`, 'success');
@@ -1396,7 +1405,7 @@ let pendingUpdateVersion = null;
 /**
  * Open update modal and prepare for remote update
  */
-function openUpdateModal(newVersion) {
+function openUpdateModal(newVersion, githubUrl) {
     pendingUpdateVersion = newVersion;
 
     // Close offcanvas menu
@@ -1412,6 +1421,14 @@ function openUpdateModal(newVersion) {
     document.getElementById('updateReloadBtn').classList.add('d-none');
     document.getElementById('updateMessage').textContent = `New version available: ${newVersion}`;
 
+    // Set up "What's new" link
+    const whatsNewEl = document.getElementById('updateWhatsNew');
+    if (whatsNewEl && githubUrl) {
+        const link = whatsNewEl.querySelector('a');
+        if (link) link.href = githubUrl;
+        whatsNewEl.classList.remove('d-none');
+    }
+
     // Hide spinner, show message
     document.querySelector('#updateStatus .spinner-border').classList.add('d-none');
 
diff --git a/app/templates/base.html b/app/templates/base.html
index 47d6f17..c8eb5f2 100644
--- a/app/templates/base.html
+++ b/app/templates/base.html
@@ -58,14 +58,17 @@
             <h5 class="offcanvas-title"><i class="bi bi-menu-button-wide"></i> Menu</h5>
             <button type="button" class="btn-close" data-bs-dismiss="offcanvas"></button>
         </div>
-        <div class="px-3 pb-2 text-muted small border-bottom d-flex align-items-center justify-content-between">
-            <span id="versionDisplay">
-                <i class="bi bi-tag"></i> <span id="versionText">{{ version }}</span>
-                <span class="badge bg-secondary ms-1" id="branchBadge">{{ git_branch }}</span>
-            </span>
-            <button id="checkUpdateBtn" class="btn btn-sm btn-outline-secondary py-0 px-1" title="Check for updates">
-                <i class="bi bi-arrow-repeat" id="checkUpdateIcon"></i>
-            </button>
+        <div class="px-3 pb-2 text-muted small border-bottom">
+            <div class="d-flex align-items-center justify-content-between">
+                <span id="versionDisplay">
+                    <i class="bi bi-tag"></i> <span id="versionText">{{ version }}</span>
+                    <span class="badge bg-secondary ms-1" id="branchBadge">{{ git_branch }}</span>
+                </span>
+                <button id="checkUpdateBtn" class="btn btn-sm btn-outline-secondary py-0 px-1" title="Check for updates">
+                    <i class="bi bi-arrow-repeat" id="checkUpdateIcon"></i>
+                </button>
+            </div>
+            <div id="updateLinkContainer" class="d-none mt-1"></div>
         </div>
         <div class="offcanvas-body">
             <div class="list-group list-group-flush">
@@ -343,6 +346,7 @@
                             <span class="visually-hidden">Loading...</span>
                         </div>
                         <p id="updateMessage" class="mb-0">Checking for updates...</p>
+                        <p id="updateWhatsNew" class="d-none mt-2 mb-0"><a href="#" target="_blank" class="text-muted small"><i class="bi bi-github"></i> What's new?</a></p>
                     </div>
                     <div id="updateProgress" class="d-none">
                         <div class="progress mb-3" style="height: 8px;">
diff --git a/scripts/updater/install.sh b/scripts/updater/install.sh
index 30ae560..365f054 100755
--- a/scripts/updater/install.sh
+++ b/scripts/updater/install.sh
@@ -136,6 +136,6 @@ echo "The update webhook is now running on port 5050."
 echo "You can now use the 'Update' button in mc-webui GUI."
 echo ""
 echo "Useful commands:"
-echo "  systemctl status $SERVICE_NAME   # Check status"
-echo "  journalctl -u $SERVICE_NAME -f   # View logs"
-echo "  sudo $0 --uninstall              # Uninstall"
+echo "  systemctl status $SERVICE_NAME        # Check status"
+echo "  sudo journalctl -u $SERVICE_NAME -f   # View logs"
+echo "  sudo $0 --uninstall                   # Uninstall"