From f600ac9f7ee6a40251b47c7adfc134f983f4221d Mon Sep 17 00:00:00 2001
From: SlowRobot <z5114667@student.unsw.edu.au>
Date: Fri, 22 Jul 2022 01:08:38 +1000
Subject: [PATCH] added the ability to find the current pages highest ancestor
 and allow the tree view to expand inclusively to it

---
 .../src/apiHooks/usePageApi.ts                | 19 +++++++++++--------
 .../pagehierarchy/PageHierarchyWebPart.ts     |  8 ++++----
 .../src/webparts/pagehierarchy/loc/en-us.js   |  6 +++---
 3 files changed, 18 insertions(+), 15 deletions(-)

diff --git a/samples/react-pages-hierarchy/src/apiHooks/usePageApi.ts b/samples/react-pages-hierarchy/src/apiHooks/usePageApi.ts
index 6fe0edebf..55f48d184 100644
--- a/samples/react-pages-hierarchy/src/apiHooks/usePageApi.ts
+++ b/samples/react-pages-hierarchy/src/apiHooks/usePageApi.ts
@@ -148,7 +148,7 @@ export function usePageApi(currentPageId: number, pageEditFinished: boolean, con
 
     const ancestorPages: IPage[] = buildPageAncestors(pages, currentPageId).reverse();
     const childrenPages: IPage[] = buildPageChildren(pages, currentPageId);
-    const treeLink: INavLink = buildHierarchy(pages);
+    const treeLink: INavLink = buildHierarchy(pages, currentPageId);
 
     // dispatch the GET_ALL action
     pagesDispatch({
@@ -253,16 +253,19 @@ export function usePageApi(currentPageId: number, pageEditFinished: boolean, con
     return childPages;
   }
 
-  function buildHierarchy(allPages: IPage[]): INavLink {
-    function recurse(id: number, l: number): INavLink {
+  function buildHierarchy(allPages: IPage[], pageId: number): INavLink {
+    function recurse(id: number, l: number, ancestorPages: IPage[]): INavLink {
       var item: IPage = allPages.filter(i => i.id === id)[0];
-      
+
       var links: INavLink[] = [];
-      links = links.concat(allPages.filter(i => i.parentPageId === id).map(it => recurse(it.id, (l+1))));
-  
-      return  { name: item.title, url: item.url, key: item.id.toString(), links: links, isExpanded: treeExpandTo >= l  };
+      links = links.concat(allPages.filter(i => i.parentPageId === id).map(it => recurse(it.id, l ? l + 1 : l, ancestorPages)));
+
+      return { name: item.title, url: item.url, key: item.id.toString(), links: links, isExpanded: treeExpandTo ? (treeExpandTo >= l) : (ancestorPages.find(f => f.id === id) ? true : false) };
     }
-    return recurse(treeTop, 1);
+
+    const ancestorPages: IPage[] = buildPageAncestors(allPages, pageId).reverse();
+
+    return recurse(treeTop ? treeTop : ancestorPages[0].id, treeExpandTo ? 1 : treeExpandTo, ancestorPages);
   }
 
   const addParentPageField = () => {
diff --git a/samples/react-pages-hierarchy/src/webparts/pagehierarchy/PageHierarchyWebPart.ts b/samples/react-pages-hierarchy/src/webparts/pagehierarchy/PageHierarchyWebPart.ts
index 35625fc17..c9b3f3f2e 100644
--- a/samples/react-pages-hierarchy/src/webparts/pagehierarchy/PageHierarchyWebPart.ts
+++ b/samples/react-pages-hierarchy/src/webparts/pagehierarchy/PageHierarchyWebPart.ts
@@ -79,10 +79,10 @@ export default class PageHierarchyWebPart extends BaseWebPart<IPageHierarchyWebP
   Really only used for workbench mode when we cannot get a page id for the current page.
   We'll allow user to test with a property and also using mock data allow them to navigate when on local host with a querystring
   */
-  private getDebugPageId() : number {
+  private getDebugPageId(): number {
     let queryParms = new UrlQueryParameterCollection(window.location.href);
     let debugPageId = this.properties.debugPageId;
-    if(queryParms.getValue(Parameters.DEBUGPAGEID)) { debugPageId = Number(queryParms.getValue(Parameters.DEBUGPAGEID)); }
+    if (queryParms.getValue(Parameters.DEBUGPAGEID)) { debugPageId = Number(queryParms.getValue(Parameters.DEBUGPAGEID)); }
 
     return debugPageId;
   }
@@ -162,7 +162,7 @@ export default class PageHierarchyWebPart extends BaseWebPart<IPageHierarchyWebP
           value: this.properties.treeFrom,
           label: strings.PropertyPane_Label_TreeFrom,
           description: strings.PropertyPane_Description_TreeFrom,
-          minValue: 1,
+          minValue: 0,
           disabled: false
         }),
         this.properties.pagesToDisplay === PagesToDisplay.Tree && PropertyFieldNumber('treeExpandTo', {
@@ -170,7 +170,7 @@ export default class PageHierarchyWebPart extends BaseWebPart<IPageHierarchyWebP
           value: this.properties.treeExpandTo,
           label: strings.PropertyPane_Label_TreeExpandTo,
           description: strings.PropertyPane_Description_TreeExpandTo,
-          minValue: 1,
+          minValue: 0,
           disabled: false
         })
       ]
diff --git a/samples/react-pages-hierarchy/src/webparts/pagehierarchy/loc/en-us.js b/samples/react-pages-hierarchy/src/webparts/pagehierarchy/loc/en-us.js
index bc3735978..8e9f6f735 100644
--- a/samples/react-pages-hierarchy/src/webparts/pagehierarchy/loc/en-us.js
+++ b/samples/react-pages-hierarchy/src/webparts/pagehierarchy/loc/en-us.js
@@ -1,4 +1,4 @@
-define([], function() {
+define([], function () {
   return {
     "Configuration_Placeholder_IconText": "Configure Page Hierarchy Web Part",
     "Configuration_Placeholder_Description": "Please configure the web part.",
@@ -22,8 +22,8 @@ define([], function() {
     "PropertyPane_Label_DebugPageId": "Debug Page Id",
     "PropertyPane_Label_VersionInfo": "Version: ",
     "PropertyPane_Description_DebugPageId": "Provide a valid page list item id to see how the web part would render for it",
-    "PropertyPane_Description_TreeFrom": "Please provide the page id for the root of the tree to render",
+    "PropertyPane_Description_TreeFrom": "Please provide the page id for the root of the tree to render. Entering zero will start the tree at the current pages highest ancestor",
     "PropertyPane_Label_TreeExpandTo": "Default Expand the Tree To Level",
-    "PropertyPane_Description_TreeExpandTo": "By default expand the tree to this level"
+    "PropertyPane_Description_TreeExpandTo": "By default expand the tree to this level. Entering zero will inclusively expand the tree along the ancestor path of the current page"
   }
 });