Added basic validation for requests

app/(protected)/settings/groups/permissions/page.tsx

@@ -26,7 +26,6 @@ const permissionPaths = [
     { 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 = () => {
@@ -53,7 +52,6 @@ const GroupPermissionPage = () => {
             return
         setPreviousUsername(session.user?.name)
 
-        // TODO: fetch groups & permissions
         axios.get('/api/settings/groups')
             .then(d => {
                 for (let groupName of specialGroups)
@@ -66,52 +64,48 @@ const GroupPermissionPage = () => {
                         setGroups(d.data)
                     })
             })
-        // TODO: filter permissions by group?
 
     }, [session])
 
     return (
         <div>
             <div className="text-2xl text-center pt-[50px]">Groups & Permissions</div>
-            {/* <InfoNotice
-                message="Redemption actions are activated when specific Twitch channel point redeems have been activated. Aforementioned redeem need to be linked in the redemption part, together with the action, for the action to activate."
-                hidden={false} /> */}
             <div className="grid sm:grid-cols-1 lg:grid-cols-2 xl:grid-cols-3 gap-3">
-            {groups.map(group =>
+                {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"
-                    key={group.id}>
+                    className="col-span-1">
                     <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('$')}
+                        id={undefined}
+                        name={""}
+                        priority={0}
+                        permissionsLoaded={[]}
+                        edit={true}
+                        showEdit={false}
+                        isNewGroup={true}
                         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>
     );