139 lines
3.3 KiB
TypeScript
139 lines
3.3 KiB
TypeScript
"use client";
|
|
|
|
import { Loader2, Plus } from "lucide-react";
|
|
import { useState } from "react";
|
|
import { toast } from "sonner";
|
|
import { createCatalogPage } from "@/actions/catalog";
|
|
import { createBcPage } from "@/actions/catalog-bc";
|
|
import { Button } from "@/components/ui/button";
|
|
import {
|
|
Dialog,
|
|
DialogContent,
|
|
DialogHeader,
|
|
DialogTitle,
|
|
DialogTrigger,
|
|
} from "@/components/ui/dialog";
|
|
import { Input } from "@/components/ui/input";
|
|
import { Label } from "@/components/ui/label";
|
|
import {
|
|
Select,
|
|
SelectContent,
|
|
SelectItem,
|
|
SelectTrigger,
|
|
SelectValue,
|
|
} from "@/components/ui/select";
|
|
import { useServerAction } from "@/hooks/use-server-action";
|
|
import { CATALOG_LAYOUTS } from "@/lib/catalog-layouts";
|
|
|
|
interface CatalogActionsProps {
|
|
catalogType?: "normal" | "bc";
|
|
}
|
|
|
|
export function CatalogActions({
|
|
catalogType = "normal",
|
|
}: CatalogActionsProps) {
|
|
const { run, isPending } = useServerAction();
|
|
const [open, setOpen] = useState(false);
|
|
const [caption, setCaption] = useState("");
|
|
const [parentId, setParentId] = useState("-1");
|
|
const [pageLayout, setPageLayout] = useState("default_3x3");
|
|
const isBc = catalogType === "bc";
|
|
|
|
function handleCreate() {
|
|
if (!caption.trim()) {
|
|
toast.error("Caption is required");
|
|
return;
|
|
}
|
|
|
|
const input = {
|
|
caption: caption.trim(),
|
|
parentId: parseInt(parentId, 10),
|
|
pageLayout,
|
|
};
|
|
|
|
const fn = isBc
|
|
? () => createBcPage(input)
|
|
: () => createCatalogPage(input);
|
|
|
|
run(fn, {
|
|
successMessage: `Catalog page "${caption.trim()}" created.`,
|
|
onSuccess: (data) => {
|
|
setOpen(false);
|
|
setCaption("");
|
|
setParentId("-1");
|
|
if (data.id) {
|
|
window.location.href = isBc
|
|
? `/admin/catalog/builder-club/${data.id}`
|
|
: `/admin/catalog/${data.id}`;
|
|
}
|
|
},
|
|
});
|
|
}
|
|
|
|
return (
|
|
<Dialog open={open} onOpenChange={setOpen}>
|
|
<DialogTrigger asChild>
|
|
<Button>
|
|
<Plus className="mr-2 h-4 w-4" />
|
|
New Page
|
|
</Button>
|
|
</DialogTrigger>
|
|
<DialogContent>
|
|
<DialogHeader>
|
|
<DialogTitle>
|
|
{isBc ? "Create Builder Club Page" : "Create Catalog Page"}
|
|
</DialogTitle>
|
|
</DialogHeader>
|
|
<div className="space-y-4">
|
|
<div className="space-y-2">
|
|
<Label htmlFor="caption">Caption</Label>
|
|
<Input
|
|
id="caption"
|
|
value={caption}
|
|
onChange={(e) => setCaption(e.target.value)}
|
|
placeholder="Page name"
|
|
/>
|
|
</div>
|
|
<div className="space-y-2">
|
|
<Label htmlFor="parentId">Parent ID (-1 = root)</Label>
|
|
<Input
|
|
id="parentId"
|
|
type="number"
|
|
value={parentId}
|
|
onChange={(e) => setParentId(e.target.value)}
|
|
/>
|
|
</div>
|
|
<div className="space-y-2">
|
|
<Label>Layout</Label>
|
|
<Select value={pageLayout} onValueChange={setPageLayout}>
|
|
<SelectTrigger>
|
|
<SelectValue />
|
|
</SelectTrigger>
|
|
<SelectContent>
|
|
{CATALOG_LAYOUTS.map((layout) => (
|
|
<SelectItem key={layout} value={layout}>
|
|
{layout}
|
|
</SelectItem>
|
|
))}
|
|
</SelectContent>
|
|
</Select>
|
|
</div>
|
|
|
|
<Button
|
|
onClick={handleCreate}
|
|
disabled={isPending}
|
|
className="w-full"
|
|
>
|
|
{isPending ? (
|
|
<Loader2 className="mr-2 h-4 w-4 animate-spin" />
|
|
) : (
|
|
<Plus className="mr-2 h-4 w-4" />
|
|
)}
|
|
Create Page
|
|
</Button>
|
|
</div>
|
|
</DialogContent>
|
|
</Dialog>
|
|
);
|
|
}
|