Files
Epicnabbo-Catalogus-Updated…/src/app/admin/help-questions/new/page.tsx
T

56 lines
2.3 KiB
TypeScript

import Link from "next/link";
import { HelpCircle } from "lucide-react";
import { createHelpQuestion } from "@/actions/admin-help";
export default async function NewHelpQuestion({
searchParams,
}: {
searchParams: Promise<{ error?: string }>;
}) {
const { error } = await searchParams;
return (
<main>
<div className="flex items-center gap-3 mb-6">
<div className="w-10 h-10 rounded-xl bg-gradient-to-br from-[var(--color-primary)]/20 to-[var(--color-primary)]/5 grid place-items-center">
<HelpCircle size={20} className="text-[var(--color-primary)]" />
</div>
<div className="flex-1">
<h1 className="m-0 text-xl font-extrabold text-[var(--color-text)]">New help-center entry</h1>
<p className="m-0 text-xs text-[var(--color-text-muted)] mt-0.5">
<Link href="/admin/help-questions">← Help Center</Link>
</p>
</div>
</div>
{error ? (
<p className="text-xs theme-text-muted dark:theme-text-muted mb-4" style={{ color: "#dc2626" }}>
Error: {error}
</p>
) : null}
<form action={createHelpQuestion} className="admin-card" style={{ display: "grid", gap: "0.6rem" }}>
<input name="name" placeholder="Name / title" required maxLength={255} />
<textarea name="content" placeholder="Content" rows={6} required />
<input name="position" type="number" min={1} defaultValue={1} placeholder="Position" />
<input name="imageUrl" placeholder="Image URL (optional)" maxLength={255} />
<input name="buttonText" placeholder="Button text (optional)" maxLength={255} />
<input name="buttonUrl" placeholder="Button URL (optional)" maxLength={255} />
<label className="flex gap-1.5 items-center">
Button color
<input name="buttonColor" type="color" defaultValue="#eeb425" />
</label>
<label className="flex gap-1.5 items-center">
Button border color
<input name="buttonBorderColor" type="color" defaultValue="#facc15" />
</label>
<label className="flex gap-1.5 items-center">
<input name="smallBox" type="checkbox" value="1" />
Small box
</label>
<button type="submit" className="btn btn-primary">
Create
</button>
</form>
</main>
);
}