fix: 🐛 Hide items from the server settings when you dont have permission

Nerimity · Dec 28, 2022 · ecdf7b3 · ecdf7b3
1 parent 793738f
commit ecdf7b3
Show file tree

Hide file tree

Showing 2 changed files with 17 additions and 2 deletions.
diff --git a/src/common/ServerSettings.ts b/src/common/ServerSettings.ts
@@ -1,9 +1,11 @@
+import { Bitwise, ROLE_PERMISSIONS } from '@/chat-api/Bitwise';
 import { lazy } from 'solid-js';
 
 export interface ServerSetting {
     path?: string;
     name: string;
     icon: string;
+    requiredRole?: Bitwise,
     hideDrawer?: boolean
     element: any
 }
@@ -13,38 +15,44 @@ const serverSettings: ServerSetting[] =  [
     path: 'general',
     name: 'servers.settings.drawer.general',
     icon: 'info',
+    requiredRole: ROLE_PERMISSIONS.ADMIN,
     element: lazy(() => import('@/components/servers/settings/ServerGeneralSettings'))
   },
   {
     path: 'roles/:roleId',
     name: 'servers.settings.drawer.role',
     icon: 'leaderboard',
     hideDrawer: true,
+    requiredRole: ROLE_PERMISSIONS.MANAGE_ROLES,
     element: lazy(() => import('@/components/servers/settings/role/ServerSettingsRole'))
   },
   {
     name: 'servers.settings.drawer.roles',
     path: 'roles',
     icon: 'leaderboard',
+    requiredRole: ROLE_PERMISSIONS.MANAGE_ROLES,
     element: lazy(() => import('@/components/servers/settings/roles/ServerSettingsRoles'))
   },
   {
     path: 'channels/:channelId',
     name: 'servers.settings.drawer.channel',
     icon: 'storage',
+    requiredRole: ROLE_PERMISSIONS.MANAGE_CHANNELS,
     hideDrawer: true,
     element: lazy(() => import('@/components/servers/settings/channel/ServerSettingsChannel'))
   },
   {
     name: 'servers.settings.drawer.channels',
     path: 'channels',
     icon: 'storage',
+    requiredRole: ROLE_PERMISSIONS.MANAGE_CHANNELS,
     element: lazy(() => import('@/components/servers/settings/channels/ServerSettingsChannels'))
   },
   {
     name: 'servers.settings.drawer.bans',
     path: 'bans',
     icon: 'block',
+    requiredRole: ROLE_PERMISSIONS.BAN,
     element: lazy(() => import('@/components/servers/settings/ServerSettingsBans'))
   },
   {
@@ -57,12 +65,14 @@ const serverSettings: ServerSetting[] =  [
     name: 'servers.settings.drawer.publishServer',
     path: 'publish-server',
     icon: 'public',
+    requiredRole: ROLE_PERMISSIONS.ADMIN,
     element: lazy(() => import('@/components/servers/settings/PublishServerSettings'))
   },
   {
     path: 'verify',
     name: 'servers.settings.drawer.verify',
     icon: 'verified',
+    requiredRole: ROLE_PERMISSIONS.ADMIN,
     element: lazy(() => import('@/components/servers/settings/ServerVerifySettings'))
   }
 ]

diff --git a/src/components/servers/settings/ServerSettingsDrawer.tsx b/src/components/servers/settings/ServerSettingsDrawer.tsx
@@ -9,6 +9,7 @@ import ItemContainer from '@/components/ui/Item';
 import { styled } from 'solid-styled-components';
 import Text from '@/components/ui/Text';
 import { useTransContext } from '@mbarzda/solid-i18next';
+import { Bitwise } from '@/chat-api/Bitwise';
 
 const SettingsListContainer = styled("div")`
   display: flex;
@@ -46,6 +47,10 @@ export default function ServerSettingsDrawer() {
 function SettingsList () {
   const [t] = useTransContext();
   const params = useParams();
+  const {serverMembers, account} = useStore();
+  const member = () => serverMembers.get(params.serverId, account.user()?.id!);
+
+  const hasRole = (role?: Bitwise) => !role ? true : member()?.hasPermission(role);
 
   return (
     <SettingsListContainer>
@@ -56,10 +61,10 @@ function SettingsList () {
           const selected = () => params.path === setting.path;
           const isChannels = () => setting.path === "channels";
           return (
-            <>
+            <Show when={hasRole(setting.requiredRole)}>
               <Item path={setting.path || "#  "} icon={setting.icon} label={t(setting.name)} selected={selected()} />
               <Show when={isChannels() && selected()}><ServerChannelsList/></Show>
-            </>
+            </Show>
           )
         }}
       </For>