[pbs-devel] [PATCH proxmox-backup 0/9] fixes/changes extjs 7.0

[pbs-devel] [PATCH proxmox-backup 0/9] fixes/changes extjs 7.0

[Dominik Csapak]

fixes/changes for extjs 7.0

patches
1/9 ("ui: MainView: do not use unnecessary panels")
- 7/9 ("ui: MainView: use new beforeChangePath signature")

are backwards compatible and should work with extjs 6.0.1

8/9 and 9/9 only work correctly with extjs 7.0

while i tried to test every button/panel, there are surely some
features that i missed

Dominik Csapak (9):
  ui: MainView: do not use unnecessary panels
  ui: form/CalendarEvent: do not set displayField
  ui: panel/UsageChart: change downloadServerUrl
  ui: datastore/Summary: change destroy listener
  ui: MainView: navigation: use different ui class
  ui: css: fix text-align pmx-button-badge
  ui: MainView: use new beforeChangePath signature
  ui: use isActionDisabled
  ui: MainView: fix redirectTo call

 www/MainView.js            | 17 ++++++++++++-----
 www/css/ext6-pbs.css       |  3 ++-
 www/datastore/Content.js   | 12 ++++++------
 www/datastore/Summary.js   |  2 +-
 www/form/CalendarEvent.js  |  1 -
 www/panel/UsageChart.js    |  1 +
 www/tape/BackupOverview.js |  2 +-
 www/tape/ChangerStatus.js  | 20 ++++++++++----------
 8 files changed, 33 insertions(+), 25 deletions(-)

-- 
2.20.1

[pbs-devel] [PATCH proxmox-backup 1/9] ui: MainView: do not use unnecessary panels

[Dominik Csapak]

using container here is fine, we do not need panel behaviour which
is more bloated. Removes two ARIA warnings.

Signed-off-by: Dominik Csapak <d.csapak@proxmox.com>
---
 www/MainView.js | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/www/MainView.js b/www/MainView.js
