From ddc57a8a69ad1f2417f039c73bffa001b16592a2 Mon Sep 17 00:00:00 2001
From: Alex Bourret <alexandre.bourret@dataiku.com>
Date: Mon, 26 Jan 2026 10:48:50 +0100
Subject: [PATCH 01/12] merging template and category search on tree explorer

---
 js/pi-system_treecontroller.js      | 21 ++++++++-
 python-lib/osisoft_client.py        | 37 +++++++++++++++
 resource/browse_af_tree.py          | 71 +++++++++++++++++++++++++----
 resource/pi-system_af-explorer.html | 16 +++++++
 4 files changed, 135 insertions(+), 10 deletions(-)

diff --git a/js/pi-system_treecontroller.js b/js/pi-system_treecontroller.js
index 09c97d8..aa3b16d 100644
--- a/js/pi-system_treecontroller.js
+++ b/js/pi-system_treecontroller.js
@@ -89,8 +89,24 @@ app.controller('AfExplorerFormCtrl', [
         return item;
       });
     } 
-        
-        
+
+    $scope.getTemplatesFromDB = function() {
+      $scope.callPythonDo({method: "get_templates_from_db"}).then(function(data){
+        $scope.config.templates = data.choices;
+      });
+    }
+
+    $scope.getCategoriesFromDB = function(){
+      $scope.config.attribute_categories = [];
+      $scope.config.element_categories = [];
+      $scope.callPythonDo({method: "get_attribute_categories_from_db"}).then(function(data){
+        $scope.config.attribute_categories = data.choices;
+      });
+      $scope.callPythonDo({method: "get_element_categories_from_db"}).then(function(data){
+        $scope.config.element_categories = data.choices;
+      });
+    }
+
   // Toggle récursif des checkboxes
   $scope.toggleChildren = function(node) {
     console.log("ALX:tc:" + JSON.stringify(node));
@@ -110,6 +126,7 @@ app.controller('AfExplorerFormCtrl', [
         function(data){
           TreeDataService.setTreeData(data.choices);
           $scope.config.treeData = TreeDataService.getTreeData();
+          console.log("ALX:", JSON.stringify($scope.config.treeData));
           $scope.config.attributeList = data.attributes;
           $scope.config.selectedAttributes = [];
         }
diff --git a/python-lib/osisoft_client.py b/python-lib/osisoft_client.py
index 71c39c1..5c853d9 100644
--- a/python-lib/osisoft_client.py
+++ b/python-lib/osisoft_client.py
@@ -748,6 +748,41 @@ def search_attributes(self, database_webid, **kwargs):
             else:
                 json_response = None
 
+    def search_elements(self, database_webid, name=None, description=None, category=None, template=None, full_search=True):
+        headers = self.get_requests_headers()
+        tempo_maxcount = OSIsoftConstants.DEFAULT_MAXCOUNT
+        params = {
+            "maxCount": tempo_maxcount,
+            "associations": "Paths",
+        }
+        # # https://dku-qa-osi.francecentral.cloudapp.azure.com/piwebapi/assetdatabases/F1RD3VEt1yTvt0ip6-/elements?TemplateName=Substation transformer&categoryName=Westinghouse&nameFilter=TX26*&searchFullHierarchy=true
+        url = self.endpoint.get_base_url() + "/assetdatabases/{}/elements".format(database_webid)
+        if name:
+            params["nameFilter"] = name
+        if description:
+            params["descriptionFilter"] = description
+        if category:
+            params["categoryName"] = category
+        if template:
+            params["templateName"] = template
+        if full_search:
+            params["searchFullHierarchy"] = True
+        json_response = self.get(url=url, headers=headers, params=params)
+        if OSIsoftConstants.DKU_ERROR_KEY in json_response:
+            yield json_response
+        start_index = 0
+        while json_response:
+            items = json_response.get(OSIsoftConstants.API_ITEM_KEY, [])
+            for item in items:
+                yield item
+            if len(items) < tempo_maxcount:
+                logger.info("No more result items")
+                return
+            start_index += tempo_maxcount
+            logger.info("Trying again with startIndex={}".format(start_index))
+            params["startIndex"] = start_index
+            json_response = self.get(url=url, headers=headers, params=params)
+
     def build_element_query(self, **kwargs):
         element_query_keys = {
             "element_name": "Name:'{}'",
@@ -866,6 +901,8 @@ def traverse_and_cache(self, path_elements, path_attributes, tree):
                 json_response = self.get(url=next_url, headers=headers, params={}, error_source="traverse_and_cache")
             else:
                 break
+        if not before_last_json:
+            return None
         items = before_last_json.get(OSIsoftConstants.API_ITEM_KEY, [])
         for item in items:
             item_details = get_item_details(item)
diff --git a/resource/browse_af_tree.py b/resource/browse_af_tree.py
index 91b3f6d..dbf6984 100644
--- a/resource/browse_af_tree.py
+++ b/resource/browse_af_tree.py
@@ -51,7 +51,28 @@ def do(payload, config, plugin_config, inputs):
         database_name = config.get("database_name")
         parent = payload.get("parent", {})
         return get_children_from_db(client, parent, database_name=database_name)
+    if method == "get_templates_from_db":
+        database_name = config.get("database_name")
+        parent = payload.get("parent", {})
+        ret = get_items_from_db(client, parent, "ElementTemplates", database_name=database_name)
+        return ret
+    if method == "get_attribute_categories_from_db":
+        database_name = config.get("database_name")
+        parent = payload.get("parent", {})
+        ret = get_items_from_db(client, parent, "AttributeCategories", database_name=database_name)
+        return ret
+    if method == "get_element_categories_from_db":
+        database_name = config.get("database_name")
+        parent = payload.get("parent", {})
+        ret = get_items_from_db(client, parent, "ElementCategories", database_name=database_name)
+        return ret
     if method == "do_search":
+        template_name = config.get("template", None)
+        category_name = config.get("element_category", None)
+        if template_name == "-- Any --":
+            template_name = None
+        if category_name == "-- Any --":
+            category_name = None
         database_name = config.get("database_name")
         element_name = config.get("element_name")
         attribute_name = config.get("attribute_name")
@@ -73,14 +94,29 @@ def do(payload, config, plugin_config, inputs):
         #     "attribute_category": "CategoryName:'{}'",
         #     "attribute_value_type": "Type:'{}'"
         # }
-        for attribute in client.search_attributes(
-            database_webid,
-            attribute_name=attribute_name,
-            element_name=element_name,
-            search_associations="Paths"
-        ):
-            attribute["checked"] = False
-            attributes.append(attribute)
+        # for attribute in client.search_attributes(
+        #     database_webid,
+        #     attribute_name=attribute_name,
+        #     element_name=element_name,
+        #     search_associations="Paths"
+        # ):
+        #     attribute["checked"] = False
+        #     attributes.append(attribute)
+        attributes = []
+        if template_name or category_name:
+            for attribute in client.search_elements(database_webid, name=element_name, template=template_name, category=category_name, full_search=True):
+                attribute["checked"] = True
+                attributes.append(attribute)
+        else:
+            for attribute in client.search_attributes(
+                database_webid,
+                attribute_name=attribute_name,
+                element_name=element_name,
+                search_associations="Paths"
+            ):
+                attribute["checked"] = True
+                attributes.append(attribute)
+
         attributes = duplicate_linked_attributes(attributes)
         items = []
         for attribute in attributes:
@@ -123,6 +159,25 @@ def get_query_catalogs(cnx, config):
     return {"choices": [user, password]}
 
 
+def get_items_from_db(client, parent_node, link_key, database_name=None):
+    default_choice = {"title": "-- Any --"}
+    if isinstance(parent_node, dict):
+        url = parent_node.get("url", database_name)
+    else:
+        url = parent_node
+    this_node = next(client.get_next_item_from_url(url))
+    links = this_node.get("Links", {})
+    items_url = links.get(link_key)
+    items = []
+    items.append(default_choice)
+    if items_url:
+        for item in client.get_next_item_from_url(items_url):
+            item = get_item_details(item)
+            item["type"] = link_key
+            items.append(item)
+    return {"choices": items}
+
+
 def get_children_from_db(client, parent_node, database_name=None):
     if isinstance(parent_node, dict):
         url = parent_node.get("url", database_name)
diff --git a/resource/pi-system_af-explorer.html b/resource/pi-system_af-explorer.html
index d331c88..4330f56 100644
--- a/resource/pi-system_af-explorer.html
+++ b/resource/pi-system_af-explorer.html
@@ -56,9 +56,20 @@
             <div style="margin-bottom:8px;">
                 <input id="ReturnsName" ng-model="config.element_name" type="text" data-container="body" data-html="true"
                     data-placement="right" data-toggle="tooltip" title="blaa" placeholder="Search element" />
+                <select dku-bs-select
+                        ng-model="config.template"
+                        ng-options="dbn.title as dbn.title for dbn in config.templates"
+                        ng-init="getTemplatesFromDB()">
+                </select>
+                <select dku-bs-select
+                            ng-model="config.element_category"
+                            ng-options="dbn.title as dbn.title for dbn in config.element_categories"
+                            ng-init="getCategoriesFromDB()">
+                    </select>
                 <button ng-click="doSearch(config.element_name, config.attribute_name)" class="btn btn--secondary link-like"
                     id="get-query-dim-prop">Search</button>
             </div>
+
             <ul ng-if="config.treeData.length">
                 <li ng-repeat="node in config.treeData track by node.id">
                     <tree-node node="node"></tree-node>
@@ -72,6 +83,11 @@
             <div style="margin-bottom:8px;">
                 <input id="ReturnsType" list="datatypes" ng-model="config.attribute_name" type="text" data-container="body"
                     data-html="true" data-placement="right" data-toggle="tooltip" title="" placeholder="Search attribute" />
+                    <select dku-bs-select
+                            ng-model="config.attribute_category"
+                            ng-options="dbn.title as dbn.title for dbn in config.attribute_categories"
+                            ng-init="getCategoriesFromDB()">
+                    </select>
                 <button ng-click="doSearch(config.element_name, config.attribute_name)" class="btn btn--secondary link-like"
                     id="get-query-dim-prop">Search</button>
             </div>

From ad1402f3f91e1dcaca5658a4c1b59ab5c42fe00a Mon Sep 17 00:00:00 2001
From: Alex Bourret <alexandre.bourret@dataiku.com>
Date: Tue, 27 Jan 2026 10:26:25 +0100
Subject: [PATCH 02/12] use more generic batched search approach

---
 python-lib/osisoft_client.py | 57 +++++++++++++++++++++++++++++++++++-
 resource/browse_af_tree.py   | 43 +++++++--------------------
 2 files changed, 66 insertions(+), 34 deletions(-)

diff --git a/python-lib/osisoft_client.py b/python-lib/osisoft_client.py
index 5c853d9..7fb91ee 100644
--- a/python-lib/osisoft_client.py
+++ b/python-lib/osisoft_client.py
@@ -783,6 +783,61 @@ def search_elements(self, database_webid, name=None, description=None, category=
             params["startIndex"] = start_index
             json_response = self.get(url=url, headers=headers, params=params)
 
+    def batched_search(self, element_name, attribute_name, element_category, attribute_category, template):
+        attribute_query = {
+                                "searchFullHierarchy": "true",
+                                "selectedFields": "Items.WebId;Items.Path"}
+        if attribute_name:
+            attribute_query["nameFilter"] = attribute_name
+        if attribute_category:
+            attribute_query["categoryName"] = attribute_category
+        request_body = {
+            "database": {
+                "Method": "GET",
+                "Resource": "https://dku-qa-osi.francecentral.cloudapp.azure.com/piwebapi/assetdatabases?path=\\\\osisoft-pi-serv\\Well&selectedFields=WebId;Path;Links"
+            },
+            "elements": {
+                "Method": "GET",
+                "Resource": "{{0}}{}".format(
+                    build_query_string("", {
+                        "templateName": template,
+                        "categoryName": element_category,
+                        "nameFilter": element_name,
+                        "searchFullHierarchy": "true",
+                        "selectedFields": "Items.WebId;Items.Path;Items.Links"
+                        }
+                    )
+                ),
+                "ParentIds": ["database"],
+                "Parameters": ["$.database.Content.Links.Elements"]
+            },
+            "attributes": {
+                "Method": "GET",
+                "RequestTemplate": {
+                    "Resource": "{{0}}{}".format(
+                        build_query_string("", attribute_query)
+                    )  #?searchFullHierarchy=true&selectedFields=Items.WebId;Items.Path"
+                },  # build_attribute_query(attribute_name, attribute_category)
+                "ParentIds": ["elements"],
+                "Parameters": ["$.elements.Content.Items[*].Links.Attributes"]
+            }
+        }
+        url = self.endpoint.get_batch_endpoint()
+        headers = OSIsoftConstants.WRITE_HEADERS
+        response = self.post(url, headers=headers, data=request_body, params={})
+        json_response = response.json()
+        attributes = json_response.get("attributes", {})
+        attributes_content = attributes.get("Content", {})
+        if not isinstance(attributes_content, dict):
+            # the search returned nothing
+            return
+        attributes_content_items = attributes_content.get("Items", [])
+        for attributes_content_item in attributes_content_items:
+            content = attributes_content_item.get("Content", {})
+            sub_items = content.get("Items", [])
+            for sub_item in sub_items:
+                yield sub_item
+
     def build_element_query(self, **kwargs):
         element_query_keys = {
             "element_name": "Name:'{}'",
@@ -1152,7 +1207,7 @@ def build_query_string(url, params):
         if isinstance(value, list):
             for element in value:
                 tokens.append(key+"="+str(element))
-        else:
+        elif value is not None:
             tokens.append(key+"="+str(value))
     if len(tokens) > 0:
         return url + "?" + "&".join(tokens)
diff --git a/resource/browse_af_tree.py b/resource/browse_af_tree.py
index dbf6984..22be6e6 100644
--- a/resource/browse_af_tree.py
+++ b/resource/browse_af_tree.py
@@ -73,6 +73,12 @@ def do(payload, config, plugin_config, inputs):
             template_name = None
         if category_name == "-- Any --":
             category_name = None
+        element_category = config.get("element_category", None)
+        if element_category == "-- Any --":
+            element_category = None
+        attribute_category = config.get("attribute_category", None)
+        if attribute_category == "-- Any --":
+            attribute_category = None
         database_name = config.get("database_name")
         element_name = config.get("element_name")
         attribute_name = config.get("attribute_name")
@@ -82,40 +88,11 @@ def do(payload, config, plugin_config, inputs):
         attributes = []
         # https://dku-qa-osi.francecentral.cloudapp.azure.com/piwebapi/assetdatabases/F1RD3VEt1yTvt0ip6-a5yeEVsgbMcrwu_Je0qg9btcZIvPswT1NJU09GVC1QSS1TRVJWXFdFTEw
         database_webid = database_name.split("/")[-1]
-        # element_query_keys = {
-        #     "element_name": "Name:'{}'",
-        #     "search_root_path": "Root:'{}'",
-        #     "element_template": "Template:'{}'",
-        #     "element_type": "Type:'{}'",
-        #     "element_category": "CategoryName:'{}'"
-        # }
-        # attribute_query_keys = {
-        #     "attribute_name": "Name:'{}'",
-        #     "attribute_category": "CategoryName:'{}'",
-        #     "attribute_value_type": "Type:'{}'"
-        # }
-        # for attribute in client.search_attributes(
-        #     database_webid,
-        #     attribute_name=attribute_name,
-        #     element_name=element_name,
-        #     search_associations="Paths"
-        # ):
-        #     attribute["checked"] = False
-        #     attributes.append(attribute)
+
         attributes = []
-        if template_name or category_name:
-            for attribute in client.search_elements(database_webid, name=element_name, template=template_name, category=category_name, full_search=True):
-                attribute["checked"] = True
-                attributes.append(attribute)
-        else:
-            for attribute in client.search_attributes(
-                database_webid,
-                attribute_name=attribute_name,
-                element_name=element_name,
-                search_associations="Paths"
-            ):
-                attribute["checked"] = True
-                attributes.append(attribute)
+        for result in client.batched_search(element_name, attribute_name, element_category, attribute_category, template_name):
+            result["checked"] = True
+            attributes.append(result)
 
         attributes = duplicate_linked_attributes(attributes)
         items = []

From 5f030e77c112b1dae8236d9bc4d2e1f7eb8dd9de Mon Sep 17 00:00:00 2001
From: Alex Bourret <alexandre.bourret@dataiku.com>
Date: Tue, 27 Jan 2026 15:45:38 +0100
Subject: [PATCH 03/12] fix virtual links

---
 python-lib/osisoft_client.py | 7 ++++---
 1 file changed, 4 insertions(+), 3 deletions(-)

diff --git a/python-lib/osisoft_client.py b/python-lib/osisoft_client.py
index 7fb91ee..f02f429 100644
--- a/python-lib/osisoft_client.py
+++ b/python-lib/osisoft_client.py
@@ -785,8 +785,9 @@ def search_elements(self, database_webid, name=None, description=None, category=
 
     def batched_search(self, element_name, attribute_name, element_category, attribute_category, template):
         attribute_query = {
-                                "searchFullHierarchy": "true",
-                                "selectedFields": "Items.WebId;Items.Path"}
+            "searchFullHierarchy": "true",
+            "associations": "Paths"
+        }
         if attribute_name:
             attribute_query["nameFilter"] = attribute_name
         if attribute_category:
@@ -804,7 +805,7 @@ def batched_search(self, element_name, attribute_name, element_category, attribu
                         "categoryName": element_category,
                         "nameFilter": element_name,
                         "searchFullHierarchy": "true",
-                        "selectedFields": "Items.WebId;Items.Path;Items.Links"
+                        "associations": "Paths"
                         }
                     )
                 ),

From 19af2862fef2a0bb7d380e725a365fdec2639c3e Mon Sep 17 00:00:00 2001
From: Alex Bourret <alexandre.bourret@dataiku.com>
Date: Tue, 3 Feb 2026 13:17:58 +0100
Subject: [PATCH 04/12] use the database name for batched search

---
 python-lib/osisoft_client.py | 46 +++++++++++++++++++++++++++++-------
 resource/browse_af_tree.py   |  2 +-
 2 files changed, 38 insertions(+), 10 deletions(-)

diff --git a/python-lib/osisoft_client.py b/python-lib/osisoft_client.py
index f02f429..d90aaa1 100644
--- a/python-lib/osisoft_client.py
+++ b/python-lib/osisoft_client.py
@@ -783,7 +783,7 @@ def search_elements(self, database_webid, name=None, description=None, category=
             params["startIndex"] = start_index
             json_response = self.get(url=url, headers=headers, params=params)
 
-    def batched_search(self, element_name, attribute_name, element_category, attribute_category, template):
+    def batched_search(self, database, element_name, attribute_name, element_category, attribute_category, template):
         attribute_query = {
             "searchFullHierarchy": "true",
             "associations": "Paths"
@@ -792,14 +792,13 @@ def batched_search(self, element_name, attribute_name, element_category, attribu
             attribute_query["nameFilter"] = attribute_name
         if attribute_category:
             attribute_query["categoryName"] = attribute_category
+        elements_url = "{}/elements".format(database)
+        print("ALX:fetching direct from {}".format(elements_url))
         request_body = {
-            "database": {
-                "Method": "GET",
-                "Resource": "https://dku-qa-osi.francecentral.cloudapp.azure.com/piwebapi/assetdatabases?path=\\\\osisoft-pi-serv\\Well&selectedFields=WebId;Path;Links"
-            },
             "elements": {
                 "Method": "GET",
-                "Resource": "{{0}}{}".format(
+                "Resource": "{}{}".format(
+                    elements_url,
                     build_query_string("", {
                         "templateName": template,
                         "categoryName": element_category,
@@ -808,9 +807,7 @@ def batched_search(self, element_name, attribute_name, element_category, attribu
                         "associations": "Paths"
                         }
                     )
-                ),
-                "ParentIds": ["database"],
-                "Parameters": ["$.database.Content.Links.Elements"]
+                )
             },
             "attributes": {
                 "Method": "GET",
@@ -823,6 +820,37 @@ def batched_search(self, element_name, attribute_name, element_category, attribu
                 "Parameters": ["$.elements.Content.Items[*].Links.Attributes"]
             }
         }
+        # request_body = {
+        #     "database": {
+        #         "Method": "GET",
+        #         "Resource": "https://osisoft/piwebapi/assetdatabases?path=\\\\osisoft-pi-serv\\Well&selectedFields=WebId;Path;Links"
+        #     },
+        #     "elements": {
+        #         "Method": "GET",
+        #         "Resource": "{{0}}{}".format(
+        #             build_query_string("", {
+        #                 "templateName": template,
+        #                 "categoryName": element_category,
+        #                 "nameFilter": element_name,
+        #                 "searchFullHierarchy": "true",
+        #                 "associations": "Paths"
+        #                 }
+        #             )
+        #         ),
+        #         "ParentIds": ["database"],
+        #         "Parameters": ["$.database.Content.Links.Elements"]
+        #     },
+        #     "attributes": {
+        #         "Method": "GET",
+        #         "RequestTemplate": {
+        #             "Resource": "{{0}}{}".format(
+        #                 build_query_string("", attribute_query)
+        #             )  #?searchFullHierarchy=true&selectedFields=Items.WebId;Items.Path"
+        #         },  # build_attribute_query(attribute_name, attribute_category)
+        #         "ParentIds": ["elements"],
+        #         "Parameters": ["$.elements.Content.Items[*].Links.Attributes"]
+        #     }
+        # }
         url = self.endpoint.get_batch_endpoint()
         headers = OSIsoftConstants.WRITE_HEADERS
         response = self.post(url, headers=headers, data=request_body, params={})
diff --git a/resource/browse_af_tree.py b/resource/browse_af_tree.py
index 22be6e6..94737f8 100644
--- a/resource/browse_af_tree.py
+++ b/resource/browse_af_tree.py
@@ -90,7 +90,7 @@ def do(payload, config, plugin_config, inputs):
         database_webid = database_name.split("/")[-1]
 
         attributes = []
-        for result in client.batched_search(element_name, attribute_name, element_category, attribute_category, template_name):
+        for result in client.batched_search(database_name, element_name, attribute_name, element_category, attribute_category, template_name):
             result["checked"] = True
             attributes.append(result)
 

From 0940e2cab7ceebd3feb79ea0deb7500ac7212de7 Mon Sep 17 00:00:00 2001
From: JaneBellaiche <jane.bellaiche@dataiku.com>
Date: Tue, 3 Feb 2026 15:35:00 +0100
Subject: [PATCH 05/12] UI for authentication params

---
 js/pi-system_treecontroller.js      | 26 +++++++++
 resource/pi-system_af-explorer.css  | 13 +++++
 resource/pi-system_af-explorer.html | 85 +++++++++++++++++------------
 3 files changed, 88 insertions(+), 36 deletions(-)

diff --git a/js/pi-system_treecontroller.js b/js/pi-system_treecontroller.js
index aa3b16d..7965f46 100644
--- a/js/pi-system_treecontroller.js
+++ b/js/pi-system_treecontroller.js
@@ -51,6 +51,10 @@ app.controller('AfExplorerFormCtrl', [
                 return p.description || '<em>No description</em>';
             });
         }).error(setErrorInScope.bind($scope.errorScope));
+        if($scope.authConfigured() === true){
+          $scope.authSectionVisible = false;
+          $scope.showTreeData = true;
+        }
     };
     
     $scope.getServers = function(){
@@ -63,6 +67,28 @@ app.controller('AfExplorerFormCtrl', [
         $scope.database_name = data.choices;
       });
     };
+
+    $scope.authSectionVisible = $scope.authSectionVisible || true;
+
+    $scope.toggleAuthSection = function() {
+      $scope.authSectionVisible = !$scope.authSectionVisible;
+    };
+
+    $scope.authConfigured = function(){
+      console.log('authConfigured check');
+      return $scope.hasPreset() && $scope.config.database_name && $scope.config.database_name.length > 0 && $scope.config.server_name && $scope.config.server_name.length > 0 ;
+    }
+    $scope.explore = function() {
+      console.log("coucou");
+      if ($scope.authConfigured()) {
+        console.log("here");
+        $scope.showTreeData = true;
+      }
+    };
+
+    $scope.hasPreset = function() {
+      return $scope.config.credentials && $scope.config.credentials.mode && $scope.config.credentials.mode!=='NONE' && $scope.config.credentials.name
+    }
       
     $scope.initializeTree = function(){
         console.log("initialization: ");
diff --git a/resource/pi-system_af-explorer.css b/resource/pi-system_af-explorer.css
index 575492b..2ef20fd 100644
--- a/resource/pi-system_af-explorer.css
+++ b/resource/pi-system_af-explorer.css
@@ -14,3 +14,16 @@
 .pi-system-explorer__tree-view, .pi-system-explorer__center-view {
     border: 1px solid #ccc; padding: 10px; border-radius: 5px;
 }
+
+.pi-system-explorer__authentication-header {
+    background-color: #f0f0f0;
+    padding: 10px;
+    cursor: pointer;
+    border: 1px solid #ccc;
+    border-radius: 5px;
+    font-weight: bold;
+}
+
+.pi-system-explorer__authentication-body {
+    border: 1px solid #ccc; padding: 10px; border-radius: 5px;
+}
\ No newline at end of file
diff --git a/resource/pi-system_af-explorer.html b/resource/pi-system_af-explorer.html
index 4330f56..e940612 100644
--- a/resource/pi-system_af-explorer.html
+++ b/resource/pi-system_af-explorer.html
@@ -1,43 +1,56 @@
 <link rel="stylesheet" href="/plugins/pi-system/resource/pi-system_af-explorer.css">
 <div ng-controller="AfExplorerFormCtrl" ng-init="init()" style="margin: 10px 0px;">
-    <div class="control-group">
-        <label class="control-label" for="pi-system-credentials">Pi System connection</label>
-        <div class="dib">
-            <div autoconfig-preset-element
-                param-desc="paramDesc"
-                model="config.credentials"
-                plugin-id="pi-system"
-                accessible-parameter-set-descriptions="accessibleParameterSetDescriptions"
-                accessible-presets="accessiblePresets"
-                inline-params="inlineParams"
-                inline-plugin-params="inlinePluginParams"
-                error-scope="errorScope"
-                required>
+    <div class="pi-system-explorer__authentication">
+        <div class="pi-system-explorer__authentication-header" ng-click="toggleAuthSection()">
+            <strong>Welcome to Pi System Plugin</strong>
+        </div>
+       <div class="pi-system-explorer__authentication-body" ng-show="authSectionVisible">
+        <div class="control-group">
+            <label class="control-label" for="pi-system-credentials">Pi System connection</label>
+            <div class="dib">
+                <div autoconfig-preset-element
+                    param-desc="paramDesc"
+                    model="config.credentials"
+                    plugin-id="pi-system"
+                    accessible-parameter-set-descriptions="accessibleParameterSetDescriptions"
+                    accessible-presets="accessiblePresets"
+                    inline-params="inlineParams"
+                    inline-plugin-params="inlinePluginParams"
+                    error-scope="errorScope"
+                    required>
+                </div>
             </div>
         </div>
+        <div class="control-group removed-if-manual-query" ng-if="config.credentials && config.credentials.mode && config.credentials.mode!=='NONE' && config.credentials.name">
+        <label class="control-label">Server</label>
+        <div class="controls">
+            <select dku-bs-select
+                    ng-model="config.server_name"
+                    ng-options="sv.value as sv.label for sv in server_name"
+                    ng-init="getServers()"
+            > 
+            </select>
+        </div>
+        </div>
+        <div class="control-group removed-if-manual-query" ng-if="config.server_name">
+            <label class="control-label">Database</label>
+            <div class="controls">
+                <select dku-bs-select
+                        ng-model="config.database_name"
+                        ng-change="initializeTree()"
+                        ng-options="dbn.value as dbn.label for dbn in database_name"
+                        ng-init="getDatabases()"> 
+                </select>
+            </div>
+            <div>
+                <input type="checkbox" ng-model="config.use_ssl"> Use SSL
+            </div>
+        </div>
+                   
+        <button ng-click="explore()" class="btn btn--secondary link-like"
+            id="load-tree-data">Explore
+        </button>
     </div>
-    <div class="control-group removed-if-manual-query" ng-if="config.credentials && config.credentials.mode && config.credentials.mode!=='NONE' && config.credentials.name">
-       <label class="control-label">Server</label>
-       <div class="controls">
-           <select dku-bs-select
-                   ng-model="config.server_name"
-                   ng-options="sv.value as sv.label for sv in server_name"
-                   ng-init="getServers()"
-           > 
-           </select>
-       </div>
-   </div>
-   <div class="control-group removed-if-manual-query" ng-if="config.server_name">
-       <label class="control-label">Database</label>
-       <div class="controls">
-           <select dku-bs-select
-                   ng-model="config.database_name"
-                   ng-change="initializeTree()"
-                   ng-options="dbn.value as dbn.label for dbn in database_name"
-                   ng-init="getDatabases()"> 
-           </select>
-       </div>
-       
    </div>
        <div class="control-group removed-if-manual-query"  ng-show="false" ng-if="config.database_name">
        <label class="control-label">Tree</label>
@@ -50,7 +63,7 @@
        </div>
 
    </div>
-    <div class="pi-system-explorer__main">
+    <div class="pi-system-explorer__main" ng-if="showTreeData">
         <div ng-if="config.database_name" ng-init="initializeTree()" class="pi-system-explorer__tree-view">
             <div><strong>Elements</strong></div>
             <div style="margin-bottom:8px;">

From ca4f68ae4ba8c2f4615056bc15ffce93555adf1a Mon Sep 17 00:00:00 2001
From: JaneBellaiche <jane.bellaiche@dataiku.com>
Date: Tue, 3 Feb 2026 20:52:24 +0100
Subject: [PATCH 06/12] *temporary frontend fix to have attributes unselected
 by default after a search * highlight elements when clicking on it from the
 tree view * clear element input when clicking on an other element from the
 tree view

---
 js/pi-system_treecontroller.js | 8 ++++++--
 1 file changed, 6 insertions(+), 2 deletions(-)

diff --git a/js/pi-system_treecontroller.js b/js/pi-system_treecontroller.js
index 7965f46..040662d1 100644
--- a/js/pi-system_treecontroller.js
+++ b/js/pi-system_treecontroller.js
@@ -153,7 +153,8 @@ app.controller('AfExplorerFormCtrl', [
           TreeDataService.setTreeData(data.choices);
           $scope.config.treeData = TreeDataService.getTreeData();
           console.log("ALX:", JSON.stringify($scope.config.treeData));
-          $scope.config.attributeList = data.attributes;
+          //todo: correct fix is to not have checked:true in the backend in the first place
+          $scope.config.attributeList = data.attributes.map(el=>({...el, checked:false})); 
           $scope.config.selectedAttributes = [];
         }
       );
@@ -193,12 +194,15 @@ $scope.displayAttributes = function(node) {
   }
 
 function processNode(node) {
+    if (node.title !== $scope.config.element_name) {
+      $scope.config.element_name = "";
+    }
     $scope.config.attributeList =  [];
     $scope.config.selectedAttributes =  [];
     node.children.forEach(child => {
         if (child.type === "attribute") {
             $scope.config.attributeList.push({
-                "name": child.title,
+                "title": child.title,
                 "path": child.path
             });
         }

From 533a77375a0669b348d3e6527f5211f8ff2ce207 Mon Sep 17 00:00:00 2001
From: JaneBellaiche <jane.bellaiche@dataiku.com>
Date: Tue, 3 Feb 2026 21:02:08 +0100
Subject: [PATCH 07/12] *use js better practices *formatting

---
 js/pi-system_treecontroller.js      | 326 ++++++++++++++--------------
 resource/pi-system_af-explorer.html | 146 ++++++-------
 2 files changed, 232 insertions(+), 240 deletions(-)

diff --git a/js/pi-system_treecontroller.js b/js/pi-system_treecontroller.js
index 040662d1..55807e0 100644
--- a/js/pi-system_treecontroller.js
+++ b/js/pi-system_treecontroller.js
@@ -1,84 +1,84 @@
 var app = angular.module('piSystemTreeApp.module', []);
 
-app.service('TreeDataService', function() {
+app.service('TreeDataService', function () {
   // This will store the shared tree data
   this.treeData = [];
 
   // Optional: helper methods
-  this.setTreeData = function(data) {
+  this.setTreeData = function (data) {
     this.treeData = data;
   };
 
-  this.getTreeData = function() {
+  this.getTreeData = function () {
     return this.treeData;
   };
 });
 
 app.controller('AfExplorerFormCtrl', [
-  '$scope', 
-  '$stateParams', 
-  'CodeMirrorSettingService', 
-  'TreeDataService', 
-  function($scope, $stateParams, CodeMirrorSettingService, TreeDataService) {
-    
+  '$scope',
+  '$stateParams',
+  'CodeMirrorSettingService',
+  'TreeDataService',
+  function ($scope, $stateParams, CodeMirrorSettingService, TreeDataService) {
+
     $scope.paramDesc = {
       'parameterSetId': 'basic-auth',
       'mandatory': true
     };
-    
+
     $scope.treeData = TreeDataService.getTreeData();
     $scope.config.attributeList = $scope.config.attributeList || [];
     $scope.config.selectedAttributes = $scope.config.selectedAttributes || [];
-    
+
     $scope.editorOptions = CodeMirrorSettingService.get("text/plain");
 
-    $scope.init = function() {
-        DataikuAPI.plugins.listAccessiblePresets('pi-system', $stateParams.projectKey, 'basic-auth').success(function (data) {
-            $scope.inlineParams = data.inlineParams;
-            $scope.inlinePluginParams = data.inlinePluginParams;
-            $scope.accessiblePresets = [];
-            if (data.definableInline) {
-                $scope.accessiblePresets.push({
-                    name:"INLINE",
-                    label:"Manually defined", usable:true,
-                    description: "Define values for these parameters"
-                });
-            }
-            data.presets.forEach(function(p) {
-                $scope.accessiblePresets.push({name:"PRESET " + p.name, label:p.name, usable:p.usable, description:p.description});
-            });
-            $scope.accessibleParameterSetDescriptions = $scope.accessiblePresets.map(function(p) { 
-                return p.description || '<em>No description</em>';
-            });
-        }).error(setErrorInScope.bind($scope.errorScope));
-        if($scope.authConfigured() === true){
-          $scope.authSectionVisible = false;
-          $scope.showTreeData = true;
+    $scope.init = function () {
+      DataikuAPI.plugins.listAccessiblePresets('pi-system', $stateParams.projectKey, 'basic-auth').success(function (data) {
+        $scope.inlineParams = data.inlineParams;
+        $scope.inlinePluginParams = data.inlinePluginParams;
+        $scope.accessiblePresets = [];
+        if (data.definableInline) {
+          $scope.accessiblePresets.push({
+            name: "INLINE",
+            label: "Manually defined", usable: true,
+            description: "Define values for these parameters"
+          });
         }
+        data.presets.forEach(function (p) {
+          $scope.accessiblePresets.push({ name: "PRESET " + p.name, label: p.name, usable: p.usable, description: p.description });
+        });
+        $scope.accessibleParameterSetDescriptions = $scope.accessiblePresets.map(function (p) {
+          return p.description || '<em>No description</em>';
+        });
+      }).error(setErrorInScope.bind($scope.errorScope));
+      if ($scope.authConfigured() === true) {
+        $scope.authSectionVisible = false;
+        $scope.showTreeData = true;
+      }
     };
-    
-    $scope.getServers = function(){
-      $scope.callPythonDo({parameterName: "server_name"}).then(function(data){
+
+    $scope.getServers = function () {
+      $scope.callPythonDo({ parameterName: "server_name" }).then(function (data) {
         $scope.server_name = data.choices;
       });
     };
-    $scope.getDatabases = function() {
-      $scope.callPythonDo({parameterName: "database_name"}).then(function(data){
+    $scope.getDatabases = function () {
+      $scope.callPythonDo({ parameterName: "database_name" }).then(function (data) {
         $scope.database_name = data.choices;
       });
     };
 
     $scope.authSectionVisible = $scope.authSectionVisible || true;
 
-    $scope.toggleAuthSection = function() {
+    $scope.toggleAuthSection = function () {
       $scope.authSectionVisible = !$scope.authSectionVisible;
     };
 
-    $scope.authConfigured = function(){
+    $scope.authConfigured = function () {
       console.log('authConfigured check');
-      return $scope.hasPreset() && $scope.config.database_name && $scope.config.database_name.length > 0 && $scope.config.server_name && $scope.config.server_name.length > 0 ;
+      return $scope.hasPreset() && $scope.config.database_name && $scope.config.database_name.length > 0 && $scope.config.server_name && $scope.config.server_name.length > 0;
     }
-    $scope.explore = function() {
+    $scope.explore = function () {
       console.log("coucou");
       if ($scope.authConfigured()) {
         console.log("here");
@@ -86,178 +86,184 @@ app.controller('AfExplorerFormCtrl', [
       }
     };
 
-    $scope.hasPreset = function() {
-      return $scope.config.credentials && $scope.config.credentials.mode && $scope.config.credentials.mode!=='NONE' && $scope.config.credentials.name
+    $scope.hasPreset = function () {
+      return $scope.config.credentials && $scope.config.credentials.mode && $scope.config.credentials.mode !== 'NONE' && $scope.config.credentials.name
     }
-      
-    $scope.initializeTree = function(){
-        console.log("initialization: ");
-        console.log($scope.config.treeData);
-        if (!$scope.config.treeData || $scope.config.treeData.length === 0){
-      $scope.callPythonDo({method: "get_children_from_db", parent: $scope.config.database_name}).then(function(data){
+
+    $scope.initializeTree = function () {
+      console.log("initialization: ");
+      console.log($scope.config.treeData);
+      if (!$scope.config.treeData || $scope.config.treeData.length === 0) {
+        $scope.callPythonDo({ method: "get_children_from_db", parent: $scope.config.database_name }).then(function (data) {
           console.log("ALX:data2=" + JSON.stringify(data));
           TreeDataService.setTreeData(data.choices);
-           $scope.config.treeData =  TreeDataService.getTreeData();
-      });
-        }
+          $scope.config.treeData = TreeDataService.getTreeData();
+        });
+      }
     };
-      
-        $scope.getChildrenFromDB = function(item){
-    console.log("ALX:gcfd:" + JSON.stringify(item));
-    return $scope.callPythonDo({ method: "get_children_from_db", parent: item })
-      .then(function (data) {
-        console.log("ALX:data1=" + JSON.stringify(data));
-        item.children = data.choices;
-        item.children.forEach(child => {
-          child.expanded = false;
+
+    $scope.getChildrenFromDB = function (item) {
+      console.log("ALX:gcfd:" + JSON.stringify(item));
+      return $scope.callPythonDo({ method: "get_children_from_db", parent: item })
+        .then(function (data) {
+          console.log("ALX:data1=" + JSON.stringify(data));
+          item.children = data.choices;
+          item.children.forEach(child => {
+            child.expanded = false;
+          });
+          console.log(item);
+          return item;
         });
-        console.log(item);
-        return item;
-      });
-    } 
+    }
 
-    $scope.getTemplatesFromDB = function() {
-      $scope.callPythonDo({method: "get_templates_from_db"}).then(function(data){
+    $scope.getTemplatesFromDB = function () {
+      $scope.callPythonDo({ method: "get_templates_from_db" }).then(function (data) {
         $scope.config.templates = data.choices;
       });
     }
 
-    $scope.getCategoriesFromDB = function(){
+    $scope.getCategoriesFromDB = function () {
       $scope.config.attribute_categories = [];
       $scope.config.element_categories = [];
-      $scope.callPythonDo({method: "get_attribute_categories_from_db"}).then(function(data){
+      $scope.callPythonDo({ method: "get_attribute_categories_from_db" }).then(function (data) {
         $scope.config.attribute_categories = data.choices;
       });
-      $scope.callPythonDo({method: "get_element_categories_from_db"}).then(function(data){
+      $scope.callPythonDo({ method: "get_element_categories_from_db" }).then(function (data) {
         $scope.config.element_categories = data.choices;
       });
     }
 
-  // Toggle récursif des checkboxes
-  $scope.toggleChildren = function(node) {
-    console.log("ALX:tc:" + JSON.stringify(node));
+    // Toggle récursif des checkboxes
+    $scope.toggleChildren = function (node) {
+      console.log("ALX:tc:" + JSON.stringify(node));
       node.expanded = !node.expanded;
       $scope.getChildrenFromDB(node);
-    if (node.children && node.children.length) {
-      node.children.forEach(function(child) {
-        child.expanded = !child.expanded;
-        $scope.getChildrenFromDB(child);
-      });
-    }
-      
-  };
+      if (node.children && node.children.length) {
+        node.children.forEach(function (child) {
+          child.expanded = !child.expanded;
+          $scope.getChildrenFromDB(child);
+        });
+      }
+
+    };
 
-  $scope.doSearch = function(element_name, attribute_name){
-      $scope.callPythonDo({method: "do_search", element_name: element_name, attribute_name: attribute_name, root_tree: $scope.config.treeData}).then(
-        function(data){
+    $scope.doSearch = function (element_name, attribute_name) {
+      $scope.callPythonDo({ method: "do_search", element_name: element_name, attribute_name: attribute_name, root_tree: $scope.config.treeData }).then(
+        function (data) {
           TreeDataService.setTreeData(data.choices);
           $scope.config.treeData = TreeDataService.getTreeData();
           console.log("ALX:", JSON.stringify($scope.config.treeData));
           //todo: correct fix is to not have checked:true in the backend in the first place
-          $scope.config.attributeList = data.attributes.map(el=>({...el, checked:false})); 
+          $scope.config.attributeList = data.attributes.map(el => ({ ...el, checked: false }));
           $scope.config.selectedAttributes = [];
         }
       );
     };
 
-  $scope.updateAttributeToOutput = function (attribute) {
-    if (attribute.checked && $scope.config.selectedAttributes.includes(attribute)) {
-      $scope.config.selectedAttributes = $scope.config.selectedAttributes.filter(attr => attr.path !== attribute.path);
-    }
-    else {
-      console.log("Adding attribute to output:", attribute);
-
-      if (!$scope.config || !$scope.config.attributeList || $scope.config.selectedAttributes.includes(attribute)) {
-        return;
+    $scope.updateAttributeToOutput = function (attribute) {
+      if (attribute.checked && $scope.config.selectedAttributes.includes(attribute)) {
+        $scope.config.selectedAttributes = $scope.config.selectedAttributes.filter(attr => attr.path !== attribute.path);
       }
-      const attrInConfig = $scope.config.attributeList.find(attr => attr.path === attribute.path);
+      else {
+        console.log("Adding attribute to output:", attribute);
 
-      if (attrInConfig) {
-        $scope.config.selectedAttributes.push(attribute);
-        attrInConfig.checked = true;
-      } else {
-        console.warn("Attribute not found in config:", attribute.path);
+        if (!$scope.config || !$scope.config.attributeList || $scope.config.selectedAttributes.includes(attribute)) {
+          return;
+        }
+        const attrInConfig = $scope.config.attributeList.find(attr => attr.path === attribute.path);
+
+        if (attrInConfig) {
+          $scope.config.selectedAttributes.push(attribute);
+          attrInConfig.checked = true;
+        } else {
+          console.warn("Attribute not found in config:", attribute.path);
+        }
       }
-    }
-  };
+    };
 
 
-$scope.displayAttributes = function(node) {
+    $scope.displayAttributes = function (node) {
 
-    if (!node.children || node.children.length === 0) {
+      if (!node.children || node.children.length === 0) {
         $scope.getChildrenFromDB(node).then(newNode => {
-        processNode(newNode);
+          processNode(newNode);
         });
-    } else {
+      } else {
         processNode(node);
-    };
-  }
-
-function processNode(node) {
-    if (node.title !== $scope.config.element_name) {
-      $scope.config.element_name = "";
+      };
     }
-    $scope.config.attributeList =  [];
-    $scope.config.selectedAttributes =  [];
-    node.children.forEach(child => {
+
+    function processNode(node) {
+      if (node.title !== $scope.config.element_name) {
+        $scope.config.element_name = "";
+      }
+      $scope.config.attributeList = [];
+      $scope.config.selectedAttributes = [];
+      node.children.forEach(child => {
         if (child.type === "attribute") {
-            $scope.config.attributeList.push({
-                "title": child.title,
-                "path": child.path
-            });
+          $scope.config.attributeList.push({
+            "title": child.title,
+            "path": child.path
+          });
         }
-    });
-}
+      });
+    }
 
 
-}]);
+  }]);
 
-app.directive('treeNode', function() {
+app.directive('treeNode', function () {
   return {
     restrict: 'E',
-    scope: { node: '=' },
+    scope: {
+      node: '=',                  // mutable object (tree structure changes)
+      getChildrenFromDB: '<',     // function reference
+      displayAttributes: '<',     // function reference
+      config: '<'                 // read/write nested properties only
+    },
+
     template: `
       <div style="display: flex; align-items: center; gap: 6px;">
-        
-        <span ng-click="$event.stopPropagation();toggleExpand(node)"
+
+        <span ng-click="$event.stopPropagation(); toggleExpand(node)"
               style="cursor: pointer;">
           <strong ng-if="node.expanded">▼</strong>
           <strong ng-if="!node.expanded">▶</strong>
         </span>
 
-        <!--<span ng-if="!node.children || node.children.length === 0" style="width: 12px;"></span>-->
-
-        <!--<label>
-          <input type="checkbox" ng-model="node.checked" ng-change="toggleChildren(node)">
-          {{ node.title }}
-        </label>-->
-
         <div class="tree-node">
-
-          <span ng-if="node.type==='element'"
-            class="tree-node__label"
-            ng-click="displayAttributes(node)"
-            ng-class="{'tree-node__label--clickable': hasAttributes(node)}"
-          >{{ node.title }}</span>
+          <span ng-if="node.type === 'element'"
+                class="tree-node__label"
+                ng-click="displayAttributes(node)"
+                ng-class="{'tree-node__label--clickable': hasAttributes(node)}">
+            {{ node.title }}
+          </span>
         </div>
 
-
       </div>
 
-      <ul ng-if="node.children && node.children.length > 0 && node.expanded" style="margin-left: 20px;">
-        <li ng-repeat="child in node.children" ng-if="child.type=='element'">
-          <tree-node node="child"></tree-node>
+      <ul ng-if="node.children && node.children.length && node.expanded"
+          style="margin-left: 20px;">
+
+        <li ng-repeat="child in node.children track by child.path"
+            ng-if="child.type === 'element'">
+
+          <tree-node
+            node="child"
+            get-children-from-db="getChildrenFromDB"
+            display-attributes="displayAttributes"
+            config="config">
+          </tree-node>
+
         </li>
+
       </ul>
     `,
-    link: function(scope) {
-      scope.toggleChildren = scope.$parent.toggleChildren;
-      scope.getChildrenFromDB = scope.$parent.getChildrenFromDB;
-      scope.doSearch = scope.$parent.doSearch;
-      scope.config = scope.$parent.config;
-      scope.attributeList = scope.config.attributeList || [];
-      scope.displayAttributes = scope.$parent.displayAttributes;
-      scope.toggleExpand = function(node) {
+
+    link: function (scope) {
+
+      // Toggle expansion + lazy loading
+      scope.toggleExpand = function (node) {
         node.expanded = !node.expanded;
 
         if (node.expanded && (!node.children || !node.children.length)) {
@@ -265,20 +271,20 @@ app.directive('treeNode', function() {
         }
       };
 
-      scope.hasAttributes = function(node) {
-        if (!Array.isArray(scope.$parent.config.attributeList) || scope.$parent.config.attributeList.length === 0) {
+
+      scope.hasAttributes = function (node) {
+        if (!Array.isArray(scope.config.attributeList) ||
+          !scope.config.attributeList.length) {
           return false;
         }
 
-        return scope.$parent.config.attributeList.some(child => {
-          const expected = node.title + "|" + child.title;
-        return child.path.endsWith(expected);
+        return scope.config.attributeList.some(attr => {
+          const expected = node.title + "|" + attr.title;
+          return attr.path.endsWith(expected);
         });
       };
 
-      scope.isElement = function(child) {
-        return child.type === 'element';
-      }
     }
   };
 });
+
diff --git a/resource/pi-system_af-explorer.html b/resource/pi-system_af-explorer.html
index e940612..110f552 100644
--- a/resource/pi-system_af-explorer.html
+++ b/resource/pi-system_af-explorer.html
@@ -4,119 +4,105 @@
         <div class="pi-system-explorer__authentication-header" ng-click="toggleAuthSection()">
             <strong>Welcome to Pi System Plugin</strong>
         </div>
-       <div class="pi-system-explorer__authentication-body" ng-show="authSectionVisible">
-        <div class="control-group">
-            <label class="control-label" for="pi-system-credentials">Pi System connection</label>
-            <div class="dib">
-                <div autoconfig-preset-element
-                    param-desc="paramDesc"
-                    model="config.credentials"
-                    plugin-id="pi-system"
-                    accessible-parameter-set-descriptions="accessibleParameterSetDescriptions"
-                    accessible-presets="accessiblePresets"
-                    inline-params="inlineParams"
-                    inline-plugin-params="inlinePluginParams"
-                    error-scope="errorScope"
-                    required>
+        <div class="pi-system-explorer__authentication-body" ng-show="authSectionVisible">
+            <div class="control-group">
+                <label class="control-label" for="pi-system-credentials">Pi System connection</label>
+                <div class="dib">
+                    <div autoconfig-preset-element param-desc="paramDesc" model="config.credentials"
+                        plugin-id="pi-system" accessible-parameter-set-descriptions="accessibleParameterSetDescriptions"
+                        accessible-presets="accessiblePresets" inline-params="inlineParams"
+                        inline-plugin-params="inlinePluginParams" error-scope="errorScope" required>
+                    </div>
                 </div>
             </div>
-        </div>
-        <div class="control-group removed-if-manual-query" ng-if="config.credentials && config.credentials.mode && config.credentials.mode!=='NONE' && config.credentials.name">
-        <label class="control-label">Server</label>
-        <div class="controls">
-            <select dku-bs-select
-                    ng-model="config.server_name"
-                    ng-options="sv.value as sv.label for sv in server_name"
-                    ng-init="getServers()"
-            > 
-            </select>
-        </div>
-        </div>
-        <div class="control-group removed-if-manual-query" ng-if="config.server_name">
-            <label class="control-label">Database</label>
-            <div class="controls">
-                <select dku-bs-select
-                        ng-model="config.database_name"
-                        ng-change="initializeTree()"
-                        ng-options="dbn.value as dbn.label for dbn in database_name"
-                        ng-init="getDatabases()"> 
-                </select>
+            <div class="control-group removed-if-manual-query"
+                ng-if="config.credentials && config.credentials.mode && config.credentials.mode!=='NONE' && config.credentials.name">
+                <label class="control-label">Server</label>
+                <div class="controls">
+                    <select dku-bs-select ng-model="config.server_name"
+                        ng-options="sv.value as sv.label for sv in server_name" ng-init="getServers()">
+                    </select>
+                </div>
             </div>
-            <div>
-                <input type="checkbox" ng-model="config.use_ssl"> Use SSL
+            <div class="control-group removed-if-manual-query" ng-if="config.server_name">
+                <label class="control-label">Database</label>
+                <div class="controls">
+                    <select dku-bs-select ng-model="config.database_name" ng-change="initializeTree()"
+                        ng-options="dbn.value as dbn.label for dbn in database_name" ng-init="getDatabases()">
+                    </select>
+                </div>
+                <div>
+                    <input type="checkbox" ng-model="config.use_ssl"> Use SSL
+                </div>
             </div>
+
+            <button ng-click="explore()" class="btn btn--secondary link-like" id="load-tree-data">Explore
+            </button>
         </div>
-                   
-        <button ng-click="explore()" class="btn btn--secondary link-like"
-            id="load-tree-data">Explore
-        </button>
     </div>
-   </div>
-       <div class="control-group removed-if-manual-query"  ng-show="false" ng-if="config.database_name">
-       <label class="control-label">Tree</label>
-       <div class="controls">
-           <select dku-bs-select
-                   ng-model="config.treeData"
-                   ng-options="dbn.value as dbn.label for dbn in [config.treeData]"
-                   ng-init="initializeTree();"> 
-           </select>
-       </div>
+    <div class="control-group removed-if-manual-query" ng-show="false" ng-if="config.database_name">
+        <label class="control-label">Tree</label>
+        <div class="controls">
+            <select dku-bs-select ng-model="config.treeData"
+                ng-options="dbn.value as dbn.label for dbn in [config.treeData]" ng-init="initializeTree();">
+            </select>
+        </div>
 
-   </div>
+    </div>
     <div class="pi-system-explorer__main" ng-if="showTreeData">
         <div ng-if="config.database_name" ng-init="initializeTree()" class="pi-system-explorer__tree-view">
             <div><strong>Elements</strong></div>
             <div style="margin-bottom:8px;">
-                <input id="ReturnsName" ng-model="config.element_name" type="text" data-container="body" data-html="true"
-                    data-placement="right" data-toggle="tooltip" title="blaa" placeholder="Search element" />
-                <select dku-bs-select
-                        ng-model="config.template"
-                        ng-options="dbn.title as dbn.title for dbn in config.templates"
-                        ng-init="getTemplatesFromDB()">
+                <input id="ReturnsName" ng-model="config.element_name" type="text" data-container="body"
+                    data-html="true" data-placement="right" data-toggle="tooltip" title="blaa"
+                    placeholder="Search element" />
+                <select dku-bs-select ng-model="config.template"
+                    ng-options="dbn.title as dbn.title for dbn in config.templates" ng-init="getTemplatesFromDB()">
                 </select>
-                <select dku-bs-select
-                            ng-model="config.element_category"
-                            ng-options="dbn.title as dbn.title for dbn in config.element_categories"
-                            ng-init="getCategoriesFromDB()">
-                    </select>
-                <button ng-click="doSearch(config.element_name, config.attribute_name)" class="btn btn--secondary link-like"
-                    id="get-query-dim-prop">Search</button>
+                <select dku-bs-select ng-model="config.element_category"
+                    ng-options="dbn.title as dbn.title for dbn in config.element_categories"
+                    ng-init="getCategoriesFromDB()">
+                </select>
+                <button ng-click="doSearch(config.element_name, config.attribute_name)"
+                    class="btn btn--secondary link-like" id="get-query-dim-prop">Search</button>
             </div>
 
             <ul ng-if="config.treeData.length">
                 <li ng-repeat="node in config.treeData track by node.id">
-                    <tree-node node="node"></tree-node>
+                    <tree-node node="node" get-children-from-db="getChildrenFromDB"
+                        display-attributes="displayAttributes" config="config">
+                    </tree-node>
                 </li>
             </ul>
         </div>
-    
+
         <!-- Attributes Section -->
         <div class="attribute-tab pi-system-explorer__center-view">
             <div><strong>Attributes</strong></div>
             <div style="margin-bottom:8px;">
-                <input id="ReturnsType" list="datatypes" ng-model="config.attribute_name" type="text" data-container="body"
-                    data-html="true" data-placement="right" data-toggle="tooltip" title="" placeholder="Search attribute" />
-                    <select dku-bs-select
-                            ng-model="config.attribute_category"
-                            ng-options="dbn.title as dbn.title for dbn in config.attribute_categories"
-                            ng-init="getCategoriesFromDB()">
-                    </select>
-                <button ng-click="doSearch(config.element_name, config.attribute_name)" class="btn btn--secondary link-like"
-                    id="get-query-dim-prop">Search</button>
+                <input id="ReturnsType" list="datatypes" ng-model="config.attribute_name" type="text"
+                    data-container="body" data-html="true" data-placement="right" data-toggle="tooltip" title=""
+                    placeholder="Search attribute" />
+                <select dku-bs-select ng-model="config.attribute_category"
+                    ng-options="dbn.title as dbn.title for dbn in config.attribute_categories"
+                    ng-init="getCategoriesFromDB()">
+                </select>
+                <button ng-click="doSearch(config.element_name, config.attribute_name)"
+                    class="btn btn--secondary link-like" id="get-query-dim-prop">Search</button>
             </div>
             <table>
                 <tr ng-repeat="attribute in config.attributeList track by $index">
                     <td>
-                        <input type="checkbox" ng-model="attribute.checked" ng-change="updateAttributeToOutput(attribute)">
+                        <input type="checkbox" ng-model="attribute.checked"
+                            ng-change="updateAttributeToOutput(attribute)">
                     </td>
                     <td>{{attribute.title}}</td>
                     <td>{{attribute.path}}</td>
                 </tr>
             </table>
         </div>
-    
-    </div>
 
+    </div>
 
-</div>
 
+</div>
\ No newline at end of file

From 572b69d2dac1a4bc47e16093caaeb46a8ff01a82 Mon Sep 17 00:00:00 2001
From: JaneBellaiche <jane.bellaiche@dataiku.com>
Date: Tue, 3 Feb 2026 21:20:22 +0100
Subject: [PATCH 08/12] *add attribute description and hide path *put the
 attributes in a styled table

---
 js/pi-system_treecontroller.js      |  3 ++-
 python-lib/osisoft_plugin_common.py |  3 ++-
 resource/pi-system_af-explorer.css  | 28 +++++++++++++++++++++++++-
 resource/pi-system_af-explorer.html | 31 +++++++++++++++++++----------
 4 files changed, 52 insertions(+), 13 deletions(-)

diff --git a/js/pi-system_treecontroller.js b/js/pi-system_treecontroller.js
index 55807e0..cfcb445 100644
--- a/js/pi-system_treecontroller.js
+++ b/js/pi-system_treecontroller.js
@@ -203,7 +203,8 @@ app.controller('AfExplorerFormCtrl', [
         if (child.type === "attribute") {
           $scope.config.attributeList.push({
             "title": child.title,
-            "path": child.path
+            "path": child.path,
+            "description": child.description
           });
         }
       });
diff --git a/python-lib/osisoft_plugin_common.py b/python-lib/osisoft_plugin_common.py
index 82cc580..81692a0 100644
--- a/python-lib/osisoft_plugin_common.py
+++ b/python-lib/osisoft_plugin_common.py
@@ -154,6 +154,7 @@ def build_requests_params(**kwargs):
         "boundary_type": "syncTimeBoundaryType",
         "name_filter": "nameFilter",
         "category_name": "categoryName",
+        "description": "descriptionFilter",
         "template_name": "templateName",
         "referenced_element_name_filter": "referencedElementNameFilter",
         "referenced_element_template": "referencedElementTemplate",
@@ -638,7 +639,7 @@ def add(self, start_time, end_time, interval):
 
 def get_item_details(item):
     KEYS_TO_CHECK = {
-        "Name": "title", "TemplateName": "template_name", "CategoryNames": "category_names",
+        "Name": "title", "TemplateName": "template_name", "CategoryNames": "category_names", "Description": "description",
         "HasChildren": "has_children", "Path": "path", "WebId": "id", "checked": "checked"
     }  # should we stick to python naming convention or keep pi's ones throughout ?
     details = {}
diff --git a/resource/pi-system_af-explorer.css b/resource/pi-system_af-explorer.css
index 2ef20fd..2740681 100644
--- a/resource/pi-system_af-explorer.css
+++ b/resource/pi-system_af-explorer.css
@@ -26,4 +26,30 @@
 
 .pi-system-explorer__authentication-body {
     border: 1px solid #ccc; padding: 10px; border-radius: 5px;
-}
\ No newline at end of file
+}
+
+.custom-table {
+    border-collapse: collapse;
+    width: 100%;
+    font-family: Arial, sans-serif;
+}
+
+.custom-table th,
+.custom-table td {
+    border: 1px solid #ccc;
+    padding: 8px 12px;
+    text-align: left;
+}
+
+.custom-table th {
+    background-color: #f4f4f4;
+    font-weight: bold;
+}
+
+.custom-table tr:nth-child(even) {
+    background-color: #fafafa;
+}
+
+.custom-table tr:hover {
+    background-color: #f1f7ff;
+}
diff --git a/resource/pi-system_af-explorer.html b/resource/pi-system_af-explorer.html
index 110f552..7acdc25 100644
--- a/resource/pi-system_af-explorer.html
+++ b/resource/pi-system_af-explorer.html
@@ -90,16 +90,27 @@
                 <button ng-click="doSearch(config.element_name, config.attribute_name)"
                     class="btn btn--secondary link-like" id="get-query-dim-prop">Search</button>
             </div>
-            <table>
-                <tr ng-repeat="attribute in config.attributeList track by $index">
-                    <td>
-                        <input type="checkbox" ng-model="attribute.checked"
-                            ng-change="updateAttributeToOutput(attribute)">
-                    </td>
-                    <td>{{attribute.title}}</td>
-                    <td>{{attribute.path}}</td>
-                </tr>
-            </table>
+<table class="custom-table">
+    <thead>
+        <tr>
+            <th>Select</th>
+            <th>Title</th>
+            <th>Description</th>
+        </tr>
+    </thead>
+
+    <tbody>
+        <tr ng-repeat="attribute in config.attributeList track by $index">
+            <td>
+                <input type="checkbox"
+                       ng-model="attribute.checked"
+                       ng-change="updateAttributeToOutput(attribute)">
+            </td>
+            <td>{{attribute.title}}</td>
+            <td>{{attribute.description}}</td>
+        </tr>
+    </tbody>
+</table>
         </div>
 
     </div>

From d5ab146b4f492c4b81453a67f8f5a02fb240c894 Mon Sep 17 00:00:00 2001
From: Alex Bourret <alexandre.bourret@dataiku.com>
Date: Wed, 4 Feb 2026 10:14:54 +0100
Subject: [PATCH 09/12] better handling of check boxes

---
 js/pi-system_treecontroller.js | 4 +---
 python-lib/osisoft_client.py   | 5 ++---
 resource/browse_af_tree.py     | 2 +-
 3 files changed, 4 insertions(+), 7 deletions(-)

diff --git a/js/pi-system_treecontroller.js b/js/pi-system_treecontroller.js
index cfcb445..9c850a3 100644
--- a/js/pi-system_treecontroller.js
+++ b/js/pi-system_treecontroller.js
@@ -152,9 +152,7 @@ app.controller('AfExplorerFormCtrl', [
         function (data) {
           TreeDataService.setTreeData(data.choices);
           $scope.config.treeData = TreeDataService.getTreeData();
-          console.log("ALX:", JSON.stringify($scope.config.treeData));
-          //todo: correct fix is to not have checked:true in the backend in the first place
-          $scope.config.attributeList = data.attributes.map(el => ({ ...el, checked: false }));
+          $scope.config.attributeList = data.attributes;
           $scope.config.selectedAttributes = [];
         }
       );
diff --git a/python-lib/osisoft_client.py b/python-lib/osisoft_client.py
index d90aaa1..7677f85 100644
--- a/python-lib/osisoft_client.py
+++ b/python-lib/osisoft_client.py
@@ -755,7 +755,6 @@ def search_elements(self, database_webid, name=None, description=None, category=
             "maxCount": tempo_maxcount,
             "associations": "Paths",
         }
-        # # https://dku-qa-osi.francecentral.cloudapp.azure.com/piwebapi/assetdatabases/F1RD3VEt1yTvt0ip6-/elements?TemplateName=Substation transformer&categoryName=Westinghouse&nameFilter=TX26*&searchFullHierarchy=true
         url = self.endpoint.get_base_url() + "/assetdatabases/{}/elements".format(database_webid)
         if name:
             params["nameFilter"] = name
@@ -976,7 +975,7 @@ def traverse_and_cache(self, path_elements, path_attributes, tree):
         for path_attribute in path_attributes:
             item = self.extract_item_with_name(json_response, path_attribute)
             item_details = get_item_details(item)
-            item_details["checked"] = True  # That should not be done here
+            # item_details["checked"] = True  # That should not be done here
             tree.put(full_path_elements[0:counter], item_details)
             counter += 1
             next_url = self.extract_link_with_key(item, "Attributes")
@@ -1212,7 +1211,7 @@ def close(self):
 
 
 def validate_timestamp(timestamp):
-    valid_formats=["%Y-%m-%dT%H:%M:%S.%fZ", "%Y-%m-%dT%H:%M:%SZ"]
+    valid_formats = ["%Y-%m-%dT%H:%M:%S.%fZ", "%Y-%m-%dT%H:%M:%SZ"]
     for valid_format in valid_formats:
         try:
             datetime.strptime(timestamp, valid_format)
diff --git a/resource/browse_af_tree.py b/resource/browse_af_tree.py
index 94737f8..74118d7 100644
--- a/resource/browse_af_tree.py
+++ b/resource/browse_af_tree.py
@@ -91,7 +91,7 @@ def do(payload, config, plugin_config, inputs):
 
         attributes = []
         for result in client.batched_search(database_name, element_name, attribute_name, element_category, attribute_category, template_name):
-            result["checked"] = True
+            # result["checked"] = True
             attributes.append(result)
 
         attributes = duplicate_linked_attributes(attributes)

From 414610cefb5ee53e01ef53fbe8608713587e3a5e Mon Sep 17 00:00:00 2001
From: Alex Bourret <alexandre.bourret@dataiku.com>
Date: Wed, 4 Feb 2026 10:30:01 +0100
Subject: [PATCH 10/12] activate the SSL switch

---
 custom-recipes/pi-system-af-tree/recipe.py | 1 +
 resource/browse_af_tree.py                 | 3 +--
 resource/pi-system_af-explorer.html        | 8 ++++----
 3 files changed, 6 insertions(+), 6 deletions(-)

diff --git a/custom-recipes/pi-system-af-tree/recipe.py b/custom-recipes/pi-system-af-tree/recipe.py
index ed4c7fd..a2d954f 100644
--- a/custom-recipes/pi-system-af-tree/recipe.py
+++ b/custom-recipes/pi-system-af-tree/recipe.py
@@ -42,6 +42,7 @@ def next_tree_item(tree_data):
 logger.info("Initialization with config config={}".format(logger.filter_secrets(config)))
 
 auth_type, username, password, server_url, is_ssl_check_disabled = get_credentials(config)
+is_ssl_check_disabled = config.get("is_ssl_check_disabled", False)  # Because no advanced parameter switch
 
 network_timer = PerformanceTimer()
 processing_timer = PerformanceTimer()
diff --git a/resource/browse_af_tree.py b/resource/browse_af_tree.py
index 74118d7..18bb28a 100644
--- a/resource/browse_af_tree.py
+++ b/resource/browse_af_tree.py
@@ -14,7 +14,6 @@ def do(payload, config, plugin_config, inputs):
             input_dataset = dataiku.Dataset(input_dataset_name)
             input_tree = input_dataset.get_dataframe(infer_with_pandas=False)
 
-    config["is_ssl_check_disabled"] = True
     if "config" in config:
         config = config.get("config")
     if "credentials" not in config:
@@ -23,6 +22,7 @@ def do(payload, config, plugin_config, inputs):
         return {"choices": [{"label": "Pick a credential"}]}
 
     auth_type, username, password, server_url, is_ssl_check_disabled, credential_error = get_credentials(config, can_raise=False)
+    is_ssl_check_disabled = config.get("is_ssl_check_disabled", False)  # Because no advanced parameter switch
 
     if credential_error:
         return build_select_choices(credential_error)
@@ -40,7 +40,6 @@ def do(payload, config, plugin_config, inputs):
         return build_select_choices("Fill in the server address")
 
     is_debug_mode = check_debug_mode(config)
-    is_ssl_check_disabled = True
 
     client = OSIsoftClient(server_url, auth_type, username, password, is_ssl_check_disabled=is_ssl_check_disabled, is_debug_mode=is_debug_mode)
 
diff --git a/resource/pi-system_af-explorer.html b/resource/pi-system_af-explorer.html
index 7acdc25..7c41257 100644
--- a/resource/pi-system_af-explorer.html
+++ b/resource/pi-system_af-explorer.html
@@ -14,6 +14,9 @@
                         inline-plugin-params="inlinePluginParams" error-scope="errorScope" required>
                     </div>
                 </div>
+                <div>
+                    <input type="checkbox" ng-model="config.is_ssl_check_disabled" ng-change="getServers();"/> Disable SSL check
+                </div>
             </div>
             <div class="control-group removed-if-manual-query"
                 ng-if="config.credentials && config.credentials.mode && config.credentials.mode!=='NONE' && config.credentials.name">
@@ -27,13 +30,10 @@
             <div class="control-group removed-if-manual-query" ng-if="config.server_name">
                 <label class="control-label">Database</label>
                 <div class="controls">
-                    <select dku-bs-select ng-model="config.database_name" ng-change="initializeTree()"
+                    <select dku-bs-select ng-model="config.database_name" ng-change="initializeTree();getTemplatesFromDB();getCategoriesFromDB();"
                         ng-options="dbn.value as dbn.label for dbn in database_name" ng-init="getDatabases()">
                     </select>
                 </div>
-                <div>
-                    <input type="checkbox" ng-model="config.use_ssl"> Use SSL
-                </div>
             </div>
 
             <button ng-click="explore()" class="btn btn--secondary link-like" id="load-tree-data">Explore

From ff15065397f6f6bc14b320acd5946aa814fd896d Mon Sep 17 00:00:00 2001
From: JaneBellaiche <jane.bellaiche@dataiku.com>
Date: Wed, 4 Feb 2026 12:24:18 +0100
Subject: [PATCH 11/12] UI enhancements

---
 js/pi-system_treecontroller.js      |   7 ++
 resource/pi-system_af-explorer.css  |  31 ++++++++
 resource/pi-system_af-explorer.html | 113 ++++++++++++++++------------
 3 files changed, 104 insertions(+), 47 deletions(-)

diff --git a/js/pi-system_treecontroller.js b/js/pi-system_treecontroller.js
index 9c850a3..df033fa 100644
--- a/js/pi-system_treecontroller.js
+++ b/js/pi-system_treecontroller.js
@@ -55,6 +55,7 @@ app.controller('AfExplorerFormCtrl', [
         $scope.authSectionVisible = false;
         $scope.showTreeData = true;
       }
+      $scope.config.template = $scope.config.template || "-- Any --";
     };
 
     $scope.getServers = function () {
@@ -122,6 +123,12 @@ app.controller('AfExplorerFormCtrl', [
       });
     }
 
+    $scope.activeTab = 'element'; // tab par défaut
+
+    $scope.setTab = function(tab) {
+        $scope.activeTab = tab;
+    };
+
     $scope.getCategoriesFromDB = function () {
       $scope.config.attribute_categories = [];
       $scope.config.element_categories = [];
diff --git a/resource/pi-system_af-explorer.css b/resource/pi-system_af-explorer.css
index 2740681..c03843a 100644
--- a/resource/pi-system_af-explorer.css
+++ b/resource/pi-system_af-explorer.css
@@ -53,3 +53,34 @@
 .custom-table tr:hover {
     background-color: #f1f7ff;
 }
+
+.tab-container {
+    font-family: Arial, sans-serif;
+}
+
+.tab-header {
+    list-style: none;
+    padding: 0;
+    margin: 0 0 6px 0;
+    display: flex;
+    border-bottom: 2px solid #ddd;
+}
+
+.tab-header li {
+    padding: 8px 16px;
+    cursor: pointer;
+    background: #f5f5f5;
+    border: 1px solid #ddd;
+    border-bottom: none;
+    margin-right: 4px;
+}
+
+.tab-header li.active {
+    background: #fff;
+    font-weight: bold;
+}
+
+.tab-content {
+    border-top: none;
+    padding: 10px;
+}
diff --git a/resource/pi-system_af-explorer.html b/resource/pi-system_af-explorer.html
index 7c41257..a5ef7d4 100644
--- a/resource/pi-system_af-explorer.html
+++ b/resource/pi-system_af-explorer.html
@@ -14,9 +14,10 @@
                         inline-plugin-params="inlinePluginParams" error-scope="errorScope" required>
                     </div>
                 </div>
-                <div>
-                    <input type="checkbox" ng-model="config.is_ssl_check_disabled" ng-change="getServers();"/> Disable SSL check
-                </div>
+                <label>
+                    <span>Disable SSL Check</span>
+                    <input type="checkbox" style="vertical-align: baseline" ng-model="config.is_ssl_check_disabled" ng-change="getServers();" /> 
+                </label>
             </div>
             <div class="control-group removed-if-manual-query"
                 ng-if="config.credentials && config.credentials.mode && config.credentials.mode!=='NONE' && config.credentials.name">
@@ -30,7 +31,8 @@
             <div class="control-group removed-if-manual-query" ng-if="config.server_name">
                 <label class="control-label">Database</label>
                 <div class="controls">
-                    <select dku-bs-select ng-model="config.database_name" ng-change="initializeTree();getTemplatesFromDB();getCategoriesFromDB();"
+                    <select dku-bs-select ng-model="config.database_name"
+                        ng-change="initializeTree();getTemplatesFromDB();getCategoriesFromDB();"
                         ng-options="dbn.value as dbn.label for dbn in database_name" ng-init="getDatabases()">
                     </select>
                 </div>
@@ -51,22 +53,37 @@
     </div>
     <div class="pi-system-explorer__main" ng-if="showTreeData">
         <div ng-if="config.database_name" ng-init="initializeTree()" class="pi-system-explorer__tree-view">
-            <div><strong>Elements</strong></div>
-            <div style="margin-bottom:8px;">
-                <input id="ReturnsName" ng-model="config.element_name" type="text" data-container="body"
-                    data-html="true" data-placement="right" data-toggle="tooltip" title="blaa"
-                    placeholder="Search element" />
-                <select dku-bs-select ng-model="config.template"
-                    ng-options="dbn.title as dbn.title for dbn in config.templates" ng-init="getTemplatesFromDB()">
-                </select>
-                <select dku-bs-select ng-model="config.element_category"
-                    ng-options="dbn.title as dbn.title for dbn in config.element_categories"
-                    ng-init="getCategoriesFromDB()">
-                </select>
-                <button ng-click="doSearch(config.element_name, config.attribute_name)"
-                    class="btn btn--secondary link-like" id="get-query-dim-prop">Search</button>
+            <div class="tab-container">
+                <ul class="tab-header">
+                    <li ng-click="setTab('element')" ng-class="{active: activeTab === 'element'}">
+                        Element
+                    </li>
+                    <li ng-click="setTab('template')" ng-class="{active: activeTab === 'template'}">
+                        Template
+                    </li>
+                </ul>
+                <div class="tab-content" style="margin-bottom:8px;">
+                    <input ng-if="activeTab === 'element'" id="ReturnsName" ng-model="config.element_name" type="text"
+                        data-container="body" data-html="true"
+                        placeholder="Search element" />
+                    <select ng-if="activeTab === 'template'" dku-bs-select ng-model="config.template"
+                        ng-options="dbn.title as dbn.title for dbn in config.templates" ng-init="getTemplatesFromDB()"
+                        required>
+                    </select>
+                    <button ng-click="doSearch(config.element_name, config.attribute_name)"
+                        class="btn btn--secondary link-like" id="get-query-dim-prop">Search</button>
+                </div>
             </div>
 
+            <div class="control-group">
+                <label class="control-label">Filter by category</label>
+                <div class="controls">
+                    <select dku-bs-select ng-model="config.element_category"
+                        ng-options="dbn.title as dbn.title for dbn in config.element_categories"
+                        ng-init="getCategoriesFromDB()"
+                        ng-change="doSearch(config.element_name, config.attribute_name)" />
+                </div>
+            </div>
             <ul ng-if="config.treeData.length">
                 <li ng-repeat="node in config.treeData track by node.id">
                     <tree-node node="node" get-children-from-db="getChildrenFromDB"
@@ -75,45 +92,47 @@
                 </li>
             </ul>
         </div>
-
         <!-- Attributes Section -->
         <div class="attribute-tab pi-system-explorer__center-view">
             <div><strong>Attributes</strong></div>
-            <div style="margin-bottom:8px;">
+            <div style="padding-top:30px; margin-bottom:8px;">
                 <input id="ReturnsType" list="datatypes" ng-model="config.attribute_name" type="text"
                     data-container="body" data-html="true" data-placement="right" data-toggle="tooltip" title=""
                     placeholder="Search attribute" />
-                <select dku-bs-select ng-model="config.attribute_category"
-                    ng-options="dbn.title as dbn.title for dbn in config.attribute_categories"
-                    ng-init="getCategoriesFromDB()">
-                </select>
                 <button ng-click="doSearch(config.element_name, config.attribute_name)"
                     class="btn btn--secondary link-like" id="get-query-dim-prop">Search</button>
+
+                <div class="control-group">
+                    <label class="control-label">Filter by category</label>
+                    <div class="controls">
+                        <select dku-bs-select ng-model="config.attribute_category"
+                            ng-options="dbn.title as dbn.title for dbn in config.attribute_categories"
+                            ng-init="getCategoriesFromDB()"
+                            ng-change="doSearch(config.element_name, config.attribute_name)" />
+                    </div>
+                </div>
             </div>
-<table class="custom-table">
-    <thead>
-        <tr>
-            <th>Select</th>
-            <th>Title</th>
-            <th>Description</th>
-        </tr>
-    </thead>
+            <table class="custom-table">
+                <thead>
+                    <tr>
+                        <th>Select</th>
+                        <th>Title</th>
+                        <th>Description</th>
+                    </tr>
+                </thead>
 
-    <tbody>
-        <tr ng-repeat="attribute in config.attributeList track by $index">
-            <td>
-                <input type="checkbox"
-                       ng-model="attribute.checked"
-                       ng-change="updateAttributeToOutput(attribute)">
-            </td>
-            <td>{{attribute.title}}</td>
-            <td>{{attribute.description}}</td>
-        </tr>
-    </tbody>
-</table>
+                <tbody>
+                    <tr ng-repeat="attribute in config.attributeList track by $index">
+                        <td>
+                            <input type="checkbox" ng-model="attribute.checked"
+                                ng-change="updateAttributeToOutput(attribute)">
+                        </td>
+                        <td>{{attribute.title}}</td>
+                        <td>{{attribute.description}}</td>
+                    </tr>
+                </tbody>
+            </table>
         </div>
-
     </div>
-
-
+</div>
 </div>
\ No newline at end of file

From 0b77bae405b380b68cec007bbf4bae6f5e6062b0 Mon Sep 17 00:00:00 2001
From: Alex Bourret <alexandre.bourret@dataiku.com>
Date: Thu, 5 Feb 2026 09:12:17 +0100
Subject: [PATCH 12/12] update get_templates_from_db to retrieve data in tree

---
 python-lib/osisoft_plugin_common.py |  2 +-
 resource/browse_af_tree.py          | 46 ++++++++++++++++++++++++-----
 2 files changed, 40 insertions(+), 8 deletions(-)

diff --git a/python-lib/osisoft_plugin_common.py b/python-lib/osisoft_plugin_common.py
index 81692a0..4728423 100644
--- a/python-lib/osisoft_plugin_common.py
+++ b/python-lib/osisoft_plugin_common.py
@@ -640,7 +640,7 @@ def add(self, start_time, end_time, interval):
 def get_item_details(item):
     KEYS_TO_CHECK = {
         "Name": "title", "TemplateName": "template_name", "CategoryNames": "category_names", "Description": "description",
-        "HasChildren": "has_children", "Path": "path", "WebId": "id", "checked": "checked"
+        "HasChildren": "has_children", "Path": "path", "WebId": "id", "checked": "checked", "BaseTemplate": "BaseTemplate"
     }  # should we stick to python naming convention or keep pi's ones throughout ?
     details = {}
     for key_to_check in KEYS_TO_CHECK:
diff --git a/resource/browse_af_tree.py b/resource/browse_af_tree.py
index 18bb28a..7a3d50c 100644
--- a/resource/browse_af_tree.py
+++ b/resource/browse_af_tree.py
@@ -53,7 +53,8 @@ def do(payload, config, plugin_config, inputs):
     if method == "get_templates_from_db":
         database_name = config.get("database_name")
         parent = payload.get("parent", {})
-        ret = get_items_from_db(client, parent, "ElementTemplates", database_name=database_name)
+        # ret = get_items_from_db(client, parent, "ElementTemplates", database_name=database_name)
+        ret = get_template_hierarchy_from_db(client, parent, database_name=database_name)
         return ret
     if method == "get_attribute_categories_from_db":
         database_name = config.get("database_name")
@@ -181,19 +182,50 @@ def get_children_from_db(client, parent_node, database_name=None):
             if child.get("has_children"):
                 child["children"] = []
             children.append(child)
-
     return {"choices": children}
 
-# method2:
-# we dig, but this time it's index[token name], and we store as we go in the child, with the real data indexed in a list and just the rank pointing to it
-# to build the final tree, we browse the index, get the index data, rebuild the struct from there
-# Tree class ? put(path, data), get(path, data)
+
+def get_template_hierarchy_from_db(client, parent_node, database_name=None):
+    if isinstance(parent_node, dict):
+        url = parent_node.get("url", database_name)
+    else:
+        url = parent_node
+    default_choice = {"title": "-- Any --"}
+    this_node = next(client.get_next_item_from_url(url))
+    links = this_node.get("Links", {})
+    element_templates_url = links.get("ElementTemplates")
+    children = [default_choice]
+    rebuilt_tree = []
+    if element_templates_url:
+        element_templates = client.get_next_item_from_url(element_templates_url)
+        for element_template in element_templates:
+            child = get_item_details(element_template)
+            child["type"] = "template"
+            child["children"] = []
+            children.append(child)
+        rebuilt_tree = nest_children(children)
+    return {"choices": rebuilt_tree}
+
+
+def nest_children(items):
+    name_to_item = {item["title"]: item for item in items}
+    tree = []
+    for item in items:
+        parent_name = item.get("BaseTemplate")
+        if parent_name is None or parent_name not in name_to_item:
+            tree.append(item)
+        else:
+            parent = name_to_item[parent_name]
+            if "children" not in parent:
+                parent["children"] = []
+            parent["children"].append(item)
+    return tree
 
 
 def rebuild_tree(client, items, root_tree=None):
     # builds an active tree containing all the items and their parent up to the root
     tree = Tree(root_tree=root_tree)
-    tree.print()
+    # tree.print()
     while len(items) > 1:
         item = items.pop()
         if item is None: