ui: add Remove button for DirectoryList

With this patch it is possible to remove systemd mount units via the webui.

Signed-off-by: Markus Frank <m.frank@proxmox.com>
Reviewed-by: Lukas Wagner <l.wagner@proxmox.com>
Tested-by: Lukas Wagner <l.wagner@proxmox.com>

www/DirectoryList.js

@@ -7,6 +7,15 @@ Ext.define('PBS.admin.Directorylist', {
 
     emptyText: gettext('No Mount-Units found'),
 
+    viewModel: {
+	data: {
+	    path: '',
+	},
+	formulas: {
+	    dirName: (get) => get('path')?.replace('/mnt/datastore/', '') || undefined,
+	},
+    },
+
     controller: {
 	xclass: 'Ext.app.ViewController',
 
@@ -21,6 +30,27 @@ Ext.define('PBS.admin.Directorylist', {
 	    }).show();
 	},
 
+	removeDirectory: function() {
+	    let me = this;
+	    let vm = me.getViewModel();
+
+	    let dirName = vm.get('dirName');
+
+	    if (!dirName) {
+		throw "no directory name specified";
+	    }
+
+	    Ext.create('Proxmox.window.SafeDestroy', {
+		url: `/nodes/localhost/disks/directory/${dirName}`,
+		item: { id: dirName },
+		showProgress: true,
+		taskName: 'dirremove',
+		listeners: {
+		    destroy: () => me.reload(),
+		},
+	    }).show();
+	},
+
 	reload: function() {
 	    let me = this;
 	    let store = me.getView().getStore();
@@ -49,6 +79,45 @@ Ext.define('PBS.admin.Directorylist', {
 	    text: gettext('Create') + ': Directory',
 	    handler: 'createDirectory',
 	},
+	'->',
+	{
+	    xtype: 'tbtext',
+	    data: {
+		dirName: undefined,
+	    },
+	    bind: {
+		data: {
+		    dirName: "{dirName}",
+		},
+	    },
+	    tpl: [
+		'<tpl if="dirName">',
+		gettext('Directory') + ' {dirName}:',
+		'<tpl else>',
+		Ext.String.format(gettext('No {0} selected'), gettext('directory')),
+		'</tpl>',
+	    ],
+	},
+	{
+	    text: gettext('More'),
+	    iconCls: 'fa fa-bars',
+	    disabled: true,
+	    bind: {
+		disabled: '{!dirName}',
+	    },
+	    menu: [
+		{
+		    text: gettext('Remove'),
+		    itemId: 'remove',
+		    iconCls: 'fa fa-fw fa-trash-o',
+		    handler: 'removeDirectory',
+		    disabled: true,
+		    bind: {
+			disabled: '{!dirName}',
+		    },
+		},
+	    ],
+	},
     ],
 
     columns: [
@@ -79,6 +148,16 @@ Ext.define('PBS.admin.Directorylist', {
 	},
     ],
 
+    listeners: {
+	activate: "reload",
+	selectionchange: function(model, selected) {
+	    let me = this;
+	    let vm = me.getViewModel();
+
+	    vm.set('path', selected[0]?.data.path || '');
+	},
+    },
+
     store: {
 	fields: ['path', 'device', 'filesystem', 'options', 'unitfile'],
 	proxy: {