index e6257f35..54fec62e 100644
--- a/www/MainView.js
+++ b/www/MainView.js
@@ -261,7 +261,7 @@ Ext.define('PBS.MainView', {
 	    ],
 	},
 	{
-	    xtype: 'panel',
+	    xtype: 'container',
 	    scrollable: 'y',
 	    border: false,
 	    region: 'west',
@@ -286,7 +286,7 @@ Ext.define('PBS.MainView', {
 	    }],
 	},
 	{
-	    xtype: 'panel',
+	    xtype: 'container',
 	    layout: { type: 'card' },
 	    region: 'center',
 	    border: false,
-- 
2.20.1

[pbs-devel] [PATCH proxmox-backup 2/9] ui: form/CalendarEvent: do not set displayField

[Dominik Csapak]

we use displayTpl here, setting displayField will override the template

Signed-off-by: Dominik Csapak <d.csapak@proxmox.com>
---
 www/form/CalendarEvent.js | 1 -
 1 file changed, 1 deletion(-)

diff --git a/www/form/CalendarEvent.js b/www/form/CalendarEvent.js
index 8e515b8f..96110aaa 100644
--- a/www/form/CalendarEvent.js
+++ b/www/form/CalendarEvent.js
@@ -25,7 +25,6 @@ Ext.define('PBS.form.CalendarEvent', {
     editable: true,
 
     valueField: 'value',
-    displayField: 'text',
     queryMode: 'local',
 
     matchFieldWidth: false,
-- 
2.20.1

[pbs-devel] [PATCH proxmox-backup 3/9] ui: panel/UsageChart: change downloadServerUrl

[Dominik Csapak]

to not have the sencha url by default

Signed-off-by: Dominik Csapak <d.csapak@proxmox.com>
---
 www/panel/UsageChart.js | 1 +
 1 file changed, 1 insertion(+)

diff --git a/www/panel/UsageChart.js b/www/panel/UsageChart.js
index e986d95d..ea5c016e 100644
--- a/www/panel/UsageChart.js
+++ b/www/panel/UsageChart.js
@@ -20,6 +20,7 @@ Ext.define('PBS.widget.UsageChart', {
 	{
 	    flex: 1,
 	    xtype: 'cartesian',
+	    downloadServerUrl: '-',
 	    height: '100%',
 	    itemId: 'chart',
 	    border: false,
-- 
2.20.1

[pbs-devel] [PATCH proxmox-backup 4/9] ui: datastore/Summary: change destroy listener

[Dominik Csapak]

by using beforedestroy instead of destroy (like we do everywhere else)
to avoid race condition when the controller has
already removed some handlers on destruction

Signed-off-by: Dominik Csapak <d.csapak@proxmox.com>
---
 www/datastore/Summary.js  | 2 +-
 www/tape/ChangerStatus.js | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/www/datastore/Summary.js b/www/datastore/Summary.js
index 25a7b6e5..998b6297 100644
--- a/www/datastore/Summary.js
+++ b/www/datastore/Summary.js
@@ -86,7 +86,7 @@ Ext.define('PBS.DataStoreInfo', {
 
     listeners: {
 	activate: 'startStore',
-	destroy: 'stopStore',
+	beforedestroy: 'stopStore',
 	deactivate: 'stopStore',
     },
 
diff --git a/www/tape/ChangerStatus.js b/www/tape/ChangerStatus.js
index 51ba6ffa..0fad11b3 100644
--- a/www/tape/ChangerStatus.js
+++ b/www/tape/ChangerStatus.js
@@ -668,7 +668,7 @@ Ext.define('PBS.TapeManagement.ChangerStatus', {
 
     listeners: {
 	deactivate: 'cancelReload',
-	destroy: 'cancelReload',
+	beforedestroy: 'cancelReload',
     },
 
     tbar: [
-- 
2.20.1

[pbs-devel] [PATCH proxmox-backup 5/9] ui: MainView: navigation: use different ui class

[Dominik Csapak]

by default the treelist gets the 'nav' ui, which in newer extjs
versions has a custom styling (unlike before)

Signed-off-by: Dominik Csapak <d.csapak@proxmox.com>
---
 www/MainView.js      | 3 ++-
 www/css/ext6-pbs.css | 2 +-
 2 files changed, 3 insertions(+), 2 deletions(-)

diff --git a/www/MainView.js b/www/MainView.js
index 54fec62e..cd63f4c7 100644
--- a/www/MainView.js
+++ b/www/MainView.js
@@ -272,6 +272,7 @@ Ext.define('PBS.MainView', {
 	    items: [{
 		xtype: 'navigationtree',
 		minWidth: 180,
+		ui: 'pve-nav',
 		reference: 'navtree',
 		// we have to define it here until extjs 6.2
 		// because of a bug where a viewcontroller does not detect
@@ -281,7 +282,7 @@ Ext.define('PBS.MainView', {
 		},
 	    }, {
 		xtype: 'box',
-		cls: 'x-treelist-nav',
+		cls: 'x-treelist-pve-nav',
 		flex: 1,
 	    }],
 	},
diff --git a/www/css/ext6-pbs.css b/www/css/ext6-pbs.css
index 51d68711..e561eb10 100644
--- a/www/css/ext6-pbs.css
+++ b/www/css/ext6-pbs.css
@@ -143,7 +143,7 @@ table:not(.x-grid-item-selected) tr.x-grid-row.disabled {
     color: #000;
 }
 
-.x-treelist-nav {
+.x-treelist-pve-nav {
     background-color: #f5f5f5;
     border-right: 1px solid #cfcfcf;
 }
-- 
2.20.1

[pbs-devel] [PATCH proxmox-backup 6/9] ui: css: fix text-align pmx-button-badge

[Dominik Csapak]

this was previously set on the button class, but has since been removed
add it here to have the badge number centered again

Signed-off-by: Dominik Csapak <d.csapak@proxmox.com>
---
 www/css/ext6-pbs.css | 1 +
 1 file changed, 1 insertion(+)

diff --git a/www/css/ext6-pbs.css b/www/css/ext6-pbs.css
index e561eb10..39ab4598 100644
--- a/www/css/ext6-pbs.css
+++ b/www/css/ext6-pbs.css
@@ -202,6 +202,7 @@ p.logs {
 
 .pmx-button-badge {
     display: inline-block;
+    text-align: center;
     font-weight: bold;
     border-radius: 4px;
     padding: 2px 3px;
-- 
2.20.1

[pbs-devel] [PATCH proxmox-backup 7/9] ui: MainView: use new beforeChangePath signature

[Dominik Csapak]

subpath can be optional in extjs 7.0, so handle that

Signed-off-by: Dominik Csapak <d.csapak@proxmox.com>
---
 www/MainView.js | 8 +++++++-
 1 file changed, 7 insertions(+), 1 deletion(-)

diff --git a/www/MainView.js b/www/MainView.js
index cd63f4c7..ef52f094 100644
--- a/www/MainView.js
+++ b/www/MainView.js
@@ -34,9 +34,15 @@ Ext.define('PBS.MainView', {
 	    return [xtype, config];
 	},
 
-	beforeChangePath: function(path, subpath, action) {
+	beforeChangePath: function(path, subpathOrAction, action) {
 	    var me = this;
 
+	    let subpath = subpathOrAction;
+	    if (!action) {
+		action = subpathOrAction;
+		subpath = undefined;
+	    }
+
 	    let [xtype, config] = me.parseRouterPath(path);
 
 	    if (!Ext.ClassManager.getByAlias(`widget.${xtype}`)) {
-- 
2.20.1

[pbs-devel] [PATCH proxmox-backup 8/9] ui: use isActionDisabled

[Dominik Csapak]

isDisabled is deprecated for actions in actioncolumns
(it produces a warning for now)

Signed-off-by: Dominik Csapak <d.csapak@proxmox.com>
---
 www/datastore/Content.js   | 12 ++++++------
 www/tape/BackupOverview.js |  2 +-
 www/tape/ChangerStatus.js  | 18 +++++++++---------
 3 files changed, 16 insertions(+), 16 deletions(-)

diff --git a/www/datastore/Content.js b/www/datastore/Content.js
index 5be5bb93..101763aa 100644
--- a/www/datastore/Content.js
+++ b/www/datastore/Content.js
@@ -632,19 +632,19 @@ Ext.define('PBS.DataStoreContent', {
 		    handler: 'onVerify',
 		    getTip: (v, m, rec) => Ext.String.format(gettext("Verify '{0}'"), v),
 		    getClass: (v, m, rec) => rec.data.leaf ? 'pmx-hidden' : 'pve-icon-verify-lettering',
-		    isDisabled: (v, r, c, i, rec) => !!rec.data.leaf,
+		    isActionDisabled: (v, r, c, i, rec) => !!rec.data.leaf,
                 },
                 {
 		    handler: 'onChangeOwner',
 		    getClass: (v, m, rec) => rec.parentNode.id ==='root' ? 'fa fa-user' : 'pmx-hidden',
 		    getTip: (v, m, rec) => Ext.String.format(gettext("Change owner of '{0}'"), v),
-		    isDisabled: (v, r, c, i, rec) => rec.parentNode.id !=='root',
+		    isActionDisabled: (v, r, c, i, rec) => rec.parentNode.id !=='root',
                 },
 		{
 		    handler: 'onPrune',
 		    getTip: (v, m, rec) => Ext.String.format(gettext("Prune '{0}'"), v),
 		    getClass: (v, m, rec) => rec.parentNode.id ==='root' ? 'fa fa-scissors' : 'pmx-hidden',
-		    isDisabled: (v, r, c, i, rec) => rec.parentNode.id !=='root',
+		    isActionDisabled: (v, r, c, i, rec) => rec.parentNode.id !=='root',
 		},
 		{
 		    handler: 'onForget',
@@ -652,13 +652,13 @@ Ext.define('PBS.DataStoreContent', {
 			? Ext.String.format(gettext("Permanently forget snapshot '{0}'"), v)
 			: Ext.String.format(gettext("Permanently forget group '{0}'"), v),
 		    getClass: (v, m, rec) => !rec.data.leaf ? 'fa critical fa-trash-o' : 'pmx-hidden',
-		    isDisabled: (v, r, c, i, rec) => !!rec.data.leaf,
+		    isActionDisabled: (v, r, c, i, rec) => !!rec.data.leaf,
 		},
 		{
 		    handler: 'downloadFile',
 		    getTip: (v, m, rec) => Ext.String.format(gettext("Download '{0}'"), v),
 		    getClass: (v, m, rec) => rec.data.leaf && rec.data.filename ? 'fa fa-download' : 'pmx-hidden',
-		    isDisabled: (v, r, c, i, rec) => !rec.data.leaf || !rec.data.filename || rec.data['crypt-mode'] > 2,
+		    isActionDisabled: (v, r, c, i, rec) => !rec.data.leaf || !rec.data.filename || rec.data['crypt-mode'] > 2,
 		},
 		{
 		    handler: 'openPxarBrowser',
@@ -670,7 +670,7 @@ Ext.define('PBS.DataStoreContent', {
 			}
 			return 'pmx-hidden';
 		    },
-		    isDisabled: (v, r, c, i, rec) => {
+		    isActionDisabled: (v, r, c, i, rec) => {
 			let data = rec.data;
 			return !(data.leaf &&
 			    data.filename &&
diff --git a/www/tape/BackupOverview.js b/www/tape/BackupOverview.js
index 1ccbb7f4..92d5cea4 100644
--- a/www/tape/BackupOverview.js
+++ b/www/tape/BackupOverview.js
@@ -272,7 +272,7 @@ Ext.define('PBS.TapeManagement.BackupOverview', {
 		    handler: 'restoreBackups',
 		    tooltip: gettext('Restore'),
 		    getClass: (v, m, rec) => rec.data.restore ? 'fa fa-fw fa-undo' : 'pmx-hidden',
-		    isDisabled: (v, r, c, i, rec) => !rec.data.restore,
+		    isActionDisabled: (v, r, c, i, rec) => !rec.data.restore,
                 },
 	    ],
 	},
diff --git a/www/tape/ChangerStatus.js b/www/tape/ChangerStatus.js
index 0fad11b3..ef9f5732 100644
--- a/www/tape/ChangerStatus.js
+++ b/www/tape/ChangerStatus.js
@@ -747,19 +747,19 @@ Ext.define('PBS.TapeManagement.ChangerStatus', {
 				    iconCls: 'fa fa-rotate-90 fa-exchange',
 				    handler: 'slotTransfer',
 				    tooltip: gettext('Transfer'),
-				    isDisabled: (v, r, c, i, rec) => rec.data['is-empty'],
+				    isActionDisabled: (v, r, c, i, rec) => rec.data['is-empty'],
 				},
 				{
 				    iconCls: 'fa fa-trash-o',
 				    handler: 'format',
 				    tooltip: gettext('Format'),
-				    isDisabled: (v, r, c, i, rec) => rec.data['is-empty'],
+				    isActionDisabled: (v, r, c, i, rec) => rec.data['is-empty'],
 				},
 				{
 				    iconCls: 'fa fa-rotate-90 fa-upload',
 				    handler: 'load',
 				    tooltip: gettext('Load'),
-				    isDisabled: (v, r, c, i, rec) => rec.data['is-empty'],
+				    isActionDisabled: (v, r, c, i, rec) => rec.data['is-empty'],
 				},
 			    ],
 			},
@@ -885,31 +885,31 @@ Ext.define('PBS.TapeManagement.ChangerStatus', {
 					    iconCls: 'fa fa-rotate-270 fa-upload',
 					    handler: 'unload',
 					    tooltip: gettext('Unload'),
-					    isDisabled: (v, r, c, i, rec) => rec.data['is-empty'] || rec.data['is-blocked'],
+					    isActionDisabled: (v, r, c, i, rec) => rec.data['is-empty'] || rec.data['is-blocked'],
 					},
 					{
 					    iconCls: 'fa fa-hdd-o',
 					    handler: 'cartridgeMemory',
 					    tooltip: gettext('Cartridge Memory'),
-					    isDisabled: (v, r, c, i, rec) => rec.data['is-empty'] || rec.data['is-blocked'],
+					    isActionDisabled: (v, r, c, i, rec) => rec.data['is-empty'] || rec.data['is-blocked'],
 					},
 					{
 					    iconCls: 'fa fa-line-chart',
 					    handler: 'volumeStatistics',
 					    tooltip: gettext('Volume Statistics'),
-					    isDisabled: (v, r, c, i, rec) => rec.data['is-empty'] || rec.data['is-blocked'],
+					    isActionDisabled: (v, r, c, i, rec) => rec.data['is-empty'] || rec.data['is-blocked'],
 					},
 					{
 					    iconCls: 'fa fa-tag',
 					    handler: 'readLabel',
 					    tooltip: gettext('Read Label'),
-					    isDisabled: (v, r, c, i, rec) => rec.data['is-empty'] || rec.data['is-blocked'],
+					    isActionDisabled: (v, r, c, i, rec) => rec.data['is-empty'] || rec.data['is-blocked'],
 					},
 					{
 					    iconCls: 'fa fa-info-circle',
 					    tooltip: gettext('Status'),
 					    handler: 'status',
-					    isDisabled: (v, r, c, i, rec) => rec.data['is-blocked'],
+					    isActionDisabled: (v, r, c, i, rec) => rec.data['is-blocked'],
 					},
 				    ],
 				},
@@ -953,7 +953,7 @@ Ext.define('PBS.TapeManagement.ChangerStatus', {
 					    iconCls: 'fa fa-rotate-270 fa-upload',
 					    handler: 'importTape',
 					    tooltip: gettext('Import'),
-					    isDisabled: (v, r, c, i, rec) => rec.data['is-empty'],
+					    isActionDisabled: (v, r, c, i, rec) => rec.data['is-empty'],
 					},
 				    ],
 				    width: 80,
-- 
2.20.1

[pbs-devel] applied: [PATCH proxmox-backup 8/9] ui: use isActionDisabled

[Thomas Lamprecht]

On 26.05.21 11:12, Dominik Csapak wrote:
> isDisabled is deprecated for actions in actioncolumns
> (it produces a warning for now)
> 
> Signed-off-by: Dominik Csapak <d.csapak@proxmox.com>
> ---
>  www/datastore/Content.js   | 12 ++++++------
>  www/tape/BackupOverview.js |  2 +-
>  www/tape/ChangerStatus.js  | 18 +++++++++---------
>  3 files changed, 16 insertions(+), 16 deletions(-)
> 
>

applied, thanks!

[pbs-devel] [PATCH proxmox-backup 9/9] ui: MainView: fix redirectTo call

[Dominik Csapak]

takes now an object parameter in extjs 7.0

Signed-off-by: Dominik Csapak <d.csapak@proxmox.com>
---
 www/MainView.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/www/MainView.js b/www/MainView.js
index ef52f094..d8f89979 100644
--- a/www/MainView.js
+++ b/www/MainView.js
@@ -187,7 +187,7 @@ Ext.define('PBS.MainView', {
 
 	    // select treeitem and load page from url fragment, if set
 	    let token = Ext.util.History.getToken() || 'pbsDashboard';
-	    this.redirectTo(token, true);
+	    this.redirectTo(token, { force: true });
 	},
     },
 
-- 
2.20.1

[pbs-devel] applied: [PATCH proxmox-backup 9/9] ui: MainView: fix redirectTo call

[Thomas Lamprecht]

On 26.05.21 11:12, Dominik Csapak wrote:
> takes now an object parameter in extjs 7.0
> 
> Signed-off-by: Dominik Csapak <d.csapak@proxmox.com>
> ---
>  www/MainView.js | 2 +-
>  1 file changed, 1 insertion(+), 1 deletion(-)
> 
>

applied, thanks!

[pbs-devel] applied: [PATCH proxmox-backup 0/9] fixes/changes extjs 7.0

[Thomas Lamprecht]

On 26.05.21 11:11, Dominik Csapak wrote:
> fixes/changes for extjs 7.0
> 
> patches
> 1/9 ("ui: MainView: do not use unnecessary panels")
> - 7/9 ("ui: MainView: use new beforeChangePath signature")
> 
> are backwards compatible and should work with extjs 6.0.1
> 

Applied those first seven patches for now, thanks!

> 8/9 and 9/9 only work correctly with extjs 7.0
> 
> while i tried to test every button/panel, there are surely some
> features that i missed
> 
> Dominik Csapak (9):
>   ui: MainView: do not use unnecessary panels
>   ui: form/CalendarEvent: do not set displayField
>   ui: panel/UsageChart: change downloadServerUrl
>   ui: datastore/Summary: change destroy listener
>   ui: MainView: navigation: use different ui class
>   ui: css: fix text-align pmx-button-badge
>   ui: MainView: use new beforeChangePath signature
>   ui: use isActionDisabled
>   ui: MainView: fix redirectTo call
> 
>  www/MainView.js            | 17 ++++++++++++-----
>  www/css/ext6-pbs.css       |  3 ++-
>  www/datastore/Content.js   | 12 ++++++------
>  www/datastore/Summary.js   |  2 +-
>  www/form/CalendarEvent.js  |  1 -
>  www/panel/UsageChart.js    |  1 +
>  www/tape/BackupOverview.js |  2 +-
>  www/tape/ChangerStatus.js  | 20 ++++++++++----------
>  8 files changed, 33 insertions(+), 25 deletions(-)
> 

Re: [pbs-devel] [PATCH proxmox-backup 0/9] fixes/changes extjs 7.0

[Dominik Csapak]

bump