ui: datastore: use safe destroy as base for dialog

only ask the name of the current NS, not the full NS path to avoid
too long input requirements on deep levels.

needs a few smaller hacks, ideally we would pull out the basic stuff
from Edit window in some EditBase window and let both, SafeDestroy
and Edit window derive from that, for better common, in sync
features.

Signed-off-by: Thomas Lamprecht <t.lamprecht@proxmox.com>

www/Utils.js

@@ -385,6 +385,7 @@ Ext.define('PBS.Utils', {
 	    'barcode-label-media': [gettext('Drive'), gettext('Barcode-Label Media')],
 	    'catalog-media': [gettext('Drive'), gettext('Catalog Media')],
 	    'delete-datastore': [gettext('Datastore'), gettext('Remove Datastore')],
+	    'delete-namespace': [gettext('Namespace'), gettext('Remove Namespace')],
 	    dircreate: [gettext('Directory Storage'), gettext('Create')],
 	    dirremove: [gettext('Directory'), gettext('Remove')],
 	    'eject-media': [gettext('Drive'), gettext('Eject Media')],

www/datastore/Content.js

@@ -571,16 +571,16 @@ Ext.define('PBS.DataStoreContent', {
 	    let view = me.getView();
 	    if (!view.namespace || view.namespace === '') {
 		console.warn('forgetNamespace called with root NS!');
-                return;
+		return;
 	    }
-	    let parentNS = view.namespace.split('/').slice(0, -1).join('/');
+	    let nsParts = view.namespace.split('/');
+	    let nsName = nsParts.pop();
+	    let parentNS = nsParts.join('/');
 
 	    Ext.create('PBS.window.NamespaceDelete', {
-		title: Ext.String.format(gettext("Destroy Namespace '{0}'"), view.namespace),
-		url: `/admin/datastore/${view.datastore}/namespace`,
 		datastore: view.datastore,
 		namespace: view.namespace,
-		autoShow: true,
+		item: { id: nsName },
 		apiCallDone: success => {
 		    if (success) {
 			view.namespace = parentNS; // move up before reload to avoid "ENOENT" error

www/window/NamespaceEdit.js

@@ -8,7 +8,7 @@ Ext.define('PBS.window.NamespaceEdit', {
     isCreate: true,
     subject: gettext('Namespace'),
     // avoid that the trigger of the combogrid fields open on window show
-    defaultFocus: 'proxmoxHelpButton',
+    defaultFocus: 'proxmoxtextfield[name=name]',
 
     cbind: {
 	url: '/api2/extjs/admin/datastore/{datastore}/namespace',
@@ -53,56 +53,52 @@ Ext.define('PBS.window.NamespaceEdit', {
 });
 
 Ext.define('PBS.window.NamespaceDelete', {
-    extend: 'Proxmox.window.Edit',
+    extend: 'Proxmox.window.SafeDestroy',
     xtype: 'pbsNamespaceDelete',
     mixins: ['Proxmox.Mixin.CBind'],
 
-    //onlineHelp: 'namespaces', // TODO
-
     viewModel: {},
 
-    isRemove: true,
-    isCreate: true, // because edit window is, well, a bit stupid..
-    title: gettext('Destroy Namespace'),
-    // avoid that the trigger of the combogrid fields open on window show
-    defaultFocus: 'proxmoxHelpButton',
+    autoShow: true,
+    taskName: 'delete-namespace',
 
     cbind: {
 	url: '/api2/extjs/admin/datastore/{datastore}/namespace',
     },
-    method: 'DELETE',
-
-    width: 450,
-
-    items: {
-	xtype: 'inputpanel',
-	items: [
-	    {
-		xtype: 'displayfield',
-		name: 'ns',
-		fieldLabel: gettext('Namespace'),
-		cbind: {
-		    value: '{namespace}',
-		    datastore: '{datastore}',
-		},
-		submitValue: true,
-	    },
-	    {
-		xtype: 'proxmoxcheckbox',
-		name: 'delete-groups',
-		reference: 'rmGroups',
-		boxLabel: gettext('Delete all Backup Groups'),
-		value: false,
-	    },
-	    {
-		xtype: 'box',
-		padding: '5 0 0 0',
-		html: `<span class="pmx-hint">${gettext('Note')}</span>: `
-		  + gettext('This will permanently remove all backups from the current namespace and all namespaces below it!'),
-		bind: {
-		    hidden: '{!rmGroups.checked}',
+    additionalItems: [
+	{
+	    xtype: 'proxmoxcheckbox',
+	    name: 'delete-groups',
+	    reference: 'rmGroups',
+	    boxLabel: gettext('Delete all Backup Groups'),
+	    value: false,
+	    listeners: {
+		change: function(field, value) {
+		    let win = field.up('proxmoxSafeDestroy');
+		    if (value) {
+			win.params['delete-groups'] = value;
+		    } else {
+			delete win.params['delete-groups'];
+		    }
 		},
 	    },
-	],
+	},
+	{
+	    xtype: 'box',
+	    padding: '5 0 0 0',
+	    html: `<span class="pmx-hint">${gettext('Note')}</span>: `
+	      + gettext('This will permanently remove all backups from the current namespace and all namespaces below it!'),
+	    bind: {
+		hidden: '{!rmGroups.checked}',
+	    },
+	},
+    ],
+
+    initComponent: function() {
+	let me = this;
+	me.title = Ext.String.format(gettext("Destroy Namespace '{0}'"), me.namespace);
+	me.params = { ns: me.namespace };
+
+	me.callParent();
     },
 });