public inbox for pve-devel@lists.proxmox.com
 help / color / mirror / Atom feed
From: Aaron Lauterer <a.lauterer@proxmox.com>
To: pve-devel@lists.proxmox.com
Subject: [pve-devel] [PATCH manager follow-up 2/2] ui: ceph status: add tooltip with details to warnings
Date: Wed, 22 Feb 2023 10:39:30 +0100	[thread overview]
Message-ID: <20230222093930.2659526-1-a.lauterer@proxmox.com> (raw)
In-Reply-To: <20230222093655.2645787-3-a.lauterer@proxmox.com>

This is another step to make it easier for admins to discover more
information for a warning or problem that is shown in the Ceph health
panel.

The length is limited to give a first glimpse. For the full details one
can click on the info/detail button.

Signed-off-by: Aaron Lauterer <a.lauterer@proxmox.com>
---
Please use this follow up!

I found a small bug just after sending it regarding the max length.
The length check and substring did have different values.

 www/manager6/ceph/Status.js | 41 +++++++++++++++++++++++++++++++++++++
 1 file changed, 41 insertions(+)

diff --git a/www/manager6/ceph/Status.js b/www/manager6/ceph/Status.js
index 45583f51..19a1243a 100644
--- a/www/manager6/ceph/Status.js
+++ b/www/manager6/ceph/Status.js
@@ -76,6 +76,47 @@ Ext.define('PVE.node.CephStatus', {
 			trackRemoved: false,
 			data: [],
 		    },
+
+		    listeners: {
+			destroy: function() {
+			    let view = this.getView();
+			    if (view.tooltip) {
+				view.tooltip.destroy();
+				delete view.tooltip;
+			    }
+			},
+			itemmouseenter: function(record, item) {
+			    let view = this.getView();
+			    if (!view) {
+				return;
+			    }
+			    if (!item.data.detail) {
+				return;
+			    }
+			    let text = item.data.detail.trimStart().replaceAll('\n', '<br>');
+			    if (text.length > 500) {
+			        text = `${text.substring(0, 500)}…`;
+			    }
+			    if (!view.tooltip) {
+				view.tooltip = Ext.create('Ext.tip.ToolTip', {
+				    target: view,
+				    trackMouse: true,
+				    dismissDelay: 0,
+				    tpl: '{text}',
+				    renderTo: Ext.getBody(),
+				});
+			    }
+			    view.tooltip.setData({ text });
+			    view.tooltip.show();
+			},
+			itemmouseleave: function(record, item) {
+			    let view = this.getView();
+			    if (view.tooltip) {
+				view.tooltip.destroy();
+				delete view.tooltip;
+			    }
+			},
+		    },
 		    emptyText: gettext('No Warnings/Errors'),
 		    columns: [
 			{
-- 
2.30.2





  reply	other threads:[~2023-02-22  9:39 UTC|newest]

Thread overview: 7+ messages / expand[flat|nested]  mbox.gz  Atom feed  top
2023-02-22  9:36 [pve-devel] [PATCH manager 0/2] ui: ceph: improve discoverability of warning details Aaron Lauterer
2023-02-22  9:36 ` [pve-devel] [PATCH manager 1/2] ui: ceph: make the warning detail button stand out more Aaron Lauterer
2023-03-02 13:15   ` Dominik Csapak
2023-02-22  9:36 ` [pve-devel] [PATCH manager 2/2] ui: ceph status: add tooltip with details to warnings Aaron Lauterer
2023-02-22  9:39   ` Aaron Lauterer [this message]
2023-03-02 13:15     ` [pve-devel] [PATCH manager follow-up " Dominik Csapak
2023-03-02 13:22       ` Aaron Lauterer

Reply instructions:

You may reply publicly to this message via plain-text email
using any one of the following methods:

* Save the following mbox file, import it into your mail client,
  and reply-to-all from there: mbox

  Avoid top-posting and favor interleaved quoting:
  https://en.wikipedia.org/wiki/Posting_style#Interleaved_style

* Reply using the --to, --cc, and --in-reply-to
  switches of git-send-email(1):

  git send-email \
    --in-reply-to=20230222093930.2659526-1-a.lauterer@proxmox.com \
    --to=a.lauterer@proxmox.com \
    --cc=pve-devel@lists.proxmox.com \
    /path/to/YOUR_REPLY

  https://kernel.org/pub/software/scm/git/docs/git-send-email.html

* If your mail client supports setting the In-Reply-To header
  via mailto: links, try the mailto: link
Be sure your reply has a Subject: header at the top and a blank line before the message body.
This is a public inbox, see mirroring instructions
for how to clone and mirror all data and code used for this inbox
Service provided by Proxmox Server Solutions GmbH | Privacy | Legal