hermes-web/components/navigation/settings.tsx

82 lines
3.1 KiB
TypeScript

import Link from "next/link";
import { Button } from "@/components/ui/button";
import UserProfile from "./userprofile";
import AdminProfile from "./adminprofile";
import RoleGate from "@/components/auth/role-gate";
const SettingsNavigation = async () => {
return (
<div className="mt-[100px]">
<div className="w-full pl-[30px] pr-[30px] pb-[50px]">
<UserProfile />
<RoleGate roles={["ADMIN"]}>
<AdminProfile />
</RoleGate>
</div>
<div className="flex flex-grow h-full w-full">
<ul className="rounded-lg shadow-md flex flex-col w-full justify-between text-center align-center">
<li className="text-xs text-gray-200">
Settings
</li>
<li>
<Link href={"/settings/connections"} className="m-0 p-0 gap-0">
<Button variant="ghost" className="w-full text-lg">
Connections
</Button>
</Link>
</li>
<li className="text-xs text-gray-200">
Text to Speech
</li>
<li className="">
<Link href={"/settings/tts/voices"}>
<Button variant="ghost" className="w-full text-lg">
Voices
</Button>
</Link>
</li>
<li className="">
<Link href={"/settings/tts/filters"}>
<Button variant="ghost" className="w-full text-lg">
Filters
</Button>
</Link>
</li>
<li className="">
<Link href={"/settings/groups/permissions"}>
<Button variant="ghost" className="w-full text-lg">
Permissions
</Button>
</Link>
</li>
<li className="text-xs text-gray-200">
Twitch
</li>
<li className="">
<Link href={"/settings/redemptions"}>
<Button variant="ghost" className="w-full text-lg">
Channel Redemptions
</Button>
</Link>
</li>
<li className="text-xs text-gray-200">
API
</li>
<li className="">
<Link href={"/settings/api/keys"}>
<Button variant="ghost" className="w-full text-lg">
Keys
</Button>
</Link>
</li>
</ul>
</div>
</div>
);
}
export default SettingsNavigation;