114 lines
5.1 KiB
TypeScript
114 lines
5.1 KiB
TypeScript
"use client";
|
|
|
|
import axios from "axios";
|
|
import * as React from 'react';
|
|
import { useEffect, useState } from "react";
|
|
import { useSession } from "next-auth/react";
|
|
import GroupElement from "@/components/elements/group";
|
|
import RoleGate from "@/components/auth/role-gate";
|
|
|
|
const permissionPaths = [
|
|
{ path: "tts", description: "Anything to do with TTS" },
|
|
{ path: "tts.chat", description: "Anything to do with chat" },
|
|
{ path: "tts.chat.bits.read", description: "To read chat messages with bits via TTS" },
|
|
{ path: "tts.chat.messages.read", description: "To read chat messages via TTS" },
|
|
{ path: "tts.chat.redemptions.read", description: "To read channel point redemption messages via TTS" },
|
|
//{ path: "tts.chat.subscriptions.read", description: "To read chat messages from subscriptions via TTS" },
|
|
{ path: "tts.commands", description: "To execute commands for TTS" },
|
|
{ path: "tts.commands.nightbot", description: "To use !nightbot command" },
|
|
{ path: "tts.commands.obs", description: "To use !obs command" },
|
|
{ path: "tts.commands.refresh", description: "To use !refresh command" },
|
|
{ path: "tts.commands.skip", description: "To use !skip command" },
|
|
{ path: "tts.commands.skipall", description: "To use !skipall command" },
|
|
{ path: "tts.commands.tts", description: "To use !tts command" },
|
|
{ path: "tts.commands.tts.join", description: "To use !tts join command" },
|
|
{ path: "tts.commands.tts.leave", description: "To use !tts leave command" },
|
|
{ path: "tts.commands.version", description: "To use !version command" },
|
|
{ path: "tts.commands.voice", description: "To use !voice command" },
|
|
{ path: "tts.commands.voice.admin", description: "To use !voice command on others" },
|
|
].sort((a, b) => a.path.localeCompare(b.path))
|
|
|
|
const GroupPermissionPage = () => {
|
|
const { data: session, status } = useSession();
|
|
const [previousUsername, setPreviousUsername] = useState<string | null>()
|
|
const [groups, setGroups] = useState<{ id: string, name: string, priority: number }[]>([])
|
|
const [permissions, setPermissions] = useState<{ id: string, path: string, allow: boolean | null, groupId: string }[]>([])
|
|
const specialGroups = ["everyone", "subscribers", "vip", "moderators", "broadcaster"]
|
|
|
|
function addGroup(id: string, name: string, priority: number) {
|
|
setGroups([...groups, { id, name, priority }])
|
|
}
|
|
|
|
function removeGroup(group: { id: string, name: string, priority: number }) {
|
|
setGroups(groups.filter(g => g.id != group.id))
|
|
}
|
|
|
|
function containsGroup(groupName: string) {
|
|
return groups.some(g => g.name == groupName)
|
|
}
|
|
|
|
useEffect(() => {
|
|
if (status !== "authenticated" || previousUsername == session.user?.name)
|
|
return
|
|
setPreviousUsername(session.user?.name)
|
|
|
|
axios.get('/api/settings/groups')
|
|
.then(d => {
|
|
for (let groupName of specialGroups)
|
|
if (!d.data.some((g: { id: string, name: string, priority: number }) => g.name == groupName))
|
|
d.data.push({ id: "$" + groupName, name: groupName, priority: 0 });
|
|
|
|
axios.get('/api/settings/groups/permissions')
|
|
.then(d2 => {
|
|
setPermissions(d2.data)
|
|
setGroups(d.data)
|
|
})
|
|
})
|
|
|
|
}, [session])
|
|
|
|
return (
|
|
<div>
|
|
<div className="text-2xl text-center pt-[50px]">Groups & Permissions</div>
|
|
<div className="grid sm:grid-cols-1 lg:grid-cols-2 xl:grid-cols-3 gap-3">
|
|
{groups.map(group =>
|
|
<div
|
|
className="col-span-1"
|
|
key={group.id}>
|
|
<GroupElement
|
|
id={group.id}
|
|
name={group.name}
|
|
priority={group.priority}
|
|
permissionsLoaded={permissions.filter(p => p.groupId == group.id)}
|
|
edit={group.id.startsWith('$')}
|
|
showEdit={true}
|
|
isNewGroup={group.id.startsWith('$')}
|
|
permissionPaths={permissionPaths}
|
|
specialGroups={specialGroups}
|
|
adder={addGroup}
|
|
remover={removeGroup}
|
|
contains={containsGroup} />
|
|
</div>
|
|
)}
|
|
<div
|
|
className="col-span-1">
|
|
<GroupElement
|
|
id={undefined}
|
|
name={""}
|
|
priority={0}
|
|
permissionsLoaded={[]}
|
|
edit={true}
|
|
showEdit={false}
|
|
isNewGroup={true}
|
|
permissionPaths={permissionPaths}
|
|
specialGroups={specialGroups}
|
|
adder={addGroup}
|
|
remover={removeGroup}
|
|
contains={containsGroup} />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
export default GroupPermissionPage; |