fixing more issues in mail around tree: folder-management and subscription dialog

api/js/etemplate/Et2Tree/Et2Tree.ts

@@ -72,9 +72,9 @@ export class Et2Tree extends Et2WidgetWithSelectMixin(LitElement)
 	highlighting: Boolean = false   // description: "Add highlighting class on hovered over item, highlighting is disabled by default"
 	@property({type: String})
 	autoloading: string = ""  //description: "JSON URL or menuaction to be called for nodes marked with child=1, but not having children, getSelectedNode() contains node-id"
-	@property()
+	@property({type: Function})
 	onopenstart //description: "Javascript function executed when user opens a node: function(_id, _widget, _hasChildren) returning true to allow opening!"
-	@property()
+	@property({type: Function})
 	onopenend   //description: "Javascript function executed when opening a node is finished: function(_id, _widget, _hasChildren)"
 	@property({type: String})
 	imagePath: String = egw().webserverUrl + "/api/templates/default/images/dhtmlxtree/" //TODO we will need a different path here! maybe just rename the path?
@@ -399,27 +399,6 @@ export class Et2Tree extends Et2WidgetWithSelectMixin(LitElement)
 		return this._currentOption || (this._selectOptions ? this._selectOptions[0] : null);
 	}
 
-	/**
-	 * getValue, retrieves the Ids of the selected Items
-	 * @return string or object or null
-	 */
-	getValue()
-	{
-		if(this.multiple)
-		{
-			let res:string[] = [];
-			if(this.selectedNodes?.length)
-			{
-				for (const selectedNode of this.selectedNodes)
-				{
-					res.push(selectedNode.id);
-				}
-			}
-			return res;
-		}
-		return this.getSelectedItem()?.id;
-	}
-
 	/**
 	 * getSelectedNode, retrieves the full node of the selected Item
 	 * @return {SlTreeItem} full SlTreeItem

mail/inc/class.mail_ui.inc.php

@@ -304,7 +304,7 @@ class mail_ui
 		{
 			Framework::window_close('Missing acc_id!');
 		}
-		// Initial tree's options, the rest would be loaded dynamicaly by autoloading,
+		// Initial tree's options, the rest would be loaded dynamically by autoloading,
 		// triggered from client-side. Also, we keep this here as
 		$sel_options['foldertree'] =  $this->mail_tree->getTree(null,$profileId,1,true,false,true);
 
@@ -313,24 +313,22 @@ class mail_ui
 		// we can use it to get a comparison base for folders which
 		// got subscribed or unsubscribed by the user
 		try {
-			$subscribed = $this->mail_bo->icServer->listSubscribedMailboxes('',0,true);
+			$subscribed = array_keys($this->mail_bo->icServer->listSubscribedMailboxes('',0,true) ?: []);
 		} catch (Exception $ex) {
 			Framework::message($ex->getMessage());
 		}
 
 		if (!is_array($content))
 		{
-			$content['foldertree'] = array();
+			$content['foldertree'] = array_map(static function($folder) use ($profileId)
-
-			foreach ($subscribed as $folder)
 			{
-				$folderName = $profileId . self::$delimiter . $folder['MAILBOX'];
+				return $profileId.self::$delimiter.$folder;
-				array_push($content['foldertree'], $folderName);
+			}, $subscribed);
-			}
 		}
 		else
 		{
 			$button = @key($content['button']);
+			unset($content[$button]);
 			switch ($button)
 			{
 				case 'save':
@@ -342,22 +340,14 @@ class mail_ui
 					{
 						$namespace_roots[] = $profileId . self::$delimiter . str_replace($namespace['delimiter'], '', $namespace['prefix']);
 					}
-					$to_unsubscribe = $to_subscribe = array();
+					$to_unsubscribe = array_diff($subscribed, $subs=array_map(static function($id)
-					foreach ($content['foldertree'] as $path => $value)
 					{
-						list(,$node) = explode($profileId.self::$delimiter, $path);
+						return explode(self::$delimiter, $id)[1];
-						if ($node)
+					}, $content['foldertree']));
-						{
+					$to_subscribe = array_diff($subs, $subscribed);
-							if (is_array($subscribed) && $subscribed[$node] && !$value['value']) $to_unsubscribe []= $node;
-							if (is_array($subscribed) && !$subscribed[$node] && $value['value']) $to_subscribe [] = $node;
-							if ($value['value']) $cont[] = $path;
-						}
-
-					}
-					$content['foldertree'] = $cont;
 					// set foldertree options to basic node in order to avoid initial autoloading
 					// from client side, as no options would trigger that.
-					$sel_options['foldertree'] = array('id' => '0', 'item'=> array());
+					//$sel_options['foldertree'] = array('id' => '0', 'item'=> array());
 					foreach(array_merge($to_subscribe, $to_unsubscribe) as $mailbox)
 					{
 						if (in_array($profileId.self::$delimiter.$mailbox, $namespace_roots, true))

mail/js/app.js

@@ -4566,33 +4566,6 @@ app.classes.mail = AppJS.extend(
 		this.et2._inst.submit(_widget);
 	},
 
-	/**
-	 * Show ajax-loader when the autoloading get started
-	 *
-	 * @param {type} _id item id
-	 * @param {type} _widget tree widget
-	 * @returns {Boolean}
-	 */
-	subscription_autoloadingStart: function (_id, _widget)
-	{
-		var node = _widget.input._globalIdStorageFind(_id);
-		if (node && typeof node.htmlNode != 'undefined')
-		{
-			var img = jQuery('img',node.htmlNode)[0];
-			img.src = egw.image('ajax-loader', 'admin');
-		}
-		return true;
-	},
-
-	/**
-	 * Revert back the icon after autoloading is finished
-	 * @returns {Boolean}
-	 */
-	subscription_autoloadingEnd: function ()
-	{
-		return true;
-	},
-
 	/**
 	 * Popup the subscription dialog
 	 *
@@ -5581,29 +5554,6 @@ app.classes.mail = AppJS.extend(
 		this.egw.open_link('mail.mail_ui.folderManagement&acc_id='+acc_id, '_blank', '720x580');
 	},
 
-	/**
-	 * Show ajax-loader when the autoloading get started
-	 *
-	 * @param {type} _id item id
-	 * @param {type} _widget tree widget
-	 * @returns {Boolean}
-	 */
-	folderMgmt_autoloadingStart: function(_id, _widget)
-	{
-		return this.subscription_autoloadingStart (_id, _widget);
-	},
-
-	/**
-	 * Revert back the icon after autoloading is finished
-	 * @param {type} _id item id
-	 * @param {type} _widget tree widget
-	 * @returns {Boolean}
-	 */
-	folderMgmt_autoloadingEnd: function(_id, _widget)
-	{
-		return true;
-	},
-
 	/**
 	 *
 	 * @param {type} _ids
@@ -5686,7 +5636,7 @@ app.classes.mail = AppJS.extend(
 	 */
 	folderMgmt_onCheck: function (_id, _widget)
 	{
-		var selected = _widget.input.getAllChecked();
+		var selected = _widget.value;
 		if (selected && selected.split(_widget.input.dlmtr).length > 5)
 		{
 			egw.message(egw.lang('If you would like to select multiple folders in one action, you can hold ctrl key then select a folder as start range and another folder within a same level as end range, all folders in between will be selected or unselected based on their current status.'), 'success');
@@ -5694,39 +5644,31 @@ app.classes.mail = AppJS.extend(
 	},
 
 	/**
-	 * Detele button handler
+	 * Delete button handler
 	 * triggers longTask dialog and send delete operation url
 	 *
 	 */
 	folderMgmt_deleteBtn: function ()
 	{
-		var tree = etemplate2.getByApplication('mail')[0].widgetContainer.getWidgetById('tree');
+		const tree = etemplate2.getByApplication('mail')[0].widgetContainer.getWidgetById('tree');
-		var menuaction= 'mail.mail_ui.ajax_folderMgmt_delete';
+		const menuaction= 'mail.mail_ui.ajax_folderMgmt_delete';
 
-		var callbackDialog = function(_btn)
+		const callbackDialog = function(_btn)
 		{
 			egw.appName='mail';
 			if (_btn === Et2Dialog.YES_BUTTON)
 			{
 				if (tree)
 				{
-					var selFolders = tree.input.getAllChecked();
+					const selFolders = tree.value;
-					if (selFolders)
+					if (selFolders && selFolders.length)
 					{
-						var selFldArr = selFolders.split(tree.input.dlmtr);
+						const msg = egw.lang('Deleting %1 folders in progress ...', selFolders.length);
-						var msg = egw.lang('Deleting %1 folders in progress ...', selFldArr.length);
 						Et2Dialog.long_task(function (_val, _resp)
 						{
-							console.log(_val, _resp);
 							if (_val && _resp.type !== 'error')
 							{
-								var stat = [];
+								const stat = selFolders.map(id => id.split('::')[1]);
-								var folderName = '';
-								for (var i = 0; i < selFldArr.length; i++)
-								{
-									folderName = selFldArr[i].split('::');
-									stat[selFldArr[i]] = folderName[1];
-								}
 								// delete the item from index folderTree
 								egw.window.app.mail.mail_removeLeaf(stat);
 							}
@@ -5735,7 +5677,7 @@ app.classes.mail = AppJS.extend(
 								// submit
 								etemplate2.getByApplication('mail')[0].widgetContainer._inst.submit();
 							}
-						}, msg, egw.lang('Deleting folders'), menuaction, selFldArr, 'mail');
+						}, msg, egw.lang('Deleting folders'), menuaction, selFolders, 'mail');
 						return true;
 					}
 				}

mail/templates/default/app.css

@@ -1073,7 +1073,7 @@ div#mail-index_nm.splitter-pane {min-height: 100px;}
 }
 #popupMainDiv {height: 100%}
 .treeContainer {
-	height: calc(100% - 10px);
+	height: calc(100% - 110px);
 	overflow-y: auto;
 }
 #mail-index_mail-index-header_right {gap: 1ex;}

mail/templates/default/folder_management.xet

@@ -7,8 +7,7 @@
 		</et2-hbox>
 		<et2-hbox  class="treeContainer">
 			<et2-tree id="tree" multiple="true" autoloading="mail_ui::ajax_folderMgmtTree_autoloading" multimarking="strict"
-				oncheck="app.mail.folderMgmt_onCheck" onselect="app.mail.folderMgmt_onSelect" onopenstart="app.mail.folderMgmt_autoloadingStart"
+				oncheck="app.mail.folderMgmt_onCheck" onselect="app.mail.folderMgmt_onSelect" highlighting="true"></et2-tree>
-				onopenend="app.mail.folderMgmt_autoloadingEnd" highlighting="true"></et2-tree>
 		</et2-hbox>
 		<et2-hbox  class="dialogFooterToolbar">
 			<et2-button  statustext="Delete" label="Delete" id="button[delete]" onclick="app.mail.folderMgmt_deleteBtn"></et2-button>

mail/templates/default/subscribe.xet

@@ -7,13 +7,12 @@
 		</et2-hbox>
 		<et2-hbox  class="treeContainer">
 			<et2-tree id="foldertree" multiple="true" autoloading="mail_ui::ajax_tree_autoloading"
-				onopenstart="app.mail.subscription_autoloadingStart" onopenend="app.mail.subscription_autoloadingEnd"
 				multimarking="strict" highlighting="true" oncheck="app.mail.folderMgmt_onCheck"
 				onselect="app.mail.folderMgmt_onSelect"></et2-tree>
 		</et2-hbox>
 		<et2-hbox  class="dialogFooterToolbar">
 			<et2-button  statustext="Saves subscription changes" label="Save" id="button[save]"></et2-button>
-			<et2-button  statustext="Applies the changes made" label="Apply" id="button[apply]" onclick="app.mail.subscription_apply"></et2-button>
+			<et2-button  statustext="Applies the changes made" label="Apply" id="button[apply]"></et2-button>
 			<et2-button  label="Cancel" id="button[cancel]" onclick="window.close()"></et2-button>
 		</et2-hbox>
 	</template>