Check for newer version available (#47)

* Add helm version requirement notes

* Check for newer version and offer upgrade

* fix lint

pkg/dashboard/static/datadog.js

@@ -5,8 +5,8 @@
 })(window,document,'script','https://www.datadoghq-browser-agent.com/datadog-rum-v4.js','DD_RUM')
     DD_RUM.onReady(function() {
         const xhr = new XMLHttpRequest();
-        xhr.onreadystatechange = function() {
-            const version = xhr.responseText;
+        xhr.onload = function() {
+            const version = JSON.parse(xhr.responseText).VerCur;
             if (xhr.readyState === XMLHttpRequest.DONE && version!=="dev") {
                 DD_RUM.init({
                     clientToken: 'pub16d64cd1c00cf073ce85af914333bf72',

pkg/dashboard/static/index.html

@@ -54,8 +54,11 @@
                     <a class="nav-link px-3 section-repo">Repository</a>
                 </li>
                 <li class="nav-item dropdown">
-                    <a class="nav-link dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown"
+                    <a class="nav-link dropdown-toggle" role="button" data-bs-toggle="dropdown"
                        aria-expanded="false">
+                        <span class="position-absolute top-50 start-0 translate-middle p-1 bg-danger border border-light rounded-circle new-version-pill display-none">
+                            <span class="visually-hidden">New version</span>
+                        </span>
                         Help
                     </a>
                     <ul class="dropdown-menu fs-80">
@@ -67,6 +70,13 @@
                             <hr class="dropdown-divider">
                         </li>
                         <li><a class="dropdown-item disabled" href="#">Version <span id="toolVersion"></span></a></li>
+                        <li class="">
+                            <a class="dropdown-item position-relative" href="https://github.com/komodorio/helm-dashboard#installing" target="_blank">
+                            <span class="position-absolute top-50 start-0 translate-middle p-1 bg-danger border border-light rounded-circle new-version-pill display-none">
+                                <span class="visually-hidden">New version</span>
+                            </span>
+                            Upgrade to <span id="toolVersionUpgrade"></span>
+                        </a></li>
                     </ul>
                 </li>
 

pkg/dashboard/static/scripts.js

@@ -22,7 +22,7 @@ $(function () {
         }
     })
 
-    $.get("/status").fail(function (xhr) {
+    $.getJSON("/status").fail(function (xhr) {
         reportError("Failed to get tool version", xhr)
     }).done(function (data) {
         fillToolVersion(data)
@@ -51,18 +51,20 @@ function initView() {
 $("#topNav ul a").click(function () {
     const self = $(this)
 
+    if (self.hasClass("section-repo")) {
+        setHashParam("section", "repository")
+    } else if (self.hasClass("section-installed")) {
+        setHashParam("section", null)
+    } else {
+        return
+    }
+
     $("#topNav ul a").removeClass("active")
 
     const ctx = getHashParam("context")
     setHashParam(null, null)
     setHashParam("context", ctx)
 
-    if (self.hasClass("section-repo")) {
-        setHashParam("section", "repository")
-    } else {
-        setHashParam("section", null)
-    }
-
     initView()
 })
 
@@ -192,6 +194,14 @@ $(".bi-power").click(function () {
 })
 
 function isNewerVersion(oldVer, newVer) {
+    if (oldVer && oldVer[0] === 'v') {
+        oldVer = oldVer.substring(1)
+    }
+
+    if (newVer && newVer[0] === 'v') {
+        newVer = newVer.substring(1)
+    }
+
     const oldParts = oldVer.split('.')
     const newParts = newVer.split('.')
     for (let i = 0; i < newParts.length; i++) {
@@ -204,5 +214,9 @@ function isNewerVersion(oldVer, newVer) {
 }
 
 function fillToolVersion(data) {
-    $("#toolVersion").append($('<a>' + data + '</a>'))
+    $("#toolVersion").text(data.CurVer)
+    if (isNewerVersion(data.CurVer, data.LatestVer)) {
+        $("#toolVersionUpgrade").text(data.LatestVer)
+        $(".new-version-pill").show()
+    }
 }