diff --git a/languages/en-US/Install.json b/languages/en-US/Install.json
index 32664c5a5ee1..65f93ac90c8f 100644
--- a/languages/en-US/Install.json
+++ b/languages/en-US/Install.json
@@ -149,7 +149,7 @@
     "JS_S_LENGTH_MENU": "Show _MENU_ entries",
     "JS_SEARCH": "Search:",
     "JS_S_INFO": "Showing _START_ to _END_ of _TOTAL_ entries",
-    "JS_S_PREVIOUS": "Last",
+    "JS_S_PREVIOUS": "Previous",
     "JS_S_NEXT": "Next"
   }
 }
diff --git a/languages/en-US/_Base.json b/languages/en-US/_Base.json
index 3e095e3c5e04..20d4e02555e8 100644
--- a/languages/en-US/_Base.json
+++ b/languages/en-US/_Base.json
@@ -1346,14 +1346,6 @@
     "LBL_NO_UPCOMING_PROJECT_TASKS": "No upcoming project tasks",
     "LBL_COMPLETED_PROJECT_TASKS": "Completed project tasks",
     "LBL_NO_COMPLETED_PROJECT_TASKS": "No completed project tasks",
-    "PLL_PLANNED": "Planned",
-    "PLL_ON_HOLD": "On hold",
-    "PLL_SUBMITTED_COMMENTS": "Submitted comments",
-    "PLL_IN_PROGRESSING": "In progress",
-    "PLL_IN_APPROVAL": "In approval",
-    "PLL_COMPLETED": "Completed",
-    "PLL_CANCELLED": "Cancelled",
-    "LBL_SELECT_UP_TO_RECORDS": "Select up to %s records",
     "LBL_MASS_DOWNLOAD": "Mass download",
     "LBL_AMOUNT_TO_RETURN": "Amount to be refunded",
     "LBL_TABLE_TAX_SUMMARY_FOR_CORRECT": "Tax summary for correcting invoices",
@@ -1660,9 +1652,9 @@
     "JS_S_INFO_EMPTY": "Showing 0 to 0 of 0 entries",
     "JS_S_INFO_FILTERED": "(filtered from _MAX_ total entries)",
     "JS_S_FIRST": "First",
-    "JS_S_PREVIOUS": "Last",
+    "JS_S_PREVIOUS": "Previous",
     "JS_S_NEXT": "Next",
-    "JS_S_LAST": "Previous",
+    "JS_S_LAST": "Last",
     "JS_S_SORT_ASCENDING": ": activate to sort column ascending",
     "JS_S_SORT_DESCENDING": ": activate to sort column descending",
     "JS_RELATION": "Company",
diff --git a/layouts/basic/modules/Vtiger/TreeRecords.tpl b/layouts/basic/modules/Vtiger/TreeRecords.tpl
index 3bac068889e7..5977cca0f33f 100644
--- a/layouts/basic/modules/Vtiger/TreeRecords.tpl
+++ b/layouts/basic/modules/Vtiger/TreeRecords.tpl
@@ -1,10 +1,10 @@
 {*<!-- {[The file is published on the basis of YetiForce Public License 3.0 that can be found in the following directory: licenses/LicenseEN.txt or yetiforce.com]} -->*}
 {strip}
-	<table class="table table-striped">
+	<table class="table tableBorderHeadBody listViewEntriesTable medium  js-fixed-thead">
 		<thead>
 			<tr>
 				{foreach item=HEADER from=$HEADERS}
-					<th>
+					<th class="noWrap">
 						{\App\Language::translate($HEADER->get('label'), $MODULE)}
 					</th>
 				{/foreach}
diff --git a/layouts/basic/modules/Vtiger/TreeRecordsPostProcess.tpl b/layouts/basic/modules/Vtiger/TreeRecordsPostProcess.tpl
index 6dd81ea43a1c..f820cc986ff2 100644
--- a/layouts/basic/modules/Vtiger/TreeRecordsPostProcess.tpl
+++ b/layouts/basic/modules/Vtiger/TreeRecordsPostProcess.tpl
@@ -4,17 +4,17 @@
 	</div>
 	</div>
 	</div>
