From 74c2a3d6e70485db3c954f321e3883e56bb725a7 Mon Sep 17 00:00:00 2001
From: Harshit Mehta <hdm23061993@gmail.com>
Date: Tue, 8 Nov 2022 19:58:13 +0530
Subject: [PATCH] Few UI Enhancements (#79)

- Add Install/Upgrade keywork dynamically on popup
- Sort Repo list alphabetically
- Sort CLuster list alphabetically

Co-authored-by: Harshit Mehta <harshitm@nvidia.com>
---
 pkg/dashboard/static/actions.js | 2 ++
 pkg/dashboard/static/index.html | 2 +-
 pkg/dashboard/static/repo.js    | 3 ++-
 pkg/dashboard/static/scripts.js | 1 +
 4 files changed, 6 insertions(+), 2 deletions(-)

diff --git a/pkg/dashboard/static/actions.js b/pkg/dashboard/static/actions.js
index 11e1a25..5535926 100644
--- a/pkg/dashboard/static/actions.js
+++ b/pkg/dashboard/static/actions.js
@@ -62,10 +62,12 @@ function popUpUpgrade(elm, ns, name, verCur, lastRev) {
     $("#upgradeModal .rel-cluster").text(getHashParam("context"))
 
     if (verCur) {
+        $("#upgradeModalLabel .type").text("Upgrade")
         $("#upgradeModal .ver-old").show().find("span").text(verCur)
         $("#upgradeModal .rel-name").prop("disabled", true).val(name)
         $("#upgradeModal .rel-ns").prop("disabled", true).val(ns)
     } else {
+        $("#upgradeModalLabel .type").text("Install")
         $("#upgradeModal .ver-old").hide()
         $("#upgradeModal .rel-name").prop("disabled", false).val(elm.name.split("/").pop())
         $("#upgradeModal .rel-ns").prop("disabled", false).val("")
diff --git a/pkg/dashboard/static/index.html b/pkg/dashboard/static/index.html
index 826fbc2..30d3b57 100644
--- a/pkg/dashboard/static/index.html
+++ b/pkg/dashboard/static/index.html
@@ -343,7 +343,7 @@
         <div class="modal-content">
             <div class="modal-header">
                 <h4 class="modal-title" id="upgradeModalLabel">
-                    Install <b class='text-success name'></b>
+                    <span class="type"></span> <b class='text-success name'></b>
                 </h4>
                 <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
             </div>
diff --git a/pkg/dashboard/static/repo.js b/pkg/dashboard/static/repo.js
index ea71103..f79cec6 100644
--- a/pkg/dashboard/static/repo.js
+++ b/pkg/dashboard/static/repo.js
@@ -6,7 +6,8 @@ function loadRepoView() {
         reportError("Failed to get list of repositories", xhr)
     }).done(function (data) {
         const items = $("#sectionRepo .repo-list ul").empty()
-
+        data.sort((a, b) => (a.name > b.name) - (a.name < b.name))
+        
         data.forEach(function (elm) {
             let opt = $('<li class="mb-2"><label><input type="radio" name="cluster" class="me-2"/><span></span></label></li>');
             opt.attr('title', elm.url)
diff --git a/pkg/dashboard/static/scripts.js b/pkg/dashboard/static/scripts.js
index 0503c4a..1960455 100644
--- a/pkg/dashboard/static/scripts.js
+++ b/pkg/dashboard/static/scripts.js
@@ -9,6 +9,7 @@ $(function () {
         reportError("Failed to get list of clusters", xhr)
     }).done(function (data) {
         const context = getHashParam("context")
+        data.sort((a, b) => (getCleanClusterName(a.Name) > getCleanClusterName(b.Name)) - (getCleanClusterName(a.Name) < getCleanClusterName(b.Name)))
         fillClusterList(data, context);
 
         initView(); // can only do it after loading cluster list