From 458d9551c1d8f3faefc678e90dd5f484ba93e319 Mon Sep 17 00:00:00 2001
From: rxdn <29165304+rxdn@users.noreply.github.com>
Date: Wed, 22 Jun 2022 21:12:00 +0100
Subject: [PATCH] Hide navbar links to pages users don't have access to

---
 frontend/src/includes/Navbar.svelte      | 26 ++++++++++---
 frontend/src/layouts/ManageLayout.svelte | 47 +++++++++++++++++-------
 2 files changed, 54 insertions(+), 19 deletions(-)

diff --git a/frontend/src/includes/Navbar.svelte b/frontend/src/includes/Navbar.svelte
index 8afae13..ac1982c 100644
--- a/frontend/src/includes/Navbar.svelte
+++ b/frontend/src/includes/Navbar.svelte
@@ -6,15 +6,26 @@
       </div>
       <div class="nav-section" class:dropdown={$dropdown}>
         <!-- on:click required to close dropdown again -->
-        <NavElement icon="fas fa-cogs" link="/manage/{guildId}/settings" on:click={closeDropdown}>Settings</NavElement>
+
+        {#if isAdmin}
+            <NavElement icon="fas fa-cogs" link="/manage/{guildId}/settings" on:click={closeDropdown}>Settings</NavElement>
+        {/if}
+
         <NavElement icon="fas fa-copy" link="/manage/{guildId}/transcripts" on:click={closeDropdown}>Transcripts</NavElement>
-        <NavElement icon="fas fa-mouse-pointer" link="/manage/{guildId}/panels" on:click={closeDropdown}>Reaction Panels</NavElement>
-        <NavElement icon="fas fa-poll-h" link="/manage/{guildId}/forms" on:click={closeDropdown}>Forms</NavElement>
-        <NavElement icon="fas fa-users" link="/manage/{guildId}/teams" on:click={closeDropdown}>Staff Teams</NavElement>
+
+        {#if isAdmin}
+            <NavElement icon="fas fa-mouse-pointer" link="/manage/{guildId}/panels" on:click={closeDropdown}>Reaction Panels</NavElement>
+            <NavElement icon="fas fa-poll-h" link="/manage/{guildId}/forms" on:click={closeDropdown}>Forms</NavElement>
+            <NavElement icon="fas fa-users" link="/manage/{guildId}/teams" on:click={closeDropdown}>Staff Teams</NavElement>
+        {/if}
+
         <NavElement icon="fas fa-ticket-alt" link="/manage/{guildId}/tickets" on:click={closeDropdown}>Tickets</NavElement>
         <NavElement icon="fas fa-ban" link="/manage/{guildId}/blacklist" on:click={closeDropdown}>Blacklist</NavElement>
         <NavElement icon="fas fa-tags" link="/manage/{guildId}/tags" on:click={closeDropdown}>Tags</NavElement>
-        <NavElement icon="fas fa-paint-brush" link="/manage/{guildId}/appearance" on:click={closeDropdown}>Customise Appearance</NavElement>
+
+        {#if isAdmin}
+            <NavElement icon="fas fa-paint-brush" link="/manage/{guildId}/appearance" on:click={closeDropdown}>Customise Appearance</NavElement>
+        {/if}
       </div>
     </div>
     <div>
@@ -27,10 +38,13 @@
 </div>
 
 <script>
+    import NavElement from "../components/NavElement.svelte";
+
     export let guildId;
     export let dropdown;
+    export let permissionLevel;
 
-    import NavElement from "../components/NavElement.svelte";
+    $: isAdmin = permissionLevel >= 2;
 
     function dropdownNav() {
       dropdown.update(v => !v);
diff --git a/frontend/src/layouts/ManageLayout.svelte b/frontend/src/layouts/ManageLayout.svelte
index ee9ff6b..a6ddb98 100644
--- a/frontend/src/layouts/ManageLayout.svelte
+++ b/frontend/src/layouts/ManageLayout.svelte
@@ -1,14 +1,14 @@
 <Head/>
 
 <div class="wrapper">
-  <Navbar guildId={guildId} {dropdown}/>
-  <div class="super-container" class:dropdown={$dropdown}>
-    <LoadingScreen/>
-    <div class="content-container" class:hide={$loadingScreen}>
-      <Route {currentRoute} {params}/>
+    <Navbar {guildId} {permissionLevel} {dropdown} />
+    <div class="super-container" class:dropdown={$dropdown}>
+        <LoadingScreen/>
+        <div class="content-container" class:hide={$loadingScreen}>
+            <Route {currentRoute} {params}/>
+        </div>
+        <NotifyModal/>
     </div>
-    <NotifyModal/>
-  </div>
 </div>
 
 <style>
@@ -35,16 +35,37 @@
 </style>
 
 <script>
-    export let currentRoute;
-    export let params = {};
-
-    let guildId = currentRoute.namedParams.id;
-
     import Head from '../includes/Head.svelte'
     import LoadingScreen from '../includes/LoadingScreen.svelte'
     import NotifyModal from '../includes/NotifyModal.svelte'
     import Navbar from '../includes/Navbar.svelte'
 
     import {Route} from 'svelte-router-spa'
-    import {loadingScreen, dropdown} from '../js/stores'
+    import {dropdown, loadingScreen} from '../js/stores'
+    import {notifyError, withLoadingScreen} from '../js/util';
+    import axios from "axios";
+    import {API_URL} from "../js/constants";
+    import {setDefaultHeaders} from '../includes/Auth.svelte'
+
+    export let currentRoute;
+    export let params = {};
+
+    let guildId = currentRoute.namedParams.id;
+    let permissionLevel = 0;
+
+    setDefaultHeaders();
+
+    async function loadPermissionLevel() {
+        const res = await axios.get(`${API_URL}/user/permissionlevel?guild=${guildId}`);
+        if (res.status !== 200 || !res.data.success) {
+            notifyError(res.data.error);
+            return;
+        }
+
+        permissionLevel = res.data.permission_level;
+    }
+
+    withLoadingScreen(async () => {
+        await loadPermissionLevel();
+    });
 </script>
\ No newline at end of file