-	<div class="{if $USER_MODEL->get('leftpanelhide')}c-menu--open {/if}siteBarRight">
+	<div class="siteBarRight">
 		<div class="btn btn-block toggleSiteBarRightButton"
 			 title="{\App\Language::translate('LBL_RIGHT_PANEL_SHOW_HIDE', $MODULE)}">
 			<span class="fas fa-chevron-right"></span>
 		</div>
 		<div class="siteBarContent">
 			<div class="row">
-				<div class="col-md-4 paddingTop10">
+				<div class="col-12 paddingTop10">
 					<h5>{\App\Language::translate('LBL_FILTERING',$MODULE)}</h5>
 				</div>
-				<div class="col-md-8 paddingTop10">
+				<div class="col-12 paddingBottom10">
 					<select class="select2 form-control" id="moduleFilter">
 						{foreach key=GROUP_LABEL item=GROUP_CUSTOM_VIEWS from=$CUSTOM_VIEWS}
 							<optgroup label="{\App\Language::translate('LBL_CV_GROUP_'|cat:strtoupper($GROUP_LABEL))}">
@@ -34,6 +34,5 @@
 		</div>
 	</div>
 	</div>
-	</div>
 	<!-- /tpl-TreeRecordsPostProcess -->
 {/strip}
diff --git a/layouts/basic/modules/Vtiger/TreeRecordsPreProcess.tpl b/layouts/basic/modules/Vtiger/TreeRecordsPreProcess.tpl
index f2d99a928b80..036017f731eb 100644
--- a/layouts/basic/modules/Vtiger/TreeRecordsPreProcess.tpl
+++ b/layouts/basic/modules/Vtiger/TreeRecordsPreProcess.tpl
@@ -1,17 +1,17 @@
 {*<!-- {[The file is published on the basis of YetiForce Public License 3.0 that can be found in the following directory: licenses/LicenseEN.txt or yetiforce.com]} -->*}
 {strip}
-	<div class="row padding0">
-		<div class="col-md-9 rowContent">
-			<div class="o-breadcrumb widget_header row paddingTop10">
-				<div class="float-left paddingLeftMd">
-					<div class="btn-toolbar">
-						{include file=\App\Layout::getTemplatePath('ButtonViewLinks.tpl') LINKS=$QUICK_LINKS['SIDEBARLINK']}
-					</div>
-				</div>
+		<div class="treeviewViewContainer rowContent js-sitebar--active">
+			<div class="o-breadcrumb widget_header mb-2 d-flex justify-content-between px-2">
 				<div class="col-md-10">
 					{include file=\App\Layout::getTemplatePath('BreadCrumbs.tpl', $MODULE_NAME)}
 				</div>
 			</div>
-			<div class="row">
+			<div class="c-list__buttons d-flex flex-wrap flex-sm-nowrap u-w-sm-down-100">
+				{include file=\App\Layout::getTemplatePath('ButtonViewLinks.tpl') LINKS=$QUICK_LINKS['SIDEBARLINK'] CLASS='buttonTextHolder mr-sm-1 mb-1 mb-sm-0 c-btn-block-sm-down'}
+				{foreach item=LINK from=$LISTVIEW_LINKS['LISTVIEWBASIC']}
+					{include file=\App\Layout::getTemplatePath('ButtonLink.tpl', $MODULE) BUTTON_VIEW='listView' CLASS='mr-sm-1 mb-1 c-btn-block-sm-down'}
+				{/foreach}
+			</div>
+			<div class="row overflow-auto">
 				<div class="col-md-12" id="recordsListContents">
-				{/strip}
+{/strip}
diff --git a/modules/Products/models/TreeView.php b/modules/Products/models/TreeView.php
index 3b70f5cdaedc..d8a71a102f9f 100644
--- a/modules/Products/models/TreeView.php
+++ b/modules/Products/models/TreeView.php
@@ -13,39 +13,4 @@ public function isActive()
 	{
 		return true;
 	}
