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

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

[Dominik Csapak]

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

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

[Fiona Ebner]

Am 07.12.23 um 14:35 schrieb Dominik Csapak:
> 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>

Tested-by: Fiona Ebner <f.ebner@proxmox.com>

> @@ -139,6 +149,12 @@ Ext.define('PVE.node.CephStatus', {
>  			{
>  			    dataIndex: 'summary',
>  			    header: gettext('Summary'),
> +			    renderer: function(value, metaData,record, rI, cI, store, view) {

eslint complains about missing space after ',' here

> +				if (record.get('expanded')) {
> +				    metaData.tdCls = 'pmx-column-wrapped';
> +				}
> +				return value;
> +			    },
>  			    flex: 1,
>  			},
>  			{

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

[Thomas Lamprecht]

Am 07/12/2023 um 14:35 schrieb Dominik Csapak:
> 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(+)
> 
>

applied, with Fiona's T-b and the fix for the eslint warning squashed in,
thanks!

btw. I first tried `pve-eslint --fix .` inside the (clean) www/manager6
folder, but that just resulted in a truncated ceph/Status.js file, so while
eslint seems to correctly get the fix option and finds the issue, writing
out the updated code to the file seems broken – can you look into that?
(no pressure though)

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

[Dominik Csapak]

On 2/19/24 14:57, Thomas Lamprecht wrote:
> Am 07/12/2023 um 14:35 schrieb Dominik Csapak:
>> 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(+)
>>
>>
> 
> applied, with Fiona's T-b and the fix for the eslint warning squashed in,
> thanks!
> 
> btw. I first tried `pve-eslint --fix .` inside the (clean) www/manager6
> folder, but that just resulted in a truncated ceph/Status.js file, so while
> eslint seems to correctly get the fix option and finds the issue, writing
> out the updated code to the file seems broken – can you look into that?
> (no pressure though)

i guess you meant me with that ;)
yes i can look into that

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

[Thomas Lamprecht]

Am 19/02/2024 um 14:59 schrieb Dominik Csapak:
> On 2/19/24 14:57, Thomas Lamprecht wrote:
>> btw. I first tried `pve-eslint --fix .` inside the (clean) www/manager6
>> folder, but that just resulted in a truncated ceph/Status.js file, so while
>> eslint seems to correctly get the fix option and finds the issue, writing
>> out the updated code to the file seems broken – can you look into that?
>> (no pressure though)
> 
> i guess you meant me with that ;)

yeah, with you being the only person in the address To field and basically
main pve-eslint dev here that's a good guess ;-P But sure, an explicitly
@mention surely wouldn't have hurt, I will try to do add that next time too.


> yes i can look into that

thx!