78 lines
2.2 KiB
TypeScript
78 lines
2.2 KiB
TypeScript
|
import { User as U } from "@prisma/client";
|
||
|
|
import Link from "next/link";
|
||
|
|
import { useEffect, useState } from "react";
|
||
|
|
|
||
|
|
interface User extends U {
|
||
|
|
subscriptions: {
|
||
|
|
active: boolean;
|
||
|
|
};
|
||
|
|
}
|
||
|
|
|
||
|
|
export default function Admin() {
|
||
|
|
const [users, setUsers] = useState<User[]>();
|
||
|
|
|
||
|
|
useEffect(() => {
|
||
|
|
// fetch users
|
||
|
|
fetch("/api/v1/users")
|
||
|
|
.then((res) => res.json())
|
||
|
|
.then((data) => setUsers(data.response));
|
||
|
|
}, []);
|
||
|
|
|
||
|
|
return (
|
||
|
|
<div className="max-w-5xl mx-auto mt-5 px-5">
|
||
|
|
<div className="gap-2 inline-flex items-center">
|
||
|
|
<Link
|
||
|
|
href="/dashboard"
|
||
|
|
className="text-neutral btn btn-square btn-sm btn-ghost"
|
||
|
|
>
|
||
|
|
<i className="bi-chevron-left text-xl"></i>
|
||
|
|
</Link>
|
||
|
|
<p className="capitalize text-3xl font-thin inline">
|
||
|
|
User Administration
|
||
|
|
</p>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div className="divider my-3"></div>
|
||
|
|
|
||
|
|
{users && users.length > 0 ? (
|
||
|
|
<div className="overflow-x-auto whitespace-nowrap w-full">
|
||
|
|
<table className="table table-zebra w-full">
|
||
|
|
<thead>
|
||
|
|
<tr>
|
||
|
|
<th></th>
|
||
|
|
<th>Username</th>
|
||
|
|
{process.env.NEXT_PUBLIC_EMAIL_PROVIDER === "true" && (
|
||
|
|
<th>Email</th>
|
||
|
|
)}
|
||
|
|
{process.env.NEXT_PUBLIC_STRIPE === "true" && (
|
||
|
|
<th>Subscribed</th>
|
||
|
|
)}
|
||
|
|
<th>Created At</th>
|
||
|
|
<th>Updated At</th>
|
||
|
|
</tr>
|
||
|
|
</thead>
|
||
|
|
<tbody>
|
||
|
|
{users.map((user, index) => (
|
||
|
|
<tr key={user.id}>
|
||
|
|
<td>{index + 1}</td>
|
||
|
|
<td>{user.username}</td>
|
||
|
|
{process.env.NEXT_PUBLIC_EMAIL_PROVIDER === "true" && (
|
||
|
|
<td>{user.email}</td>
|
||
|
|
)}
|
||
|
|
{process.env.NEXT_PUBLIC_STRIPE === "true" && (
|
||
|
|
<td>{user.subscriptions.active ? "Yes" : "No"}</td>
|
||
|
|
)}
|
||
|
|
<td>{new Date(user.createdAt).toLocaleString()}</td>
|
||
|
|
<td>{new Date(user.updatedAt).toLocaleString()}</td>
|
||
|
|
</tr>
|
||
|
|
))}
|
||
|
|
</tbody>
|
||
|
|
</table>
|
||
|
|
</div>
|
||
|
|
) : (
|
||
|
|
<p>No users found.</p>
|
||
|
|
)}
|
||
|
|
</div>
|
||
|
|
);
|
||
|
|
}
|