From c724ffae4363e038a37aab544f64142e1948162c Mon Sep 17 00:00:00 2001
From: Paul <paulmakles@gmail.com>
Date: Wed, 30 Jun 2021 21:28:56 +0100
Subject: [PATCH] View roles in server settings.
---
src/pages/settings/ServerSettings.tsx | 9 ++++-
src/pages/settings/server/Roles.tsx | 54 +++++++++++++++++++++++++++
2 files changed, 62 insertions(+), 1 deletion(-)
create mode 100644 src/pages/settings/server/Roles.tsx
diff --git a/src/pages/settings/ServerSettings.tsx b/src/pages/settings/ServerSettings.tsx
index ca89400..5d34d01 100644
--- a/src/pages/settings/ServerSettings.tsx
+++ b/src/pages/settings/ServerSettings.tsx
@@ -3,7 +3,7 @@ import Category from "../../components/ui/Category";
import { GenericSettings } from "./GenericSettings";
import { useServer } from "../../context/revoltjs/hooks";
import { Route, useHistory, useParams } from "react-router-dom";
-import { ListUl, Share, Group } from "@styled-icons/boxicons-regular";
+import { ListUl, Share, Group, ListCheck } from "@styled-icons/boxicons-regular";
import { XSquare } from "@styled-icons/boxicons-solid";
import RequiresOnline from "../../context/revoltjs/RequiresOnline";
@@ -11,6 +11,7 @@ import { Overview } from "./server/Overview";
import { Members } from "./server/Members";
import { Invites } from "./server/Invites";
import { Bans } from "./server/Bans";
+import { Roles } from "./server/Roles";
export default function ServerSettings() {
const { server: sid } = useParams<{ server: string; }>();
@@ -49,12 +50,18 @@ export default function ServerSettings() {
id: 'bans',
icon: <XSquare size={20} />,
title: "Bans"
+ },
+ {
+ id: 'roles',
+ icon: <ListCheck size={20} />,
+ title: "Roles"
}
]}
children={[
<Route path="/server/:server/settings/members"><RequiresOnline><Members server={server} /></RequiresOnline></Route>,
<Route path="/server/:server/settings/invites"><RequiresOnline><Invites server={server} /></RequiresOnline></Route>,
<Route path="/server/:server/settings/bans"><RequiresOnline><Bans server={server} /></RequiresOnline></Route>,
+ <Route path="/server/:server/settings/roles"><RequiresOnline><Roles server={server} /></RequiresOnline></Route>,
<Route path="/"><Overview server={server} /></Route>
]}
category="server_pages"
diff --git a/src/pages/settings/server/Roles.tsx b/src/pages/settings/server/Roles.tsx
new file mode 100644
index 0000000..308c6e6
--- /dev/null
+++ b/src/pages/settings/server/Roles.tsx
@@ -0,0 +1,54 @@
+import { useEffect, useState } from "preact/hooks";
+import Button from "../../../components/ui/Button";
+import { Servers } from "revolt.js/dist/api/objects";
+import Checkbox from "../../../components/ui/Checkbox";
+import { ServerPermission } from "revolt.js/dist/api/permissions";
+
+interface Props {
+ server: Servers.Server;
+}
+
+export function Roles({ server }: Props) {
+ const [ selected, setSelected ] = useState('default');
+
+ const roles = server.roles ?? {};
+ const keys = [ 'default', ...Object.keys(roles) ];
+
+ const defaultRole = { name: 'Default', permissions: server.default_permissions };
+ const selectedRole: Servers.Role = selected === 'default' ? defaultRole : roles[selected];
+
+ if (!selectedRole) {
+ useEffect(() => setSelected('default'), [ ]);
+ return null;
+ }
+
+ return (
+ <div>
+ <h2>select role</h2>
+ { keys
+ .map(id => {
+ let role: Servers.Role = id === 'default' ? defaultRole : roles[id];
+
+ return (
+ <Checkbox checked={selected === id} onChange={selected => selected && setSelected(id)}>
+ { role.name }
+ </Checkbox>
+ )
+ })
+ }
+ <Button disabled={selected === 'default'} error onClick={() => {}}>delete role</Button>
+ <h2>permmissions</h2>
+ { Object.keys(ServerPermission)
+ .map(perm => {
+ let value = ServerPermission[perm as keyof typeof ServerPermission];
+
+ return (
+ <Checkbox checked={(selectedRole.permissions[0] & value) > 0} onChange={() => {}}>
+ { perm }
+ </Checkbox>
+ )
+ })
+ }
+ </div>
+ );
+}
--
GitLab