[pve-devel] [PATCH v2 pve-manager 08/10] ui: ceph: osd: rework rendering of version field & show build commit

[Max Carrara]

The logic of the `render_version` function is split up in order to
handle how the version is displayed depending on the type of the row.

If the parsed version is `undefined` or the row marks the beginning of
the tree, an empty string is now returned. This behaviour is
equivalent to before, it just makes the overall logic easier.

If the row belongs to a node, the build commit is now additionally
displayed in parentheses next to the installed Ceph version:

  18.2.2 (abcd1234)

If the row belongs to an osd, the build commit is also additionally
displayed in parentheses next to the installed Ceph version.
Furthermore, should the build commit of the running osd differ from
the one that's installed on the host, the new hash will also be shown
in parentheses:

  18.2.2 (abcd1234 -> 5678fedc)

The icon displayed for running an osd with an outdated build is the
same as for running an outdated version. The conditional display of
cluster health-related icons remains the same otherwise.

Signed-off-by: Max Carrara <m.carrara at proxmox.com>
Tested-by: Lukas Wagner <l.wagner at proxmox.com>
Reviewed-by: Lukas Wagner <l.wagner at proxmox.com>
---
Changes v1 --> v2:
  * use camelCase instead of snake_case (thanks Lukas!)
  * use more descriptive variable names (thanks Lukas!)
  * use `let` instead of `const` for variables where applicable (thanks Lukas!)

 www/manager6/ceph/OSD.js | 56 +++++++++++++++++++++++++++++++++-------
 1 file changed, 47 insertions(+), 9 deletions(-)

diff --git a/www/manager6/ceph/OSD.js b/www/manager6/ceph/OSD.js
index d2caafa4..37fe6a9c 100644
--- a/www/manager6/ceph/OSD.js
+++ b/www/manager6/ceph/OSD.js
@@ -642,23 +642,61 @@ Ext.define('PVE.node.CephOsdTree', {
 	},
 
 	render_version: function(value, metadata, rec) {
+	    if (value === undefined || rec.data.type === 'root') {
+		return '';
+	    }
+
 	    let vm = this.getViewModel();
-	    let versions = vm.get('versions');
 	    let icon = "";
-	    let version = value || "";
 	    let maxversion = vm.get('maxversion');
-	    if (value && PVE.Utils.compare_ceph_versions(value, maxversion) !== 0) {
-		let host_version = rec.parentNode?.data?.version || versions[rec.data.host] || "";
-		if (rec.data.type === 'host' || PVE.Utils.compare_ceph_versions(host_version, maxversion) !== 0) {
+	    let mixedversions = vm.get('mixedversions');
+
+	    if (rec.data.type === 'host') {
+		let buildCommit = rec.data.buildcommit ?? '';
+
+		if (PVE.Utils.compare_ceph_versions(maxversion, value) > 0) {
 		    icon = PVE.Utils.get_ceph_icon_html('HEALTH_UPGRADE');
-		} else {
-		    icon = PVE.Utils.get_ceph_icon_html('HEALTH_OLD');
+		} else if (mixedversions) {
+		    icon = PVE.Utils.get_ceph_icon_html('HEALTH_OK');
 		}
-	    } else if (value && vm.get('mixedversions')) {
+
+		if (buildCommit === '') {
+		    return `${icon}${value}`;
+		}
+
+		return `${icon}${value} (${buildCommit.substring(0, 9)})`;
+	    }
+
+	    let versionNode = rec.parentNode?.data?.version ?? '';
+
+	    let buildCommit = PVE.Utils.parseCephBuildCommit(rec.data) ?? '';
+	    let buildCommitNode = rec.parentNode?.data?.buildcommit ?? '';
+
+	    let bcChanged =
+		buildCommit !== '' &&
+		buildCommitNode !== '' &&
+		buildCommit !== buildCommitNode;
+
+	    if (PVE.Utils.compare_ceph_versions(maxversion, value) > 0) {
+		icon = PVE.Utils.get_ceph_icon_html('HEALTH_UPGRADE');
+	    } else if (versionNode && PVE.Utils.compare_ceph_versions(versionNode, value) > 0) {
+		icon = PVE.Utils.get_ceph_icon_html('HEALTH_OLD');
+	    } else if (mixedversions && !bcChanged) {
 		icon = PVE.Utils.get_ceph_icon_html('HEALTH_OK');
 	    }
 
-	    return icon + version;
+	    let buildCommitPart = buildCommit.substring(0, 9);
+	    if (bcChanged) {
+		const arrow = '<i class="fa fa-fw fa-long-arrow-right"></i>';
+		icon ||= PVE.Utils.get_ceph_icon_html('HEALTH_OLD');
+		buildCommitPart = `${buildCommit.substring(0, 9)}${arrow}${buildCommitNode.substring(0, 9)}`;
+	    }
+
+	    if (buildCommitPart === '') {
+		return `${icon}${value}`;
+	    }
+
+	    return `${icon}${value} (${buildCommitPart})`;
 	},
 
 	render_osd_val: function(value, metaData, rec) {
-- 
2.39.2