-
-	private function getRecords()
-	{
-		$pagingModel = new Vtiger_Paging_Model();
-		$pagingModel->set('limit', 0);
-		$listViewModel = Vtiger_ListView_Model::getInstance($this->getModuleName());
-		$listEntries = $listViewModel->getListViewEntries($pagingModel);
-		$tree = [];
-		foreach ($listEntries as $item) {
-			++$this->lastTreeId;
-			$parent = $item->get('pscategory');
-			$parent = (int) str_replace('T', '', $parent);
-			$tree[] = [
-				'id' => $this->lastTreeId,
-				'type' => 'record',
-				'record_id' => $item->getId(),
-				'parent' => $parent == 0 ? '#' : $parent,
-				'text' => $item->getName(),
-				'isrecord' => true,
-				'state' => [],
-				'icon' => 'fas fa-file',
-			];
-		}
-		return $tree;
-	}
-
-	/**
-	 * Load tree.
-	 *
-	 * @return string
-	 */
-	public function getTreeList()
-	{
-		return array_merge(parent::getTreeList(), $this->getRecords());
-	}
 }
diff --git a/modules/Products/views/TreeRecords.php b/modules/Products/views/TreeRecords.php
deleted file mode 100644
index 93d13d1bd306..000000000000
--- a/modules/Products/views/TreeRecords.php
+++ /dev/null
@@ -1,73 +0,0 @@
-<?php
-
-/**
- * Products TreeView View Class.
- *
- * @copyright YetiForce Sp. z o.o
- * @license   YetiForce Public License 3.0 (licenses/LicenseEN.txt or yetiforce.com)
- * @author    Mariusz Krzaczkowski <m.krzaczkowski@yetiforce.com>
- * @author    Radosław Skrzypczak <r.skrzypczak@yetiforce.com>
- */
-class Products_TreeRecords_View extends Vtiger_TreeRecords_View
-{
-	/**
-	 * {@inheritdoc}
-	 */
-	public function process(App\Request $request)
-	{
-		$baseModuleName = 'Accounts';
-		$viewer = $this->getViewer($request);
-		$filter = $request->has('filter') ? $request->getByType('filter', 'Alnum') : \App\CustomView::getInstance($baseModuleName)->getViewId();
-		$viewer->assign('VIEWID', $filter);
-		if ($request->isEmpty('branches', true) && $request->isEmpty('category', true)) {
-			return;
-		}
-		$branches = $request->getArray('branches', 'Text');
-		$category = $request->getArray('category', 'Alnum');
-
-		$moduleName = $request->getModule();
-		$viewer = $this->getViewer($request);
-		$multiReferenceFields = \Vtiger_MultiReferenceValue_UIType::getFieldsByModules($baseModuleName, $moduleName);
-		$multiReferenceFieldId = reset($multiReferenceFields);
-		if (!$multiReferenceFieldId || !($fieldInfo = \App\Field::getFieldInfo($multiReferenceFieldId))) {
-			return;
-		}
-		$pagingModel = new Vtiger_Paging_Model();
-		$pagingModel->set('limit', 0);
-		$listViewModel = Vtiger_ListView_Model::getInstance($baseModuleName, $filter);
-		$queryGenerator = $listViewModel->get('query_generator');
-		if (!empty($branches)) {
-			$queryGenerator->addCondition($fieldInfo['fieldname'], implode('##', $branches), 'e');
-		}
-		if (!empty($category)) {
-			$query = (new \App\Db\Query())
-				->select(['crmid'])
-				->from('u_#__crmentity_rel_tree')
-				->where(['module' => App\Module::getModuleId($baseModuleName), 'relmodule' => App\Module::getModuleId($moduleName), 'tree' => $category]);
-			$queryGenerator->addNativeCondition(['in', 'vtiger_crmentity.crmid', $query], false);
-		}
-		$listViewModel->set('query_generator', $queryGenerator);
-		$listEntries = $listViewModel->getListViewEntries($pagingModel);
-		if (0 === \count($listEntries)) {
-			return;
-		}
-		$listHeaders = $listViewModel->getListViewHeaders();
-
-		$viewer->assign('ENTRIES', $listEntries);
-		$viewer->assign('HEADERS', $listHeaders);
-		$viewer->assign('MODULE', $baseModuleName);
-		$viewer->view('TreeRecords.tpl', $moduleName);
-	}
-
-	/**
-	 * {@inheritdoc}
-	 */
-	public function postProcess(App\Request $request, $display = true)
-	{
-		$viewer = $this->getViewer($request);
-		$baseModuleName = 'Accounts';
-		$viewer->assign('CUSTOM_VIEWS', CustomView_Record_Model::getAllByGroup($baseModuleName));
-		$viewer->view('TreeRecordsPostProcess.tpl', $request->getModule());
-		parent::postProcess($request, false);
-	}
-}
diff --git a/modules/Services/models/TreeView.php b/modules/Services/models/TreeView.php
index c0971972ae16..90bf85f81ffa 100644
--- a/modules/Services/models/TreeView.php
+++ b/modules/Services/models/TreeView.php
@@ -13,38 +13,4 @@ public function isActive()
 	{
 		return true;
 	}
