[pve-devel] [PATCH manager v2] fix #5106: ui: ceph status: make column wrap the summary text on expand

[Dominik Csapak <d.csapak@proxmox.com>]

with this the title is now completely visible when the column is
expanded, even if it's originally too narrow.

Suggested-by: Thomas Lamprecht <t.lamprecht@proxmox.com>
Signed-off-by: Dominik Csapak <d.csapak@proxmox.com>
---
changes from v1:
* wrap the text in the column, instead of duplicating it in the expanded
  body

thanks @thomas for the suggestion

 www/css/ext6-pve.css        |  4 ++++
 www/manager6/ceph/Status.js | 16 ++++++++++++++++
 2 files changed, 20 insertions(+)

diff --git a/www/css/ext6-pve.css b/www/css/ext6-pve.css
index 09185535..b5a3683a 100644
--- a/www/css/ext6-pve.css
+++ b/www/css/ext6-pve.css
@@ -750,3 +750,7 @@ table.osds td:first-of-type {
 .pmx-tag-tooltip .proxmox-tags-full > span {
     margin: 0px;
 }
+
+.pmx-column-wrapped > div {
+    white-space: pre-wrap;
+}
diff --git a/www/manager6/ceph/Status.js b/www/manager6/ceph/Status.js
index ab882327..4845db99 100644
--- a/www/manager6/ceph/Status.js
+++ b/www/manager6/ceph/Status.js
@@ -82,6 +82,16 @@ Ext.define('PVE.node.CephStatus', {
 		    stateId: 'ceph-status-warnings',
 		    viewConfig: {
 			enableTextSelection: true,
+			    listeners: {
+				collapsebody: function(rowNode, record) {
+				    record.set('expanded', false);
+				    record.commit();
+				},
+				expandbody: function(rowNode, record) {
+				    record.set('expanded', true);
+				    record.commit();
+				},
+			    },
 		    },
 		    // we load the store manually, to show an emptyText specify an empty intermediate store
 		    store: {
@@ -139,6 +149,12 @@ Ext.define('PVE.node.CephStatus', {
 			{
 			    dataIndex: 'summary',
 			    header: gettext('Summary'),
+			    renderer: function(value, metaData,record, rI, cI, store, view) {
+				if (record.get('expanded')) {
+				    metaData.tdCls = 'pmx-column-wrapped';
+				}
+				return value;
+			    },
 			    flex: 1,
 			},
 			{
-- 
2.30.2