106 lines
3.9 KiB
TypeScript
106 lines
3.9 KiB
TypeScript
import { db } from "@/db";
|
|
import Link from "next/link";
|
|
import { Button } from "@/components/ui/button";
|
|
import {
|
|
Table,
|
|
TableBody,
|
|
TableCell,
|
|
TableHead,
|
|
TableHeader,
|
|
TableRow,
|
|
} from "@/components/ui/table";
|
|
import { Badge } from "@/components/ui/badge";
|
|
import { Plus } from "lucide-react";
|
|
import { redirect } from "next/navigation";
|
|
import { DeleteFormButton } from "@/components/delete-buttons";
|
|
import { AdminShellServer } from "@/components/admin-shell-server";
|
|
|
|
export const dynamic = "force-dynamic";
|
|
|
|
export default async function AdminFormsPage() {
|
|
const formsList = await db.query.forms.findMany({
|
|
orderBy: (f, { desc }) => [desc(f.createdAt)],
|
|
});
|
|
|
|
return (
|
|
<AdminShellServer>
|
|
<div className="space-y-6 p-4 md:p-6 pb-12 w-full">
|
|
<div className="flex items-center justify-between">
|
|
<div>
|
|
<h1 className="text-3xl font-bold tracking-tight">Forms</h1>
|
|
<p className="text-muted-foreground mt-1">
|
|
Manage your custom forms and view submissions.
|
|
</p>
|
|
</div>
|
|
<form action={async () => {
|
|
"use server";
|
|
const { forms } = await import("@/db/schema");
|
|
const [newForm] = await db.insert(forms).values({
|
|
title: "New Form",
|
|
description: "",
|
|
}).returning();
|
|
redirect(`/admin/form/${newForm.id}`);
|
|
}}>
|
|
<Button type="submit">
|
|
<Plus className="mr-2 h-4 w-4" />
|
|
Create Form
|
|
</Button>
|
|
</form>
|
|
</div>
|
|
|
|
<div className="border rounded-md">
|
|
<Table>
|
|
<TableHeader>
|
|
<TableRow>
|
|
<TableHead>Title</TableHead>
|
|
<TableHead>Status</TableHead>
|
|
<TableHead>Created</TableHead>
|
|
<TableHead className="text-right">Actions</TableHead>
|
|
</TableRow>
|
|
</TableHeader>
|
|
<TableBody>
|
|
{formsList.length === 0 ? (
|
|
<TableRow>
|
|
<TableCell colSpan={4} className="h-24 text-center text-muted-foreground">
|
|
No forms found. Create one to get started.
|
|
</TableCell>
|
|
</TableRow>
|
|
) : (
|
|
formsList.map((form) => (
|
|
<TableRow key={form.id} className="group hover:bg-muted/50 transition-colors">
|
|
<TableCell className="p-0 align-middle">
|
|
<Link href={`/admin/form/${form.id}`} className="flex items-center p-3 font-medium h-full w-full">
|
|
{form.title}
|
|
</Link>
|
|
</TableCell>
|
|
<TableCell className="p-0 align-middle">
|
|
<Link href={`/admin/form/${form.id}`} className="flex items-center p-3 h-full w-full">
|
|
{form.isOpen ? (
|
|
<Badge variant="default">Open</Badge>
|
|
) : (
|
|
<Badge variant="secondary">Closed</Badge>
|
|
)}
|
|
</Link>
|
|
</TableCell>
|
|
<TableCell className="p-0 align-middle">
|
|
<Link href={`/admin/form/${form.id}`} className="flex items-center p-3 h-full w-full">
|
|
{form.createdAt ? new Date(form.createdAt).toLocaleDateString() : 'N/A'}
|
|
</Link>
|
|
</TableCell>
|
|
<TableCell className="text-right space-x-2 p-3">
|
|
<Button variant="outline" asChild size="sm">
|
|
<Link href={`/admin/form/${form.id}/result`}>Results</Link>
|
|
</Button>
|
|
<DeleteFormButton formId={form.id} />
|
|
</TableCell>
|
|
</TableRow>
|
|
))
|
|
)}
|
|
</TableBody>
|
|
</Table>
|
|
</div>
|
|
</div>
|
|
</AdminShellServer>
|
|
);
|
|
}
|