fe01f31538
Some checks failed
Build Frontend / build (push) Failing after 7s
Replaces imports from 'components/ui' with 'components/common' across the app and dashboard pages, and updates model and API imports to use new paths under 'lib'. Removes redundant authentication checks from several dashboard pages. Adds new dashboard components and utility files, and reorganizes hooks and services into the 'lib' directory for improved structure.
92 lines
3.2 KiB
TypeScript
92 lines
3.2 KiB
TypeScript
"use client";
|
|
import { useEffect, useState } from "react";
|
|
import { fetchClient } from "@/lib/api/api-client";
|
|
|
|
interface Invitation {
|
|
_id: string;
|
|
code: string;
|
|
isUsed: boolean;
|
|
createdAt: string;
|
|
expiresAt: string;
|
|
usedAt?: string | null;
|
|
}
|
|
|
|
export default function InvitationsListCard() {
|
|
const [invites, setInvites] = useState<Invitation[]>([]);
|
|
const [loading, setLoading] = useState(true);
|
|
const [error, setError] = useState<string | null>(null);
|
|
|
|
async function deleteInvite(id: string) {
|
|
try {
|
|
await fetchClient(`/admin/invitations/${id}`, { method: 'DELETE' });
|
|
setInvites(prev => prev.filter(i => i._id !== id));
|
|
} catch (e: any) {
|
|
setError(e?.message || 'Failed to delete invitation');
|
|
}
|
|
}
|
|
|
|
useEffect(() => {
|
|
let mounted = true;
|
|
(async () => {
|
|
try {
|
|
const data = await fetchClient<Invitation[]>("/admin/invitations");
|
|
if (mounted) setInvites(data);
|
|
} catch (e: any) {
|
|
if (mounted) setError(e?.message || "Failed to load invitations");
|
|
} finally {
|
|
if (mounted) setLoading(false);
|
|
}
|
|
})();
|
|
return () => { mounted = false; };
|
|
}, []);
|
|
|
|
return (
|
|
<div className="rounded-lg border border-border/60 bg-background p-4 h-full min-h-[200px]">
|
|
<h2 className="font-medium">Invitations</h2>
|
|
<p className="text-sm text-muted-foreground mt-1">Active and recent invitations</p>
|
|
|
|
{loading ? (
|
|
<p className="text-sm text-muted-foreground mt-3">Loading...</p>
|
|
) : error ? (
|
|
<p className="text-sm text-muted-foreground mt-3">{error}</p>
|
|
) : invites.length === 0 ? (
|
|
<p className="text-sm text-muted-foreground mt-3">No invitations found</p>
|
|
) : (
|
|
<div className="mt-3 space-y-2">
|
|
{invites.map((inv) => {
|
|
const expired = new Date(inv.expiresAt).getTime() < Date.now();
|
|
return (
|
|
<div key={inv._id} className="rounded border border-border/50 p-3 text-sm flex items-center justify-between gap-3">
|
|
<div className="space-y-1 min-w-0">
|
|
<div>
|
|
Code: <span className="font-mono px-1.5 py-0.5 rounded bg-muted">{inv.code}</span>
|
|
</div>
|
|
<div className="text-xs text-muted-foreground">
|
|
Created: {new Date(inv.createdAt).toLocaleString()} · Expires: {new Date(inv.expiresAt).toLocaleString()}
|
|
</div>
|
|
</div>
|
|
<div className="flex items-center gap-2 shrink-0">
|
|
<span className={`text-xs px-2 py-0.5 rounded ${inv.isUsed ? 'bg-emerald-500/15 text-emerald-400' : expired ? 'bg-rose-500/15 text-rose-400' : 'bg-amber-500/15 text-amber-400'}`}>
|
|
{inv.isUsed ? 'Used' : expired ? 'Expired' : 'Active'}
|
|
</span>
|
|
{!inv.isUsed && (
|
|
<button
|
|
onClick={() => deleteInvite(inv._id)}
|
|
className="text-xs px-2 py-1 rounded border border-border hover:bg-muted/40"
|
|
>
|
|
Delete
|
|
</button>
|
|
)}
|
|
</div>
|
|
</div>
|
|
);
|
|
})}
|
|
</div>
|
|
)}
|
|
</div>
|
|
);
|
|
}
|
|
|
|
|
|
|