ui: sync jobs: revert to single list for pull/push jobs

but add a separate column for the direction so one still sees the
separate jobs.

change the 'local owner/user' to a single column, but add a tooltip in
the header to explain when it does what.

This makes the 'SyncJobsPullPushView' unnecessary, so delete it.

Signed-off-by: Dominik Csapak <d.csapak@proxmox.com>

www/Makefile

@@ -62,7 +62,6 @@ JSSRC=							\
 	config/TrafficControlView.js			\
 	config/ACLView.js				\
 	config/SyncView.js				\
-	config/SyncPullPushView.js			\
 	config/VerifyView.js				\
 	config/PruneView.js				\
 	config/GCView.js				\

www/config/SyncPullPushView.js

@@ -1,61 +0,0 @@
-Ext.define('PBS.config.SyncPullPush', {
-    extend: 'Ext.panel.Panel',
-    alias: 'widget.pbsSyncJobPullPushView',
-    title: gettext('Sync Jobs'),
-
-    mixins: ['Proxmox.Mixin.CBind'],
-
-    layout: {
-	type: 'vbox',
-	align: 'stretch',
-	multi: true,
-	bodyPadding: 5,
-    },
-    defaults: {
-	collapsible: false,
-	margin: 5,
-    },
-    scrollable: true,
-    items: [
-	{
-	    xtype: 'pbsSyncJobView',
-	    itemId: 'syncJobsPull',
-	    syncDirection: 'pull',
-	    cbind: {
-		datastore: '{datastore}',
-	    },
-	    minHeight: 125, // shows at least one line of content
-	},
-	{
-	    xtype: 'splitter',
-	    performCollapse: false,
-	},
-	{
-	    xtype: 'pbsSyncJobView',
-	    itemId: 'syncJobsPush',
-	    syncDirection: 'push',
-	    cbind: {
-		datastore: '{datastore}',
-	    },
-	    flex: 1,
-	    minHeight: 125, // shows at least one line of content
-	},
-    ],
-    initComponent: function() {
-	let me = this;
-
-	let subPanelIds = me.items.map(el => el.itemId).filter(id => !!id);
-
-	me.callParent();
-
-	for (const itemId of subPanelIds) {
-	    let component = me.getComponent(itemId);
-	    component.relayEvents(me, ['activate', 'deactivate', 'destroy']);
-	}
-    },
-
-    cbindData: function(initialConfig) {
-        let me = this;
-        me.datastore = initialConfig.datastore ? initialConfig.datastore : undefined;
-    },
-});

www/config/SyncView.js

@@ -26,26 +26,25 @@ Ext.define('PBS.config.SyncJobView', {
     stateful: true,
     stateId: 'grid-sync-jobs-v1',
 
-    title: gettext('Sync Jobs - Pull Direction'),
+    title: gettext('Sync Jobs'),
-    ownerHeader: gettext('Owner'),
-
-    cbindData: function(initialConfig) {
-	let me = this;
-	if (me.syncDirection === 'push') {
-	    me.title = gettext('Sync Jobs - Push Direction');
-	    me.ownerHeader = gettext('Local User');
-	}
-    },
 
     controller: {
 	xclass: 'Ext.app.ViewController',
 
-	addSyncJob: function() {
+	addPullSyncJob: function() {
+	    this.addSyncJob('pull');
+	},
+
+	addPushSyncJob: function() {
+	    this.addSyncJob('push');
+	},
+
+	addSyncJob: function(syncDirection) {
 	    let me = this;
 	    let view = me.getView();
             Ext.create('PBS.window.SyncJobEdit', {
 		datastore: view.datastore,
-		syncDirection: view.syncDirection,
+		syncDirection,
 		listeners: {
 		    destroy: function() {
 			me.reload();
@@ -63,7 +62,7 @@ Ext.define('PBS.config.SyncJobView', {
             Ext.create('PBS.window.SyncJobEdit', {
 		datastore: view.datastore,
                 id: selection[0].data.id,
-		syncDirection: view.syncDirection,
+		syncDirection: selection[0].data.direction,
 		listeners: {
 		    destroy: function() {
 			me.reload();
@@ -125,9 +124,7 @@ Ext.define('PBS.config.SyncJobView', {
 	    if (view.datastore !== undefined) {
 		params.store = view.datastore;
 	    }
-	    if (view.syncDirection !== undefined) {
+	    params['sync-direction'] = 'all';
-		params["sync-direction"] = view.syncDirection;
-	    }
 	    view.getStore().rstore.getProxy().setExtraParams(params);
 	    Proxmox.Utils.monStoreErrors(view, view.getStore().rstore);
 	},
@@ -158,11 +155,22 @@ Ext.define('PBS.config.SyncJobView', {
 
     tbar: [
 	{
-	    xtype: 'proxmoxButton',
 	    text: gettext('Add'),
-	    handler: 'addSyncJob',
+	    menu: [
+		{
+		    text: gettext('Add Pull Sync Job'),
+		    iconCls: "fa fa-fw fa-download",
+		    handler: 'addPullSyncJob',
 		    selModel: false,
 		},
+		{
+		    text: gettext('Add Push Sync Job'),
+		    iconCls: "fa fa-fw fa-upload",
+		    handler: 'addPushSyncJob',
+		    selModel: false,
+		},
+	    ],
+	},
 	{
 	    xtype: 'proxmoxButton',
 	    text: gettext('Edit'),
@@ -205,6 +213,23 @@ Ext.define('PBS.config.SyncJobView', {
 	    flex: 1,
 	    sortable: true,
 	},
+	{
+	    header: gettext('Direction'),
+	    dataIndex: 'direction',
+	    renderer: function(value) {
+		let iconCls, text;
+		if (value === 'pull') {
+		    iconCls = 'download';
+		    text = gettext('Pull');
+		} else {
+		    iconCls = 'upload';
+		    text = gettext('Push');
+		}
+		return `<i class="fa fa-fw fa-${iconCls}"></i> ${text}`;
+	    },
+	    width: 100,
+	    sortable: true,
+	},
 	{
 	    header: gettext('Local Store'),
 	    dataIndex: 'store',
@@ -245,9 +270,10 @@ Ext.define('PBS.config.SyncJobView', {
 	    sortable: true,
 	},
 	{
-	    cbind: {
+	    header: `${gettext('Local Owner/User')} <i class="fa fa-question-circle" data-qtip="
-		header: '{ownerHeader}',
+	    ${gettext("Pull: The local owner.")}<br>
-	    },
+	    ${gettext("Push: The local user used for access control.")}
+	    "></i>`,
 	    dataIndex: 'owner',
 	    renderer: 'render_optional_owner',
 	    flex: 2,

www/datastore/DataStoreList.js

@@ -239,7 +239,7 @@ Ext.define('PBS.datastore.DataStores', {
 	{
 	    iconCls: 'fa fa-refresh',
 	    itemId: 'syncjobs',
-	    xtype: 'pbsSyncJobPullPushView',
+	    xtype: 'pbsSyncJobView',
 	},
 	{
 	    iconCls: 'fa fa-check-circle',

www/datastore/Panel.js

@@ -68,7 +68,7 @@ Ext.define('PBS.DataStorePanel', {
 	{
 	    iconCls: 'fa fa-refresh',
 	    itemId: 'syncjobs',
-	    xtype: 'pbsSyncJobPullPushView',
+	    xtype: 'pbsSyncJobView',
 	    cbind: {
 		datastore: '{datastore}',
 	    },