-
-	private function getRecords()
-	{
-		$pagingModel = new Vtiger_Paging_Model();
-		$pagingModel->set('limit', 0);
-		$listViewModel = Vtiger_ListView_Model::getInstance($this->getModuleName());
-		$listEntries = $listViewModel->getListViewEntries($pagingModel);
-		$tree = [];
-		foreach ($listEntries as $item) {
-			++$this->lastTreeId;
-			$parent = $item->get('pscategory');
-			$parent = (int) str_replace('T', '', $parent);
-			$tree[] = [
-				'id' => $this->lastTreeId,
-				'record_id' => $item->getId(),
-				'parent' => $parent == 0 ? '#' : $parent,
-				'text' => $item->getName(),
-				'isrecord' => true,
-				'state' => [],
-				'icon' => 'fas fa-file',
-			];
-		}
-		return $tree;
-	}
-
-	/**
-	 * Load tree.
-	 *
-	 * @return string
-	 */
-	public function getTreeList()
-	{
-		return array_merge(parent::getTreeList(), $this->getRecords());
-	}
 }
diff --git a/modules/Services/views/TreeRecords.php b/modules/Services/views/TreeRecords.php
deleted file mode 100644
index 28ea2c6f25d9..000000000000
--- a/modules/Services/views/TreeRecords.php
+++ /dev/null
@@ -1,24 +0,0 @@
-<?php
-
-/**
- * Services TreeView View Class.
- *
- * @copyright YetiForce Sp. z o.o
- * @license   YetiForce Public License 3.0 (licenses/LicenseEN.txt or yetiforce.com)
- * @author    Mariusz Krzaczkowski <m.krzaczkowski@yetiforce.com>
- */
-class Services_TreeRecords_View extends Products_TreeRecords_View
-{
-	public function getFooterScripts(\App\Request $request)
-	{
-		$headerScriptInstances = parent::getFooterScripts($request);
-
-		$moduleName = $request->getModule();
-		$modulePopUpFile = 'modules.' . $moduleName . '.resources.Edit';
-		unset($headerScriptInstances[$modulePopUpFile]);
-
-		return array_merge($headerScriptInstances, $this->checkAndConvertJsScripts([
-			'modules.Products.resources.Edit', $modulePopUpFile
-		]));
-	}
-}
diff --git a/modules/Vtiger/models/TreeView.php b/modules/Vtiger/models/TreeView.php
index ad671d29bf66..280f150facdd 100644
--- a/modules/Vtiger/models/TreeView.php
+++ b/modules/Vtiger/models/TreeView.php
@@ -105,6 +105,49 @@ public static function getInstance(string $moduleName)
 		return self::$_cached_instance[$moduleName];
 	}
 
