SLIGHT change to the role...
This commit is contained in:
parent
f1806ef4a2
commit
c402732f0a
6 changed files with 80 additions and 54 deletions
|
|
@ -1,7 +1,7 @@
|
|||
enum RoleValue {
|
||||
USER
|
||||
ADMIN
|
||||
MATT
|
||||
VIP
|
||||
}
|
||||
|
||||
generator client {
|
||||
|
|
|
|||
|
|
@ -5,6 +5,7 @@ import { AiOutlineClear } from "react-icons/ai";
|
|||
import { FaShieldAlt } from "react-icons/fa";
|
||||
import { IoTrashBinOutline } from "react-icons/io5";
|
||||
import { SiGithub, SiGoogle } from "react-icons/si";
|
||||
import { GiStarFormation } from "react-icons/gi";
|
||||
import { api } from "~/utils/api";
|
||||
import type { Role } from "~/utils/types";
|
||||
import { getServerAuthSession } from "../../server/auth";
|
||||
|
|
@ -158,38 +159,38 @@ const AdminBody: React.FC = () => {
|
|||
<div className="stat">
|
||||
<div className="stat-title">Users</div>
|
||||
<div className="stat-value">
|
||||
{ usersCountLoading || usersCountFetching ? (
|
||||
{usersCountLoading || usersCountFetching ? (
|
||||
<span className="loading loading-dots loading-lg"></span>
|
||||
) : (
|
||||
<>{ usersCount ? usersCount : "0" }</>
|
||||
) }
|
||||
<>{usersCount ? usersCount : "0"}</>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="stat">
|
||||
<div className="stat-title">Rooms</div>
|
||||
<div className="stat-value">
|
||||
{ roomsCountLoading || roomsCountFetching ? (
|
||||
{roomsCountLoading || roomsCountFetching ? (
|
||||
<span className="loading loading-dots loading-lg"></span>
|
||||
) : (
|
||||
<>{ roomsCount ? roomsCount : "0" }</>
|
||||
) }
|
||||
<>{roomsCount ? roomsCount : "0"}</>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="stat">
|
||||
<div className="stat-title">Votes</div>
|
||||
<div className="stat-value">
|
||||
{ votesCountLoading || votesCountFetching ? (
|
||||
{votesCountLoading || votesCountFetching ? (
|
||||
<span className="loading loading-dots loading-lg"></span>
|
||||
) : (
|
||||
<>{ votesCount ? votesCount : "0" }</>
|
||||
) }
|
||||
<>{votesCount ? votesCount : "0"}</>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{ usersCountFetching ||
|
||||
{usersCountFetching ||
|
||||
usersFetching ||
|
||||
roomsCountFetching ||
|
||||
votesCountFetching ? (
|
||||
|
|
@ -198,30 +199,30 @@ const AdminBody: React.FC = () => {
|
|||
<div className="flex flex-row flex-wrap text-center items-center justify-center gap-2">
|
||||
<button
|
||||
className="btn btn-primary m-2"
|
||||
onClick={ () => void clearSessionsHandler() }
|
||||
onClick={() => void clearSessionsHandler()}
|
||||
>
|
||||
Delete All Sessions
|
||||
</button>
|
||||
|
||||
<button
|
||||
className="btn btn-primary"
|
||||
onClick={ () => void refetchData() }
|
||||
onClick={() => void refetchData()}
|
||||
>
|
||||
Re-fetch
|
||||
</button>
|
||||
</div>
|
||||
) }
|
||||
)}
|
||||
|
||||
<div className="card max-w-[80vw] bg-neutral shadow-xl m-4">
|
||||
<div className="card-body">
|
||||
<h2 className="card-title">Users:</h2>
|
||||
|
||||
{ usersLoading || usersFetching ? (
|
||||
{usersLoading || usersFetching ? (
|
||||
<span className="loading loading-dots loading-lg"></span>
|
||||
) : (
|
||||
<div className="overflow-x-scroll">
|
||||
<table className="table text-center">
|
||||
{/* head */ }
|
||||
{/* head */}
|
||||
<thead>
|
||||
<tr className="border-white">
|
||||
<th>ID</th>
|
||||
|
|
@ -233,55 +234,72 @@ const AdminBody: React.FC = () => {
|
|||
</tr>
|
||||
</thead>
|
||||
<tbody className="">
|
||||
{ users
|
||||
{users
|
||||
?.sort((user1, user2) =>
|
||||
user2.createdAt > user1.createdAt ? 1 : -1
|
||||
)
|
||||
.map((user) => {
|
||||
return (
|
||||
<tr key={ user.id } className="hover">
|
||||
<tr key={user.id} className="hover">
|
||||
<td className="max-w-[100px] break-words">
|
||||
{ user.id }
|
||||
{user.id}
|
||||
</td>
|
||||
|
||||
<td className="max-w-[100px] break-normal">
|
||||
{ user.name }
|
||||
{user.name}
|
||||
</td>
|
||||
<td className="max-w-[100px] break-normal">
|
||||
{ user.createdAt.toLocaleDateString() }
|
||||
{user.createdAt.toLocaleDateString()}
|
||||
</td>
|
||||
<td className="max-w-[100px] break-normal">
|
||||
{ user.sessions.length }
|
||||
{user.sessions.length}
|
||||
</td>
|
||||
<td className="max-w-[100px] break-normal">
|
||||
{ getProviders(user).includes("google") && (
|
||||
{getProviders(user).includes("google") && (
|
||||
<SiGoogle className="text-xl m-1 inline-block hover:text-secondary" />
|
||||
) }
|
||||
{ getProviders(user).includes("github") && (
|
||||
)}
|
||||
{getProviders(user).includes("github") && (
|
||||
<SiGithub className="text-xl m-1 inline-block hover:text-secondary" />
|
||||
) }
|
||||
)}
|
||||
</td>
|
||||
<td>
|
||||
<button className="m-2">
|
||||
{ user.role === "ADMIN" ? (
|
||||
{user.role === "ADMIN" ? (
|
||||
<FaShieldAlt
|
||||
className="text-xl inline-block text-primary"
|
||||
onClick={ () =>
|
||||
onClick={() =>
|
||||
void setUserRoleHandler(user.id, "USER")
|
||||
}
|
||||
/>
|
||||
) : (
|
||||
<FaShieldAlt
|
||||
className="text-xl inline-block"
|
||||
onClick={ () =>
|
||||
onClick={() =>
|
||||
void setUserRoleHandler(user.id, "ADMIN")
|
||||
}
|
||||
/>
|
||||
) }
|
||||
)}
|
||||
</button>
|
||||
<button className="m-2">
|
||||
{user.role === "VIP" ? (
|
||||
<GiStarFormation
|
||||
className="text-xl inline-block text-secondary"
|
||||
onClick={() =>
|
||||
void setUserRoleHandler(user.id, "USER")
|
||||
}
|
||||
/>
|
||||
) : (
|
||||
<GiStarFormation
|
||||
className="text-xl inline-block"
|
||||
onClick={() =>
|
||||
void setUserRoleHandler(user.id, "VIP")
|
||||
}
|
||||
/>
|
||||
)}
|
||||
</button>
|
||||
<button
|
||||
className="m-2"
|
||||
onClick={ () =>
|
||||
onClick={() =>
|
||||
void clearSessionsByUserHandler(user.id)
|
||||
}
|
||||
>
|
||||
|
|
@ -289,18 +307,18 @@ const AdminBody: React.FC = () => {
|
|||
</button>
|
||||
<button
|
||||
className="m-2"
|
||||
onClick={ () => void deleteUserHandler(user.id) }
|
||||
onClick={() => void deleteUserHandler(user.id)}
|
||||
>
|
||||
<IoTrashBinOutline className="text-xl inline-block hover:text-error" />
|
||||
</button>
|
||||
</td>
|
||||
</tr>
|
||||
);
|
||||
}) }
|
||||
})}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
) }
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</>
|
||||
|
|
|
|||
|
|
@ -8,6 +8,7 @@ import Link from "next/link";
|
|||
import { useEffect, useState } from "react";
|
||||
import { FaShieldAlt } from "react-icons/fa";
|
||||
import { getServerAuthSession } from "~/server/auth";
|
||||
import { GiStarFormation } from "react-icons/gi";
|
||||
|
||||
export const getServerSideProps: GetServerSideProps = async (ctx) => {
|
||||
const session = await getServerAuthSession(ctx);
|
||||
|
|
@ -57,20 +58,23 @@ const HomePageBody: React.FC = () => {
|
|||
return (
|
||||
<>
|
||||
<h1 className="flex flex-row flex-wrap text-center justify-center items-center gap-1 text-4xl font-bold mx-auto">
|
||||
Hi, { sessionData?.user.name }!{ " " }
|
||||
{ sessionData?.user.role === "ADMIN" && (
|
||||
Hi, {sessionData?.user.name}!{" "}
|
||||
{sessionData?.user.role === "ADMIN" && (
|
||||
<FaShieldAlt className="inline-block text-primary" />
|
||||
) }
|
||||
)}
|
||||
{sessionData?.user.role === "VIP" && (
|
||||
<GiStarFormation className="inline-block text-secondary" />
|
||||
)}
|
||||
</h1>
|
||||
<div className="tabs tabs-boxed border-2 border-cyan-500 mb-4">
|
||||
<a
|
||||
className={
|
||||
tabIndex === 0 ? "tab no-underline tab-active" : "tab no-underline"
|
||||
}
|
||||
onClick={ () => {
|
||||
onClick={() => {
|
||||
setTabIndex(0);
|
||||
localStorage.setItem("dashboardTabIndex", "0");
|
||||
} }
|
||||
}}
|
||||
>
|
||||
Join a Room
|
||||
</a>
|
||||
|
|
@ -78,36 +82,36 @@ const HomePageBody: React.FC = () => {
|
|||
className={
|
||||
tabIndex === 1 ? "tab no-underline tab-active" : "tab no-underline"
|
||||
}
|
||||
onClick={ () => {
|
||||
onClick={() => {
|
||||
setTabIndex(1);
|
||||
localStorage.setItem("dashboardTabIndex", "1");
|
||||
} }
|
||||
}}
|
||||
>
|
||||
Room List
|
||||
</a>
|
||||
</div>
|
||||
|
||||
{ tabIndex === 0 && (
|
||||
{tabIndex === 0 && (
|
||||
<>
|
||||
<input
|
||||
type="text"
|
||||
placeholder="Enter Room ID"
|
||||
className="input input-bordered input-primary mb-4"
|
||||
onChange={ (event) => {
|
||||
onChange={(event) => {
|
||||
console.log(event.target.value);
|
||||
setJoinRoomTextBox(event.target.value);
|
||||
} }
|
||||
}}
|
||||
/>
|
||||
<Link
|
||||
href={ joinRoomTextBox.length > 0 ? `/room/${joinRoomTextBox}` : "/" }
|
||||
href={joinRoomTextBox.length > 0 ? `/room/${joinRoomTextBox}` : "/"}
|
||||
className="btn btn-secondary"
|
||||
>
|
||||
Join Room
|
||||
</Link>
|
||||
</>
|
||||
) }
|
||||
)}
|
||||
|
||||
{ tabIndex === 1 && <RoomList /> }
|
||||
{tabIndex === 1 && <RoomList />}
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
|
|
|||
|
|
@ -311,10 +311,10 @@ const RoomBody: React.FC = ({}) => {
|
|||
<FaShieldAlt className="inline-block text-primary" />
|
||||
</div>
|
||||
)}{" "}
|
||||
{presenceItem.data.role === "MATT" && (
|
||||
{presenceItem.data.role === "VIP" && (
|
||||
<div
|
||||
className="tooltip tooltip-secondary"
|
||||
data-tip="Matt"
|
||||
data-tip="VIP"
|
||||
>
|
||||
<GiStarFormation className="inline-block text-secondary" />
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -153,7 +153,11 @@ export const userRouter = createTRPCRouter({
|
|||
.input(
|
||||
z.object({
|
||||
userId: z.string(),
|
||||
role: z.union([z.literal("ADMIN"), z.literal("USER")]),
|
||||
role: z.union([
|
||||
z.literal("ADMIN"),
|
||||
z.literal("USER"),
|
||||
z.literal("VIP"),
|
||||
]),
|
||||
})
|
||||
)
|
||||
.mutation(async ({ ctx, input }) => {
|
||||
|
|
|
|||
|
|
@ -10,7 +10,7 @@ export type EventType = BetterEnum<typeof EventTypes>;
|
|||
const RoleValues = {
|
||||
ADMIN: "ADMIN",
|
||||
USER: "USER",
|
||||
MATT: "MATT",
|
||||
VIP: "VIP",
|
||||
} as const;
|
||||
export type Role = BetterEnum<typeof RoleValues>;
|
||||
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue