Files
stripstream-librarian/apps/backoffice/app/tokens/page.tsx

67 lines
1.7 KiB
TypeScript

import { listTokens } from "../../lib/api";
export const dynamic = "force-dynamic";
export default async function TokensPage({
searchParams
}: {
searchParams: Promise<{ created?: string }>;
}) {
const params = await searchParams;
const tokens = await listTokens().catch(() => []);
return (
<>
<h1>API Tokens</h1>
{params.created ? (
<div className="card">
<strong>Token created:</strong>
<pre>{params.created}</pre>
</div>
) : null}
<div className="card">
<form action="/tokens/create" method="post">
<input name="name" placeholder="token name" required />
<select name="scope" defaultValue="read">
<option value="read">read</option>
<option value="admin">admin</option>
</select>
<button type="submit">Create Token</button>
</form>
</div>
<table>
<thead>
<tr>
<th>Name</th>
<th>Scope</th>
<th>Prefix</th>
<th>Revoked</th>
<th>Actions</th>
</tr>
</thead>
<tbody>
{tokens.map((token) => (
<tr key={token.id}>
<td>{token.name}</td>
<td>{token.scope}</td>
<td>
<code>{token.prefix}</code>
</td>
<td>{token.revoked_at ? "yes" : "no"}</td>
<td>
<form className="inline" action="/tokens/revoke" method="post">
<input type="hidden" name="id" value={token.id} />
<button type="submit">Revoke</button>
</form>
</td>
</tr>
))}
</tbody>
</table>
</>
);
}