Added page visibility configurability.

docs/authentication.md

@@ -55,13 +55,25 @@ With authentication set up, by default no access is allowed to your dashboard wi
 
 ### Granular Access
 
-You can use the following properties to make certain sections or items only visible to some users, or hide sections and items from guests.
+You can use the following properties to make certain pages, sections or items only visible to some users, or hide pages, sections and items from guests.
 
-- `hideForUsers` - Section or Item will be visible to all users, except for those specified in this list
-- `showForUsers` - Section or Item will be hidden from all users, except for those specified in this list
-- `hideForGuests` - Section or Item will be visible for logged in users, but not for guests
+- `hideForUsers` - Page, Section or Item will be visible to all users, except for those specified in this list
+- `showForUsers` - Page, Section or Item will be hidden from all users, except for those specified in this list
+- `hideForGuests` - Page, Section or Item will be visible for logged in users, but not for guests
 
 For Example:
+```yaml
+pages:
+  - name: Home Lab
+    path: home-lab.yml
+    displayData:
+      showForUsers: [admin]
+  - name: Intranet
+    path: intranet.yml
+    displayData:
+      hideForGuests: true
+      hideForUsers: [alicia, bob]
+```    
 
 ```yaml
 - name: Code Analysis & Monitoring

src/components/PageStrcture/Nav.vue

@@ -29,6 +29,7 @@
 <script>
 import IconBurger from '@/assets/interface-icons/burger-menu.svg';
 import { makePageSlug } from '@/utils/ConfigHelpers';
+import { checkPageVisibility } from '@/utils/CheckPageVisibility';
 
 export default {
   name: 'Nav',
@@ -45,7 +46,8 @@ export default {
   computed: {
     /* Get links to sub-pages, and combine with nav-links */
     allLinks() {
-      const subPages = this.$store.getters.pages.map((subPage) => ({
+      const subPages = this.$store.getters.pages.filter((page) => checkPageVisibility(page))
+        .map((subPage) => ({
           path: makePageSlug(subPage.name, 'home'),
           title: subPage.name,
         }));

src/utils/CheckPageVisibility.js

@@ -0,0 +1,18 @@
+/**
+ * A helper function that checks if a page is visible based on current users permissions
+ * Checks a page's displayData for hideForUsers, showForUsers and hideForGuests
+ * Returns a boolean that determines if the user has the required permissions
+ */
+
+// Import helper functions from auth, to get current user, and check if guest
+import { getCurrentUser } from '@/utils/Auth';
+import { isVisibleToUser } from '@/utils/IsVisibleToUser';
+
+/* Putting it all together, the function to export */
+export const checkPageVisibility = (page) => {
+  const currentUser = getCurrentUser(); // Get current user object
+  const displayData = page.displayData || {};
+  return isVisibleToUser(displayData, currentUser);
+};
+
+export default checkPageVisibility;