[ACA-2746] Side Navigation - conditionally render group of items (#1197)

* filter groups based on rule

* test

* update docs

docs/getting-started/navigation.md

@@ -208,6 +208,34 @@ Navigation definition also supports custom components to be dynamically render.
 ]
 ```
 
+Navigation items or group of navigation items can be conditional render based on defined rules.
+
+```json
+"navbar": [
+  {
+    "id": "custom-group-1",
+    "rules": {
+      "visible": "rule-reference-id"
+    },
+    "items": [ ... ]
+  },
+  {
+    "id": "custom-group-2",
+    "items": [
+        {
+          "id": "itemId",
+          "rules": {
+            "visible": "rule-reference-id"
+          },
+          ...
+        }
+    ]
+  }
+]
+```
+
+For more informations about rules checkout [Rules](../extending/rules.md) section.
+
 Note that components must be declared as entryComponents under the app module.
 
 For more information about the content of a custom page see [Document List Layout](/features/document-list-layout) section.

src/app/extensions/extension.service.spec.ts

@@ -694,6 +694,62 @@ describe('AppExtensionService', () => {
         { items: [{ children: [] }] }
       ]);
     });
+
+    it('should filter out items based on rule', () => {
+      spyOn(service, 'filterVisible').and.callFake(item => {
+        if (item.rules) {
+          return item.rules.visible;
+        } else {
+          return true;
+        }
+      });
+
+      const navigation = service.getApplicationNavigation([
+        {
+          id: 'groupId',
+          items: [
+            {
+              id: 'itemId',
+              route: 'route1',
+              rules: { visible: false }
+            }
+          ]
+        }
+      ]);
+
+      expect(navigation).toEqual([{ id: 'groupId', items: [] }]);
+    });
+
+    it('should filter out group based on rule', () => {
+      spyOn(service, 'filterVisible').and.callFake(item => {
+        if (item.rules) {
+          return item.rules.visible;
+        } else {
+          return true;
+        }
+      });
+
+      const navigation = service.getApplicationNavigation([
+        {
+          id: 'group1',
+          rules: {
+            visible: false
+          },
+          items: [
+            {
+              id: 'item1',
+              route: 'route1'
+            }
+          ]
+        },
+        {
+          id: 'group2',
+          items: []
+        }
+      ]);
+
+      expect(navigation).toEqual([{ id: 'group2', items: [] }]);
+    });
   });
 
   describe('getSharedLinkViewerToolbarActions', () => {

src/app/extensions/extension.service.ts

@@ -235,7 +235,9 @@ export class AppExtensionService implements RuleContext {
   }
 
   getApplicationNavigation(elements) {
-    return elements.map(group => {
+    return elements
+      .filter(group => this.filterVisible(group))
+      .map(group => {
         return {
           ...group,
           items: (group.items || [])