import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { useToast, VModalBody, FormItem, VModalFooter, Input, Switch, Button, VModal, VModalTitle, Textarea } from "@vertesia/ui/core";
import { SelectContentType } from "../types/SelectContentType";
import { useNavigate } from "@vertesia/ui/router";
import { useUserSession } from "@vertesia/ui/session";
import { useState } from "react";
export function CreateCollectionForm({ onClose, redirect = true, onAddToCollection }) {
    const navigate = useNavigate();
    const toast = useToast();
    const [isProcessing, setProcessing] = useState(false);
    const { client } = useUserSession();
    const [payload, setPayload] = useState({
        dynamic: false,
        name: "",
        description: "",
    });
    function setPayloadProp(name, value) {
        setPayload({
            ...payload,
            [name]: value,
        });
    }
    const onCreate = () => {
        if (!payload?.name || !payload.name.trim()) {
            toast({
                title: "Name is required",
                description: "Please provide a name for the collection",
                status: "error",
                duration: 5000,
            });
            return;
        }
        payload.name = payload.name.trim();
        if (payload.description) {
            payload.description = payload.description.trim();
        }
        if (payload.dynamic == null) {
            payload.dynamic = false;
        }
        setProcessing(true);
        client.store.collections
            .create(payload)
            .then((r) => {
            onClose();
            toast({
                title: "Collection created",
                description: `Collection "${r.name}" created successfully`,
                status: "success",
                duration: 3000,
            });
            if (redirect)
                navigate(`/collections/${r.id}`);
            if (onAddToCollection) {
                onAddToCollection(r.id);
            }
        })
            .catch((err) => {
            toast({
                title: "Failed to create collection",
                description: err.message,
                status: "error",
                duration: 5000,
            });
        })
            .finally(() => setProcessing(false));
    };
    return (_jsxs("form", { onSubmit: (e) => e.preventDefault(), children: [_jsxs(VModalBody, { children: [_jsx(FormItem, { label: "Name", required: true, children: _jsx(Input, { type: "text", value: payload.name || "", onChange: (value) => setPayloadProp("name", value) }) }), _jsx(FormItem, { label: "Description", className: "mt-2", children: _jsx(Textarea, { value: payload.description || "", onChange: (ev) => setPayloadProp("description", ev) }) }), _jsx(FormItem, { label: "Dynamic Collection", className: "mt-2", direction: "row", description: "Dynamically fetch content for the collection based on a query. If not enabled, then content must be added by users or agents.", children: _jsx(Switch, { value: payload.dynamic || false, onChange: (value) => setPayloadProp("dynamic", value) }) }), !payload.dynamic &&
                        _jsx(FormItem, { label: "Allowed Content Types", className: "mt-4", description: "Optionally select which content types can be added to the collection. If not set, then all content types are allowed.", children: _jsx(SelectContentType, { defaultValue: payload.allowed_types || null, onChange: (v) => {
                                    if (Array.isArray(v)) {
                                        setPayloadProp("allowed_types", v.map(type => type.id));
                                    }
                                    else {
                                        setPayloadProp("allowed_types", v ? [v.id] : []);
                                    }
                                }, isClearable: true, multiple: true }) }), _jsx(FormItem, { label: "Type", className: "mt-2", description: "Optionally select a content type to assign custom properties and data to the collection.", children: _jsx(SelectContentType, { defaultValue: payload.type || null, onChange: (v) => {
                                if (Array.isArray(v)) {
                                    setPayloadProp("type", v.length > 0 ? v[0].id : null);
                                }
                                else {
                                    setPayloadProp("type", v?.id || null);
                                }
                            }, isClearable: true }) })] }), _jsx(VModalFooter, { children: _jsx(Button, { isDisabled: isProcessing, onClick: onCreate, children: "Create Collection" }) })] }));
}
export function CreateCollectionModal({ isOpen, onClose }) {
    return (_jsxs(VModal, { onClose: onClose, isOpen: isOpen, children: [_jsx(VModalTitle, { children: "Create a Collection" }), _jsx(CreateCollectionForm, { onClose: onClose })] }));
}
//# sourceMappingURL=CreateCollection.js.map