+	/**
+	 * Function to get Basic links for tree view
+	 *
+	 * @return array of Basic links
+	 */
+	public function getBasicLinks(): array
+	{
+		$moduleName = $this->getModuleName();
+		$moduleModel = Vtiger_Module_Model::getInstance($moduleName);
+		$basicLinks = [];
+		if ($moduleModel->isPermitted('CreateView')) {
+			$basicLinks[] = [
+				'linktype' => 'LISTVIEWBASIC',
+				'linklabel' => 'LBL_ADD_RECORD',
+				'linkurl' => $moduleModel->getCreateRecordUrl(),
+				'linkclass' => 'btn-light addButton modCT_' . $moduleModel->getName(),
+				'linkicon' => 'fas fa-plus',
+				'showLabel' => 1,
+				'linkhref' => true
+			];
+		}
+
+		return $basicLinks;
+	}
+
+	/**
+	 * Function to get the list of tree view links.
+	 *
+	 * @param <Array> $linkParams
+	 *
+	 * @return <Array> - Associate array of Link Type to List of Vtiger_Link_Model instances
+	 */
+	public function getListViewLinks()
+	{
+		$basicLinks = $this->getBasicLinks();
+		$links = [];
+		foreach ($basicLinks as $basicLink) {
+			$links['LISTVIEWBASIC'][] = Vtiger_Link_Model::getInstanceFromValues($basicLink);
+		}
+
+		return $links;
+	}
+
 	/**
 	 * Load tree.
 	 *
diff --git a/modules/Vtiger/views/TreeRecords.php b/modules/Vtiger/views/TreeRecords.php
index 31b78c860604..fb723958da10 100644
--- a/modules/Vtiger/views/TreeRecords.php
+++ b/modules/Vtiger/views/TreeRecords.php
@@ -37,9 +37,10 @@ public function preProcess(\App\Request $request, $display = true)
 		parent::preProcess($request);
 		$moduleName = $request->getModule();
 		$treeViewModel = Vtiger_TreeView_Model::getInstance($moduleName);
-
+		$listViewLinks = $treeViewModel->getListViewLinks();
 		$treeList = $treeViewModel->getTreeList();
 		$viewer = $this->getViewer($request);
+		$viewer->assign('LISTVIEW_LINKS', $listViewLinks);
 		$viewer->assign('TREE_LIST', \App\Json::encode($treeList));
 		$viewer->view('TreeRecordsPreProcess.tpl', $moduleName);
 	}
@@ -69,11 +70,6 @@ public function process(\App\Request $request)
 		$moduleName = $request->getModule();
 		$viewer = $this->getViewer($request);
 		$filter = $request->has('filter') ? $request->getByType('filter', 'Alnum') : \App\CustomView::getInstance($moduleName)->getViewId();
-		$viewer->assign('VIEWID', $filter);
-
-		if ($request->isEmpty('branches', true)) {
-			return;
-		}
 		$branches = $request->getArray('branches', 'Text');
 		$treeViewModel = Vtiger_TreeView_Model::getInstance($moduleName);
 		$field = $treeViewModel->getTreeField();
@@ -82,11 +78,8 @@ public function process(\App\Request $request)
 		$listViewModel = Vtiger_ListView_Model::getInstance($moduleName, $filter);
 		$listViewModel->getQueryGenerator()->addCondition($field['fieldname'], implode('##', $branches), 'e');
 		$listEntries = $listViewModel->getListViewEntries($pagingModel);
-		if (count($listEntries) === 0) {
-			return;
-		}
 		$listHeaders = $listViewModel->getListViewHeaders();
-
+		$viewer->assign('VIEWID', $filter);
 		$viewer->assign('ENTRIES', $listEntries);
 		$viewer->assign('HEADERS', $listHeaders);
 		$viewer->assign('MODULE', $moduleName);
diff --git a/public_html/layouts/basic/modules/Products/resources/TreeRecords.js b/public_html/layouts/basic/modules/Products/resources/TreeRecords.js
deleted file mode 100644
index c46b48de4c45..000000000000
--- a/public_html/layouts/basic/modules/Products/resources/TreeRecords.js
+++ /dev/null
@@ -1,22 +0,0 @@
-/* {[The file is published on the basis of YetiForce Public License 3.0 that can be found in the following directory: licenses/LicenseEN.txt or yetiforce.com]} */
-'use strict';
-
-Vtiger_TreeRecords_Js("Products_TreeRecords_Js", {}, {
-	getRecordsParams: function (container) {
-		let selected = [], category = [];
-		$.each(this.treeInstance.jstree("get_selected", true), function (index, value) {
-			if (value.original.isrecord) {
-				selected.push(value.text);
-			} else {
-				category.push(value.original.record_id);
-			}
-		});
-		return {
-			module: app.getModuleName(),
-			view: app.getViewName(),
-			branches: selected,
-			filter: container.find('#moduleFilter').val(),
-			category: category
-		};
-	},
-});
diff --git a/public_html/layouts/basic/modules/Products/resources/TreeRecords.min.js b/public_html/layouts/basic/modules/Products/resources/TreeRecords.min.js
deleted file mode 100644
index bfd2b38fbeec..000000000000
--- a/public_html/layouts/basic/modules/Products/resources/TreeRecords.min.js
+++ /dev/null
@@ -1,4 +0,0 @@
-'use strict';
-
-Vtiger_TreeRecords_Js("Products_TreeRecords_Js",{},{getRecordsParams:function getRecordsParams(container){var selected=[],category=[];return $.each(this.treeInstance.jstree("get_selected",!0),function(index,value){value.original.isrecord?selected.push(value.text):category.push(value.original.record_id);}),{module:app.getModuleName(),view:app.getViewName(),branches:selected,filter:container.find("#moduleFilter").val(),category:category}}});
-//# sourceMappingURL=TreeRecords.min.js.map
diff --git a/public_html/layouts/basic/modules/Products/resources/TreeRecords.min.js.map b/public_html/layouts/basic/modules/Products/resources/TreeRecords.min.js.map
deleted file mode 100644
index b35c0276edf0..000000000000
--- a/public_html/layouts/basic/modules/Products/resources/TreeRecords.min.js.map
+++ /dev/null
@@ -1 +0,0 @@
-{"version":3,"file":"TreeRecords.min.js","sources":["TreeRecords.js"],"sourcesContent":["/* {[The file is published on the basis of YetiForce Public License 3.0 that can be found in the following directory: licenses/LicenseEN.txt or yetiforce.com]} */\n'use strict';\n\nVtiger_TreeRecords_Js(\"Products_TreeRecords_Js\", {}, {\n\tgetRecordsParams: function (container) {\n\t\tlet selected = [], category = [];\n\t\t$.each(this.treeInstance.jstree(\"get_selected\", true), function (index, value) {\n\t\t\tif (value.original.isrecord) {\n\t\t\t\tselected.push(value.text);\n\t\t\t} else {\n\t\t\t\tcategory.push(value.original.record_id);\n\t\t\t}\n\t\t});\n\t\treturn {\n\t\t\tmodule: app.getModuleName(),\n\t\t\tview: app.getViewName(),\n\t\t\tbranches: selected,\n\t\t\tfilter: container.find('#moduleFilter').val(),\n\t\t\tcategory: category\n\t\t};\n\t},\n});\n"],"names":["Vtiger_TreeRecords_Js","getRecordsParams","container","category","each","treeInstance","jstree","index","value","original","isrecord","selected","push","text","record_id","module","app","getModuleName","view","getViewName","branches","filter","find","val"],"mappings":";;AAGAA,sBAAsB,yBAAtB,CAAiD,EAAjD,CAAqD,CACpDC,iBAAkB,0BAAUC,SAAV,CAAqB,CACtC,aAAe,EAAf,CAAmBC,SAAW,EAA9B,CAQA,SAPEC,IAAF,CAAO,KAAKC,YAAL,CAAkBC,MAAlB,CAAyB,cAAzB,IAAP,CAAuD,SAAUC,KAAV,CAAiBC,KAAjB,CAAwB,CAC1EA,MAAMC,QAAN,CAAeC,QAD2D,CAE7EC,SAASC,IAAT,CAAcJ,MAAMK,IAApB,CAF6E,CAI7EV,SAASS,IAAT,CAAcJ,MAAMC,QAAN,CAAeK,SAA7B,EAED,CAND,CAOA,CAAO,CACNC,OAAQC,IAAIC,aAAJ,EADF,CAENC,KAAMF,IAAIG,WAAJ,EAFA,CAGNC,SAAUT,QAHJ,CAINU,OAAQnB,UAAUoB,IAAV,CAAe,eAAf,EAAgCC,GAAhC,EAJF,CAKNpB,SAAUA,QALJ,CAOP,CAjBmD,CAArD"}
\ No newline at end of file
diff --git a/public_html/layouts/basic/modules/Services/resources/TreeRecords.js b/public_html/layouts/basic/modules/Services/resources/TreeRecords.js
deleted file mode 100644
index de0d265ce7e2..000000000000
--- a/public_html/layouts/basic/modules/Services/resources/TreeRecords.js
+++ /dev/null
@@ -1,22 +0,0 @@
-/* {[The file is published on the basis of YetiForce Public License 3.0 that can be found in the following directory: licenses/LicenseEN.txt or yetiforce.com]} */
-'use strict';
-
-Vtiger_TreeRecords_Js("Services_TreeRecords_Js", {}, {
-	getRecordsParams: function (container) {
-		let selected = [], category = [];
-		$.each(this.treeInstance.jstree("get_selected", true), function (index, value) {
-			if (value.original.isrecord) {
-				selected.push(value.text);
-			} else {
-				category.push(value.original.record_id);
-			}
-		});
-		return {
-			module: app.getModuleName(),
-			view: app.getViewName(),
-			branches: selected,
-			filter: container.find('#moduleFilter').val(),
-			category: category
-		};
-	},
-});
diff --git a/public_html/layouts/basic/modules/Services/resources/TreeRecords.min.js b/public_html/layouts/basic/modules/Services/resources/TreeRecords.min.js
deleted file mode 100644
index 5b97ca83f7ad..000000000000
--- a/public_html/layouts/basic/modules/Services/resources/TreeRecords.min.js
+++ /dev/null
@@ -1,4 +0,0 @@
-'use strict';
-
-Vtiger_TreeRecords_Js("Services_TreeRecords_Js",{},{getRecordsParams:function getRecordsParams(container){var selected=[],category=[];return $.each(this.treeInstance.jstree("get_selected",!0),function(index,value){value.original.isrecord?selected.push(value.text):category.push(value.original.record_id);}),{module:app.getModuleName(),view:app.getViewName(),branches:selected,filter:container.find("#moduleFilter").val(),category:category}}});
-//# sourceMappingURL=TreeRecords.min.js.map
diff --git a/public_html/layouts/basic/modules/Services/resources/TreeRecords.min.js.map b/public_html/layouts/basic/modules/Services/resources/TreeRecords.min.js.map
deleted file mode 100644
index 193d467d4956..000000000000
--- a/public_html/layouts/basic/modules/Services/resources/TreeRecords.min.js.map
+++ /dev/null
@@ -1 +0,0 @@
-{"version":3,"file":"TreeRecords.min.js","sources":["TreeRecords.js"],"sourcesContent":["/* {[The file is published on the basis of YetiForce Public License 3.0 that can be found in the following directory: licenses/LicenseEN.txt or yetiforce.com]} */\n'use strict';\n\nVtiger_TreeRecords_Js(\"Services_TreeRecords_Js\", {}, {\n\tgetRecordsParams: function (container) {\n\t\tlet selected = [], category = [];\n\t\t$.each(this.treeInstance.jstree(\"get_selected\", true), function (index, value) {\n\t\t\tif (value.original.isrecord) {\n\t\t\t\tselected.push(value.text);\n\t\t\t} else {\n\t\t\t\tcategory.push(value.original.record_id);\n\t\t\t}\n\t\t});\n\t\treturn {\n\t\t\tmodule: app.getModuleName(),\n\t\t\tview: app.getViewName(),\n\t\t\tbranches: selected,\n\t\t\tfilter: container.find('#moduleFilter').val(),\n\t\t\tcategory: category\n\t\t};\n\t},\n});\n"],"names":["Vtiger_TreeRecords_Js","getRecordsParams","container","category","each","treeInstance","jstree","index","value","original","isrecord","selected","push","text","record_id","module","app","getModuleName","view","getViewName","branches","filter","find","val"],"mappings":";;AAGAA,sBAAsB,yBAAtB,CAAiD,EAAjD,CAAqD,CACpDC,iBAAkB,0BAAUC,SAAV,CAAqB,CACtC,aAAe,EAAf,CAAmBC,SAAW,EAA9B,CAQA,SAPEC,IAAF,CAAO,KAAKC,YAAL,CAAkBC,MAAlB,CAAyB,cAAzB,IAAP,CAAuD,SAAUC,KAAV,CAAiBC,KAAjB,CAAwB,CAC1EA,MAAMC,QAAN,CAAeC,QAD2D,CAE7EC,SAASC,IAAT,CAAcJ,MAAMK,IAApB,CAF6E,CAI7EV,SAASS,IAAT,CAAcJ,MAAMC,QAAN,CAAeK,SAA7B,EAED,CAND,CAOA,CAAO,CACNC,OAAQC,IAAIC,aAAJ,EADF,CAENC,KAAMF,IAAIG,WAAJ,EAFA,CAGNC,SAAUT,QAHJ,CAINU,OAAQnB,UAAUoB,IAAV,CAAe,eAAf,EAAgCC,GAAhC,EAJF,CAKNpB,SAAUA,QALJ,CAOP,CAjBmD,CAArD"}
\ No newline at end of file
diff --git a/public_html/layouts/basic/modules/Vtiger/resources/TreeRecords.js b/public_html/layouts/basic/modules/Vtiger/resources/TreeRecords.js
index f030086b982e..1126f19b32f6 100644
--- a/public_html/layouts/basic/modules/Vtiger/resources/TreeRecords.js
+++ b/public_html/layouts/basic/modules/Vtiger/resources/TreeRecords.js
@@ -87,8 +87,10 @@ jQuery.Class(
 			AppConnector.request(thisInstance.getRecordsParams(container))
 				.done(function(data) {
 					container.find('#recordsListContents').html(data);
-					container.find('#recordsListContents table').dataTable();
-
+					container.find('#recordsListContents table').dataTable({classes: {sLengthSelect: 'select2'}});
+					App.Fields.Picklist.showSelect2ElementView(container.find('select.select2'), {dropdownCss: {'z-index': 0}});
+					$('.select2-container', '.dataTables_length').addClass('d-inline-block w-50 ml-2 mr-2');
+					container.find('#recordsListContents').addClass('mt-2');
 					progressIndicator.progressIndicator({ mode: 'hide' });
 				})
 				.fail(function(error) {
@@ -106,6 +108,7 @@ jQuery.Class(
 			thisInstance.treeInstance.on('changed.jstree', function(e, data) {
 				thisInstance.getRecordsList();
 			});
+			thisInstance.treeInstance.trigger('changed.jstree');
 		},
 		registerEvents: function() {
 			var container = this.getContainer();
diff --git a/public_html/layouts/basic/styles/Main.css b/public_html/layouts/basic/styles/Main.css
index 7284908b9ad5..726af8234ff3 100644
--- a/public_html/layouts/basic/styles/Main.css
+++ b/public_html/layouts/basic/styles/Main.css
@@ -18909,6 +18909,53 @@ body > .o-exception-fixed-block {
   margin-bottom: 0; }
 
 /* {[The file is published on the basis of YetiForce Public License 3.0 that can be found in the following directory: licenses/LicenseEN.txt or yetiforce.com]} */
+/* tree view - start */
+.treeviewViewContainer td > a {
+  color: inherit !important; }
+
+.treeviewViewContainer .widget_header {
+  margin-right: -20px;
+  margin-left: -25px; }
+
+@media (min-width: 992px) {
+  .treeviewViewContainer.js-sitebar--active {
+    width: 75% !important;
+    padding-right: 1rem !important; } }
+
+.container-fluid[class$="-treerecords-container"] .c-menu--open .basePanel .toggleSiteBarRightButton,
+.container-fluid[class$="-treerecords-container"] .basePanel .toggleSiteBarRightButton {
+  background: #f8f9fa;
+  font-weight: bold;
+  padding: 15px 0 !important;
+  position: fixed;
+  top: 50%;
+  right: 25%;
+  cursor: pointer;
+  width: 17px;
+  z-index: 100;
+  border: 1px solid #ccc;
+  border-right: 0;
+  display: inline-block;
+  border-radius: 0; }
+
+.container-fluid[class$="-treerecords-container"] .c-menu--open .basePanel .toggleSiteBarRightButton {
+  right: calc(25% - 50px); }
+
+@media (max-width: 992px) {
+  .container-fluid[class$="-treerecords-container"] .c-menu--open .basePanel .toggleSiteBarRightButton,
+  .container-fluid[class$="-treerecords-container"] .basePanel .toggleSiteBarRightButton {
+    display: none; }
+
+  .container-fluid[class$="-treerecords-container"] .siteBarRight {
+    left: 0px; }
+
+  .container-fluid[class$="-treerecords-container"] .c-menu--open .siteBarRight {
+    width: 100% !important; } }
+
+.container-fluid[class$="-treerecords-container"] .hideToggleSiteBarRightButton {
+  right: 7px !important; }
+/* tree view - end */
+
 .calendarViewContainer .widget_header {
   margin-right: -20px;
   margin-left: -25px; }