@voyantjs/products-ui 0.101.1 → 0.102.0

package/dist/components/product-detail/product-detail-form.js

@@ -0,0 +1,180 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useQuery } from "@tanstack/react-query";
+import { Badge, Button, Input, Label, Select, SelectContent, SelectItem, SelectTrigger, SelectValue, } from "@voyantjs/ui/components";
+import { Combobox, ComboboxContent, ComboboxEmpty, ComboboxInput, ComboboxItem, ComboboxList, } from "@voyantjs/ui/components/combobox";
+import { currencies } from "@voyantjs/utils/currencies";
+import { Loader2, X } from "lucide-react";
+import { useEffect, useState } from "react";
+import { useForm } from "react-hook-form";
+import { z } from "zod/v4";
+import { useProductDetailApi, useProductDetailMessages, useProductLocale } from "./host.js";
+import { ContentLanguageSwitcher, LanguageCombobox, TranslatableField, useProductTranslationDrafts, } from "./product-translation-popover.js";
+import { zodResolver } from "./zod-resolver.js";
+const CURRENCY_OPTIONS = Object.values(currencies).map((c) => ({
+    value: c.code,
+    label: `${c.code} — ${c.name} (${c.symbol})`,
+}));
+function initialValues(product) {
+    if (product) {
+        return {
+            name: product.name,
+            status: product.status,
+            description: product.description ?? "",
+            bookingMode: product.bookingMode,
+            productTypeId: product.productTypeId ?? "",
+            taxClassId: product.taxClassId ?? "",
+            sellCurrency: product.sellCurrency,
+            tags: product.tags ?? [],
+            defaultLanguageTag: product.defaultLanguageTag ?? "",
+        };
+    }
+    return {
+        name: "",
+        status: "draft",
+        description: "",
+        bookingMode: "itinerary",
+        productTypeId: "",
+        taxClassId: "",
+        sellCurrency: "EUR",
+        tags: [],
+        defaultLanguageTag: "",
+    };
+}
+export function ProductDetailForm({ product, onSuccess, onCancel }) {
+    const messages = useProductDetailMessages();
+    const api = useProductDetailApi();
+    const productMessages = messages.products.core;
+    const isEditing = !!product;
+    const productFormSchema = z.object({
+        name: z.string().min(1, productMessages.validationNameRequired),
+        status: z.enum(["draft", "active", "archived"]),
+        description: z.string().optional().nullable(),
+        bookingMode: z.enum(["date", "date_time", "open", "stay", "transfer", "itinerary", "other"]),
+        productTypeId: z.string().optional().nullable(),
+        taxClassId: z.string().optional().nullable(),
+        sellCurrency: z
+            .string()
+            .min(3, productMessages.validationIsoCurrency)
+            .max(3, productMessages.validationIsoCurrency),
+        tags: z.array(z.string()).default([]),
+        defaultLanguageTag: z.string().optional().nullable(),
+    });
+    const productStatuses = [
+        { value: "draft", label: productMessages.statusDraft },
+        { value: "active", label: productMessages.statusActive },
+        { value: "archived", label: productMessages.statusArchived },
+    ];
+    // Ordered most-common-first for this operator (multi-day tours, then day
+    // trips). The chosen mode also drives the option pricing layout
+    // (rooms vs per-person seats) — see deriveOptionPricingLayout.
+    const bookingModes = [
+        { value: "itinerary", label: productMessages.bookingModeItinerary },
+        { value: "stay", label: productMessages.bookingModeStay },
+        { value: "date", label: productMessages.bookingModeDate },
+        { value: "date_time", label: productMessages.bookingModeDateTime },
+        { value: "transfer", label: productMessages.bookingModeTransfer },
+        { value: "open", label: productMessages.bookingModeOpen },
+        { value: "other", label: productMessages.bookingModeOther },
+    ];
+    const form = useForm({
+        resolver: zodResolver(productFormSchema),
+        defaultValues: initialValues(product),
+    });
+    const translations = useProductTranslationDrafts(product?.id ?? null);
+    const resolvedLocale = useProductLocale();
+    const adminBaseLocale = resolvedLocale.split("-")[0]?.toLowerCase() || "en";
+    const defaultLanguageTag = form.watch("defaultLanguageTag")?.trim() || adminBaseLocale;
+    const [activeLanguage, setActiveLanguage] = useState(defaultLanguageTag);
+    // Following the default language keeps the active field in sync when the
+    // product changes (form.reset) or the default-language setting is edited.
+    useEffect(() => {
+        setActiveLanguage(defaultLanguageTag);
+    }, [defaultLanguageTag]);
+    const [tagInput, setTagInput] = useState("");
+    const { data: typesData } = useQuery({
+        queryKey: ["product-types"],
+        queryFn: () => api.get("/v1/products/product-types?limit=25&active=true"),
+    });
+    const { data: taxClassesData } = useQuery({
+        queryKey: ["tax-classes"],
+        queryFn: () => api.get("/v1/admin/finance/tax-classes?limit=100&active=true"),
+    });
+    const productTypes = typesData?.data ?? [];
+    const taxClasses = taxClassesData?.data ?? [];
+    useEffect(() => {
+        form.reset(initialValues(product));
+        setTagInput("");
+    }, [product, form]);
+    const onSubmit = async (values) => {
+        const resolvedDefaultLanguage = values.defaultLanguageTag?.trim() || adminBaseLocale;
+        const payload = {
+            name: values.name,
+            status: values.status,
+            description: values.description || null,
+            bookingMode: values.bookingMode,
+            productTypeId: values.productTypeId || null,
+            taxClassId: values.taxClassId || null,
+            sellCurrency: values.sellCurrency,
+            tags: values.tags,
+            defaultLanguageTag: resolvedDefaultLanguage,
+        };
+        const persistOptions = {
+            defaultLanguageTag: resolvedDefaultLanguage,
+            baseName: values.name,
+            baseDescription: values.description ?? "",
+        };
+        if (isEditing) {
+            await api.patch(`/v1/products/${product.id}`, payload);
+            await translations.persist(product.id, persistOptions);
+            onSuccess();
+        }
+        else {
+            const result = await api.post("/v1/products", payload);
+            await translations.persist(result.id, persistOptions);
+            onSuccess(result.id);
+        }
+    };
+    return (_jsxs("form", { onSubmit: form.handleSubmit(onSubmit), className: "flex flex-1 flex-col gap-4 overflow-hidden", children: [_jsxs("div", { className: "grid gap-4", children: [_jsx(ContentLanguageSwitcher, { activeLanguage: activeLanguage, defaultLanguageTag: defaultLanguageTag, languageTags: translations.drafts.map((draft) => draft.languageTag), messages: productMessages, onSelect: setActiveLanguage, onAddLanguage: (code) => {
+                            translations.addLanguage(code);
+                            setActiveLanguage(code);
+                        }, onRemoveLanguage: (code) => {
+                            translations.removeLanguage(code);
+                            if (activeLanguage === code)
+                                setActiveLanguage(defaultLanguageTag);
+                        } }), _jsx(TranslatableField, { label: productMessages.nameLabel, type: "text", field: "name", activeLanguage: activeLanguage, defaultLanguageTag: defaultLanguageTag, base: {
+                            value: form.watch("name") ?? "",
+                            onChange: (value) => form.setValue("name", value, { shouldDirty: true, shouldValidate: true }),
+                        }, translations: translations, messages: productMessages, placeholder: productMessages.namePlaceholder, autoFocus: true, error: form.formState.errors.name?.message }), _jsx(TranslatableField, { label: productMessages.descriptionLabel, type: "richtext", field: "description", activeLanguage: activeLanguage, defaultLanguageTag: defaultLanguageTag, base: {
+                            value: form.watch("description") ?? "",
+                            onChange: (value) => form.setValue("description", value, { shouldDirty: true }),
+                        }, translations: translations, messages: productMessages, placeholder: productMessages.descriptionPlaceholder }), _jsx(TranslatableField, { label: productMessages.slugLabel, type: "text", field: "slug", activeLanguage: activeLanguage, defaultLanguageTag: defaultLanguageTag, translations: translations, messages: productMessages, placeholder: productMessages.slugPlaceholder }), _jsxs("div", { className: "flex flex-col gap-2", children: [_jsx(Label, { children: productMessages.defaultLanguageLabel }), _jsx(LanguageCombobox, { value: form.watch("defaultLanguageTag")?.trim() || adminBaseLocale, onValueChange: (code) => form.setValue("defaultLanguageTag", code, { shouldDirty: true }), placeholder: productMessages.translationLanguageSearch, emptyLabel: productMessages.translationLanguageEmpty }), _jsx("p", { className: "text-xs text-muted-foreground", children: productMessages.defaultLanguageHint })] }), _jsxs("div", { className: "flex flex-col gap-2", children: [_jsx(Label, { children: productMessages.tagsLabel }), _jsx("div", { className: "flex flex-wrap gap-1.5", children: (form.watch("tags") ?? []).map((tag) => (_jsxs(Badge, { variant: "secondary", className: "gap-1 text-xs", children: [tag, _jsx("button", { type: "button", className: "ml-0.5 rounded-full hover:text-destructive", onClick: () => {
+                                                const current = form.getValues("tags") ?? [];
+                                                form.setValue("tags", current.filter((t) => t !== tag), { shouldDirty: true });
+                                            }, children: _jsx(X, { className: "h-3 w-3" }) })] }, tag))) }), _jsx(Input, { value: tagInput, onChange: (e) => setTagInput(e.target.value), onKeyDown: (e) => {
+                                    if (e.key === "Enter" || e.key === ",") {
+                                        e.preventDefault();
+                                        const value = tagInput.trim().replace(/,+$/, "");
+                                        const current = form.getValues("tags") ?? [];
+                                        if (value && !current.includes(value)) {
+                                            form.setValue("tags", [...current, value], { shouldDirty: true });
+                                        }
+                                        setTagInput("");
+                                    }
+                                }, placeholder: productMessages.tagInputPlaceholder })] }), _jsxs("div", { className: "grid grid-cols-2 gap-4", children: [_jsxs("div", { className: "flex flex-col gap-2", children: [_jsx(Label, { children: productMessages.bookingModeLabel }), _jsxs(Select, { value: form.watch("bookingMode"), onValueChange: (v) => form.setValue("bookingMode", v), items: bookingModes, children: [_jsx(SelectTrigger, { className: "w-full", children: _jsx(SelectValue, {}) }), _jsx(SelectContent, { children: bookingModes.map((m) => (_jsx(SelectItem, { value: m.value, children: m.label }, m.value))) })] })] }), _jsxs("div", { className: "flex flex-col gap-2", children: [_jsx(Label, { children: productMessages.productTypeLabel }), _jsxs(Select, { value: form.watch("productTypeId") ?? "", onValueChange: (v) => form.setValue("productTypeId", v === "__none__" ? null : v, {
+                                            shouldDirty: true,
+                                        }), items: [
+                                            { value: "__none__", label: productMessages.productTypeNone },
+                                            ...productTypes.map((t) => ({ value: t.id, label: t.name })),
+                                        ], children: [_jsx(SelectTrigger, { className: "w-full", children: _jsx(SelectValue, { placeholder: productMessages.productTypeNone }) }), _jsxs(SelectContent, { children: [_jsx(SelectItem, { value: "__none__", children: productMessages.productTypeNone }), productTypes.map((t) => (_jsx(SelectItem, { value: t.id, children: t.name }, t.id)))] })] })] })] }), isEditing && (_jsxs("div", { className: "grid grid-cols-2 gap-4", children: [_jsxs("div", { className: "flex flex-col gap-2", children: [_jsx(Label, { children: productMessages.statusLabel }), _jsxs(Select, { value: form.watch("status"), onValueChange: (v) => form.setValue("status", v), items: productStatuses, children: [_jsx(SelectTrigger, { className: "w-full", children: _jsx(SelectValue, {}) }), _jsx(SelectContent, { children: productStatuses.map((s) => (_jsx(SelectItem, { value: s.value, children: s.label }, s.value))) })] })] }), _jsxs("div", { className: "flex flex-col gap-2", children: [_jsx(Label, { children: productMessages.taxClassLabel }), _jsxs(Select, { value: form.watch("taxClassId") ?? "", onValueChange: (v) => form.setValue("taxClassId", v === "__none__" ? null : v, {
+                                            shouldDirty: true,
+                                        }), items: [
+                                            { value: "__none__", label: productMessages.taxClassNone },
+                                            ...taxClasses.map((taxClass) => ({
+                                                value: taxClass.id,
+                                                label: taxClass.label,
+                                            })),
+                                        ], children: [_jsx(SelectTrigger, { className: "w-full", children: _jsx(SelectValue, { placeholder: productMessages.taxClassNone }) }), _jsxs(SelectContent, { children: [_jsx(SelectItem, { value: "__none__", children: productMessages.taxClassNone }), taxClasses.map((taxClass) => (_jsx(SelectItem, { value: taxClass.id, children: taxClass.label }, taxClass.id)))] })] })] }), _jsxs("div", { className: "flex flex-col gap-2", children: [_jsx(Label, { children: productMessages.sellCurrencyLabel }), _jsx(CurrencyCombobox, { value: form.watch("sellCurrency"), onChange: (v) => form.setValue("sellCurrency", v, { shouldDirty: true }), messages: productMessages }), form.formState.errors.sellCurrency && (_jsx("p", { className: "text-xs text-destructive", children: form.formState.errors.sellCurrency.message }))] })] }))] }), _jsxs("div", { className: "flex items-center justify-end gap-2", children: [onCancel ? (_jsx(Button, { type: "button", variant: "ghost", size: "sm", onClick: onCancel, children: productMessages.cancel })) : null, _jsxs(Button, { type: "submit", size: "sm", disabled: form.formState.isSubmitting, children: [form.formState.isSubmitting && _jsx(Loader2, { className: "mr-2 h-4 w-4 animate-spin" }), isEditing ? productMessages.saveChanges : productMessages.createProduct] })] })] }));
+}
+function CurrencyCombobox({ value, onChange, messages, }) {
+    return (_jsxs(Combobox, { value: value, onValueChange: (v) => onChange(v ?? ""), children: [_jsx(ComboboxInput, { placeholder: messages.currencySearchPlaceholder, className: "w-full" }), _jsx(ComboboxContent, { children: _jsxs(ComboboxList, { children: [CURRENCY_OPTIONS.map((c) => (_jsxs(ComboboxItem, { value: c.value, children: [_jsx("span", { className: "font-mono text-xs", children: c.value }), _jsx("span", { className: "truncate text-muted-foreground", children: c.label.split(" — ")[1] })] }, c.value))), _jsx(ComboboxEmpty, { children: messages.currencyEmpty })] }) })] }));
+}

package/dist/components/product-detail/product-detail-header.d.ts

@@ -0,0 +1,12 @@
+import type { ProductRecord } from "./product-detail-shared.js";
+export interface ProductDetailHeaderProps {
+    product: ProductRecord;
+    isDuplicating: boolean;
+    isDeleting: boolean;
+    onEdit: () => void;
+    onAddBooking: () => void;
+    onDuplicate: () => void;
+    onDelete: () => void;
+}
+export declare function ProductDetailHeader({ product, isDuplicating, isDeleting, onEdit, onAddBooking, onDuplicate, onDelete, }: ProductDetailHeaderProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=product-detail-header.d.ts.map

package/dist/components/product-detail/product-detail-header.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"product-detail-header.d.ts","sourceRoot":"","sources":["../../../src/components/product-detail/product-detail-header.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,4BAA4B,CAAA;AAG/D,MAAM,WAAW,wBAAwB;IACvC,OAAO,EAAE,aAAa,CAAA;IACtB,aAAa,EAAE,OAAO,CAAA;IACtB,UAAU,EAAE,OAAO,CAAA;IACnB,MAAM,EAAE,MAAM,IAAI,CAAA;IAClB,YAAY,EAAE,MAAM,IAAI,CAAA;IACxB,WAAW,EAAE,MAAM,IAAI,CAAA;IACvB,QAAQ,EAAE,MAAM,IAAI,CAAA;CACrB;AAED,wBAAgB,mBAAmB,CAAC,EAClC,OAAO,EACP,aAAa,EACb,UAAU,EACV,MAAM,EACN,YAAY,EACZ,WAAW,EACX,QAAQ,GACT,EAAE,wBAAwB,2CAwC1B"}

package/dist/components/product-detail/product-detail-header.js

@@ -0,0 +1,19 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Badge, Button, DropdownMenuItem } from "@voyantjs/ui/components";
+import { CalendarPlus, Copy, Pencil, Trash2 } from "lucide-react";
+import { useEffect } from "react";
+import { useProductDetailHost, useProductDetailMessages } from "./host.js";
+import { ActionMenu } from "./product-detail-sections.js";
+import { getProductStatusLabel, statusVariant } from "./product-detail-shared.js";
+export function ProductDetailHeader({ product, isDuplicating, isDeleting, onEdit, onAddBooking, onDuplicate, onDelete, }) {
+    const messages = useProductDetailMessages();
+    const productMessages = messages.products.core;
+    const { setBreadcrumbs } = useProductDetailHost();
+    useEffect(() => {
+        setBreadcrumbs?.([
+            { label: productMessages.breadcrumbProducts, href: "/products" },
+            { label: product.name },
+        ]);
+    }, [setBreadcrumbs, productMessages.breadcrumbProducts, product.name]);
+    return (_jsxs("div", { className: "flex items-center justify-between", children: [_jsxs("div", { className: "flex items-center gap-3", children: [_jsx("h1", { className: "text-2xl font-bold tracking-tight", children: product.name }), _jsx(Badge, { variant: statusVariant[product.status] ?? "secondary", children: getProductStatusLabel(product.status, messages) })] }), _jsxs("div", { className: "flex items-center gap-2", children: [_jsxs(Button, { variant: "outline", size: "sm", onClick: onEdit, children: [_jsx(Pencil, { className: "h-4 w-4" }), productMessages.edit] }), _jsxs(Button, { variant: "outline", size: "sm", onClick: onAddBooking, children: [_jsx(CalendarPlus, { className: "h-4 w-4" }), productMessages.addBooking] }), _jsxs(ActionMenu, { children: [_jsxs(DropdownMenuItem, { disabled: isDuplicating, onClick: onDuplicate, children: [_jsx(Copy, { className: "h-4 w-4" }), productMessages.duplicate] }), _jsxs(DropdownMenuItem, { variant: "destructive", disabled: isDeleting, onClick: onDelete, children: [_jsx(Trash2, { className: "h-4 w-4" }), productMessages.delete] })] })] })] }));
+}

package/dist/components/product-detail/product-detail-itinerary-section.d.ts

@@ -0,0 +1,4 @@
+export declare function ProductDetailItinerarySection({ productId }: {
+    productId: string;
+}): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=product-detail-itinerary-section.d.ts.map

package/dist/components/product-detail/product-detail-itinerary-section.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"product-detail-itinerary-section.d.ts","sourceRoot":"","sources":["../../../src/components/product-detail/product-detail-itinerary-section.tsx"],"names":[],"mappings":"AA6EA,wBAAgB,6BAA6B,CAAC,EAAE,SAAS,EAAE,EAAE;IAAE,SAAS,EAAE,MAAM,CAAA;CAAE,2CAsXjF"}

package/dist/components/product-detail/product-detail-itinerary-section.js

@@ -0,0 +1,201 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useQueryClient } from "@tanstack/react-query";
+import { formatMessage } from "@voyantjs/i18n";
+import { productsQueryKeys, useProductDayMutation, useProductItineraries, useProductItineraryDays, useProductItineraryMutation, } from "@voyantjs/products-react";
+import { Badge, Button, DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuSeparator, DropdownMenuTrigger, } from "@voyantjs/ui/components";
+import { AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogTitle, } from "@voyantjs/ui/components/alert-dialog";
+import { Copy, MoreHorizontal, Pencil, Plus, Star, Trash2 } from "lucide-react";
+import { useEffect, useMemo, useState } from "react";
+import { ProductItineraryDialog } from "../product-itinerary-dialog.js";
+import { useProductDetailApi, useProductDetailMessages } from "./host.js";
+import { ProductDaySheet } from "./product-day-sheet.js";
+import { ProductDetailDayRow } from "./product-detail-day-row.js";
+import { ActionMenu, EmptyState, Section } from "./product-detail-sections.js";
+import { ServiceDialog } from "./product-service-dialog.js";
+/**
+ * Storage-only upload handler for the day media tray. The tray does its
+ * own DB insert via `useProductMediaMutation.create` after this returns,
+ * so this handler must NOT call the products API — only the R2 upload
+ * endpoint — otherwise we'd write two media rows per file.
+ */
+const uploadDayMediaToStorage = async (file) => {
+    const formData = new FormData();
+    formData.append("file", file);
+    const res = await fetch("/api/v1/uploads", {
+        method: "POST",
+        body: formData,
+        credentials: "include",
+    });
+    if (!res.ok)
+        throw new Error(`Upload failed (${res.status})`);
+    const upload = (await res.json());
+    const mediaType = upload.mimeType.startsWith("video/")
+        ? "video"
+        : upload.mimeType.startsWith("image/")
+            ? "image"
+            : "document";
+    return {
+        url: upload.url,
+        name: file.name,
+        storageKey: upload.key,
+        mimeType: upload.mimeType,
+        fileSize: upload.size,
+        mediaType,
+    };
+};
+export function ProductDetailItinerarySection({ productId }) {
+    const messages = useProductDetailMessages();
+    const api = useProductDetailApi();
+    const productMessages = messages.products.core;
+    const queryClient = useQueryClient();
+    const itineraryQuery = useProductItineraries(productId);
+    const itineraryMutation = useProductItineraryMutation();
+    const dayMutation = useProductDayMutation();
+    const productActionLedgerQueryKey = [...productsQueryKeys.product(productId), "action-ledger"];
+    const invalidateProductActionLedger = () => queryClient.invalidateQueries({ queryKey: productActionLedgerQueryKey });
+    const [expandedDayId, setExpandedDayId] = useState(null);
+    const [selectedItineraryId, setSelectedItineraryId] = useState(null);
+    const [dayDialogOpen, setDayDialogOpen] = useState(false);
+    const [editingDay, setEditingDay] = useState();
+    const [serviceDialogOpen, setServiceDialogOpen] = useState(false);
+    const [serviceDialogDayId, setServiceDialogDayId] = useState("");
+    const [editingService, setEditingService] = useState();
+    const [itineraryDialogOpen, setItineraryDialogOpen] = useState(false);
+    const [editingItinerary, setEditingItinerary] = useState();
+    const [deleteItineraryTarget, setDeleteItineraryTarget] = useState(null);
+    const itineraries = useMemo(() => itineraryQuery.data?.data ?? [], [itineraryQuery.data?.data]);
+    const hasMultiple = itineraries.length > 1;
+    useEffect(() => {
+        if (itineraries.length === 0) {
+            setSelectedItineraryId(null);
+            return;
+        }
+        setSelectedItineraryId((current) => {
+            if (current && itineraries.some((itinerary) => itinerary.id === current)) {
+                return current;
+            }
+            return itineraries.find((itinerary) => itinerary.isDefault)?.id ?? itineraries[0]?.id ?? null;
+        });
+    }, [itineraries]);
+    const selectedItinerary = useMemo(() => itineraries.find((itinerary) => itinerary.id === selectedItineraryId), [itineraries, selectedItineraryId]);
+    const daysQuery = useProductItineraryDays(productId, selectedItineraryId, {
+        enabled: Boolean(selectedItineraryId),
+    });
+    const days = useMemo(() => (daysQuery.data?.data ?? []).slice().sort((left, right) => left.dayNumber - right.dayNumber), [daysQuery.data?.data]);
+    const nextDayNumber = days.length > 0 ? Math.max(...days.map((day) => day.dayNumber)) + 1 : 1;
+    const openCreateItinerary = () => {
+        setEditingItinerary(undefined);
+        setItineraryDialogOpen(true);
+    };
+    const openRenameItinerary = (itinerary) => {
+        setEditingItinerary(itinerary);
+        setItineraryDialogOpen(true);
+    };
+    const handleSetDefault = async (itinerary) => {
+        if (itinerary.isDefault)
+            return;
+        await itineraryMutation.update.mutateAsync({
+            productId,
+            itineraryId: itinerary.id,
+            input: { isDefault: true },
+        });
+        void invalidateProductActionLedger();
+    };
+    const handleDuplicate = async (itinerary) => {
+        const result = await itineraryMutation.duplicate.mutateAsync({
+            productId,
+            itineraryId: itinerary.id,
+        });
+        setExpandedDayId(null);
+        setSelectedItineraryId(result.itinerary.id);
+        void invalidateProductActionLedger();
+    };
+    const handleConfirmDelete = async () => {
+        if (!deleteItineraryTarget)
+            return;
+        await itineraryMutation.remove.mutateAsync({
+            productId,
+            itineraryId: deleteItineraryTarget.id,
+        });
+        setDeleteItineraryTarget(null);
+        void invalidateProductActionLedger();
+    };
+    const sectionTitle = hasMultiple
+        ? productMessages.itinerariesTitle
+        : productMessages.itineraryTitle;
+    return (_jsxs(_Fragment, { children: [_jsx(Section, { title: sectionTitle, actions: _jsxs("div", { className: "flex items-center gap-2", children: [_jsxs(Button, { size: "sm", disabled: !selectedItinerary, onClick: () => {
+                                setEditingDay(undefined);
+                                setDayDialogOpen(true);
+                            }, children: [_jsx(Plus, { className: "mr-2 h-4 w-4" }), productMessages.addDay] }), _jsxs(ActionMenu, { children: [_jsxs(DropdownMenuItem, { onClick: openCreateItinerary, children: [_jsx(Plus, { className: "h-4 w-4" }), productMessages.newItinerary] }), selectedItinerary && !hasMultiple ? (_jsxs(_Fragment, { children: [_jsx(DropdownMenuSeparator, {}), _jsxs(DropdownMenuItem, { onClick: () => openRenameItinerary(selectedItinerary), children: [_jsx(Pencil, { className: "h-4 w-4" }), productMessages.renameItinerary] }), _jsxs(DropdownMenuItem, { onClick: () => void handleDuplicate(selectedItinerary), children: [_jsx(Copy, { className: "h-4 w-4" }), productMessages.duplicateItinerary] })] })) : null] })] }), children: itineraryQuery.isPending ? (_jsx(EmptyState, { message: "\u2026" })) : itineraryQuery.isError ? (_jsx("p", { className: "py-6 text-center text-sm text-destructive", children: "Failed to load itineraries." })) : itineraries.length === 0 ? (_jsxs("div", { className: "flex flex-col items-start gap-3 rounded-md border border-dashed p-6", children: [_jsx("p", { className: "text-sm text-muted-foreground", children: productMessages.noItinerariesYet }), _jsxs(Button, { variant: "outline", size: "sm", onClick: openCreateItinerary, children: [_jsx(Plus, { className: "mr-2 h-4 w-4" }), productMessages.newItinerary] })] })) : (_jsxs("div", { className: "flex flex-col gap-4", children: [hasMultiple ? (_jsx("div", { className: "flex flex-wrap items-center gap-1 rounded-md border bg-muted/30 p-1", children: itineraries.map((itinerary) => {
+                                const isSelected = itinerary.id === selectedItineraryId;
+                                return (_jsxs("div", { className: `flex items-center gap-1 rounded-sm pl-2 pr-1 transition-colors ${isSelected ? "bg-background shadow-sm" : "hover:bg-background/60"}`, children: [_jsxs("button", { type: "button", onClick: () => {
+                                                setExpandedDayId(null);
+                                                setSelectedItineraryId(itinerary.id);
+                                            }, className: "flex items-center gap-2 py-1.5 text-sm", children: [_jsx("span", { className: isSelected ? "font-medium" : "text-muted-foreground", children: itinerary.name }), itinerary.isDefault ? (_jsx(Badge, { variant: "secondary", className: "h-5 px-1.5 text-[10px]", children: productMessages.defaultBadge })) : null] }), _jsxs(DropdownMenu, { children: [_jsx(DropdownMenuTrigger, { asChild: true, children: _jsx(Button, { variant: "ghost", size: "icon", "aria-label": formatMessage(productMessages.itineraryRowOptionsLabel, {
+                                                            name: itinerary.name,
+                                                        }), className: "h-6 w-6 text-muted-foreground", children: _jsx(MoreHorizontal, { className: "h-3.5 w-3.5" }) }) }), _jsxs(DropdownMenuContent, { align: "end", children: [_jsxs(DropdownMenuItem, { onClick: () => openRenameItinerary(itinerary), children: [_jsx(Pencil, { className: "h-4 w-4" }), productMessages.renameItinerary] }), _jsxs(DropdownMenuItem, { onClick: () => void handleDuplicate(itinerary), children: [_jsx(Copy, { className: "h-4 w-4" }), productMessages.duplicateItinerary] }), _jsxs(DropdownMenuItem, { disabled: itinerary.isDefault, onClick: () => handleSetDefault(itinerary), children: [_jsx(Star, { className: "h-4 w-4" }), productMessages.setDefaultItinerary] }), _jsx(DropdownMenuSeparator, {}), _jsxs(DropdownMenuItem, { variant: "destructive", disabled: itinerary.isDefault && itineraries.length > 1, onClick: () => setDeleteItineraryTarget(itinerary), children: [_jsx(Trash2, { className: "h-4 w-4" }), productMessages.deleteItinerary] })] })] })] }, itinerary.id));
+                            }) })) : null, daysQuery.isPending ? (_jsx(EmptyState, { message: "\u2026" })) : daysQuery.isError ? (_jsx("p", { className: "py-6 text-center text-sm text-destructive", children: messages.products.operations.itineraries.daysLoadFailed })) : days.length === 0 ? (_jsx(EmptyState, { message: productMessages.itineraryEmpty })) : (_jsx("div", { className: "flex flex-col gap-2", children: days.map((day) => (_jsx(ProductDetailDayRow, { day: day, productId: productId, expanded: expandedDayId === day.id, onToggle: () => setExpandedDayId((current) => (current === day.id ? null : day.id)), onEdit: () => {
+                                    setEditingDay(day);
+                                    setDayDialogOpen(true);
+                                }, onDelete: () => {
+                                    if (window.confirm(productMessages.deleteDayConfirm)) {
+                                        dayMutation.remove.mutate({
+                                            productId,
+                                            itineraryId: selectedItineraryId ?? undefined,
+                                            dayId: day.id,
+                                        }, {
+                                            onSuccess: () => void invalidateProductActionLedger(),
+                                        });
+                                    }
+                                }, onAddService: () => {
+                                    setServiceDialogDayId(day.id);
+                                    setEditingService(undefined);
+                                    setServiceDialogOpen(true);
+                                }, onEditService: (service) => {
+                                    setServiceDialogDayId(day.id);
+                                    setEditingService(service);
+                                    setServiceDialogOpen(true);
+                                }, onDeleteService: (serviceId) => {
+                                    if (window.confirm(productMessages.deleteServiceConfirm)) {
+                                        void api
+                                            .delete(`/v1/products/${productId}/days/${day.id}/services/${serviceId}`)
+                                            .then(async () => {
+                                            await queryClient.invalidateQueries({
+                                                queryKey: ["product-day-services", productId, day.id],
+                                            });
+                                            await invalidateProductActionLedger();
+                                        });
+                                    }
+                                } }, day.id))) }))] })) }), _jsx(ProductDaySheet, { open: dayDialogOpen, onOpenChange: setDayDialogOpen, productId: productId, itineraryId: selectedItineraryId ?? "", day: editingDay, nextDayNumber: nextDayNumber, uploadMedia: uploadDayMediaToStorage, onSuccess: () => {
+                    setDayDialogOpen(false);
+                    setEditingDay(undefined);
+                    if (selectedItineraryId) {
+                        void queryClient.invalidateQueries({
+                            queryKey: ["products", productId, "itineraries", selectedItineraryId, "days"],
+                        });
+                    }
+                    void invalidateProductActionLedger();
+                } }), _jsx(ServiceDialog, { open: serviceDialogOpen, onOpenChange: setServiceDialogOpen, productId: productId, dayId: serviceDialogDayId, service: editingService, onSuccess: () => {
+                    setServiceDialogOpen(false);
+                    setEditingService(undefined);
+                    void queryClient.invalidateQueries({
+                        queryKey: ["product-day-services", productId, serviceDialogDayId],
+                    });
+                    void invalidateProductActionLedger();
+                } }), _jsx(ProductItineraryDialog, { open: itineraryDialogOpen, onOpenChange: (open) => {
+                    setItineraryDialogOpen(open);
+                    if (!open)
+                        setEditingItinerary(undefined);
+                }, productId: productId, itinerary: editingItinerary, itineraryCount: itineraries.length, onSuccess: (itineraryId) => {
+                    if (!editingItinerary)
+                        setSelectedItineraryId(itineraryId);
+                    void invalidateProductActionLedger();
+                } }), _jsx(AlertDialog, { open: !!deleteItineraryTarget, onOpenChange: (open) => {
+                    if (!open)
+                        setDeleteItineraryTarget(null);
+                }, children: _jsxs(AlertDialogContent, { size: "sm", children: [_jsxs(AlertDialogHeader, { children: [_jsx(AlertDialogTitle, { children: productMessages.deleteItineraryTitle }), _jsx(AlertDialogDescription, { children: deleteItineraryTarget
+                                        ? formatMessage(productMessages.deleteItineraryDescription, {
+                                            name: deleteItineraryTarget.name,
+                                        })
+                                        : null })] }), _jsxs(AlertDialogFooter, { children: [_jsx(AlertDialogCancel, { children: productMessages.cancel }), _jsx(AlertDialogAction, { variant: "destructive", onClick: () => void handleConfirmDelete(), children: productMessages.confirmDelete })] })] }) })] }));
+}

package/dist/components/product-detail/product-detail-page.d.ts

@@ -0,0 +1,4 @@
+export declare function ProductDetailPage({ id }: {
+    id: string;
+}): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=product-detail-page.d.ts.map

package/dist/components/product-detail/product-detail-page.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"product-detail-page.d.ts","sourceRoot":"","sources":["../../../src/components/product-detail/product-detail-page.tsx"],"names":[],"mappings":"AAmCA,wBAAgB,iBAAiB,CAAC,EAAE,EAAE,EAAE,EAAE;IAAE,EAAE,EAAE,MAAM,CAAA;CAAE,2CAgNvD"}

package/dist/components/product-detail/product-detail-page.js

@@ -0,0 +1,97 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useQueries } from "@tanstack/react-query";
+import { useVoyantProductsContext } from "@voyantjs/products-react";
+import { Button } from "@voyantjs/ui/components";
+import { useMemo } from "react";
+import { ProductsUiMessagesProvider } from "../../i18n/index.js";
+import { ProductOptionsSection } from "../product-options-section.js";
+import { useProductDetailHost, useProductDetailMessages, useProductLocale } from "./host.js";
+import { ProductActivitySection } from "./product-activity-section.js";
+import { DepartureDialog } from "./product-departure-dialog.js";
+import { DeparturePricingOverrideDialog } from "./product-departure-pricing-override-dialog.js";
+import { ProductDialog } from "./product-detail-dialog.js";
+import { ProductDetailHeader } from "./product-detail-header.js";
+import { ProductDetailItinerarySection } from "./product-detail-itinerary-section.js";
+import { ProductBrochureSection, ProductChannelsSection, ProductDeparturesSection, ProductDetailsSection, ProductMediaSection, ProductOrganizeSection, ProductSchedulesSection, } from "./product-detail-sections.js";
+import { ProductDetailSkeleton } from "./product-detail-skeleton.js";
+import { ProductExtrasSection } from "./product-extras-section.js";
+import { ProductMarketRulesSection } from "./product-market-rules-section.js";
+import { PricingPanel } from "./product-options-pricing.js";
+import { deriveOptionPricingLayout, getDeparturePriceOverridesQueryOptions, } from "./product-options-shared.js";
+import { ProductPaymentPolicySection } from "./product-payment-policy-section.js";
+import { ScheduleDialog } from "./product-schedule-dialog.js";
+import { useProductDetailData } from "./use-product-detail-data.js";
+import { useProductDetailDialogs } from "./use-product-detail-dialogs.js";
+export function ProductDetailPage({ id }) {
+    const messages = useProductDetailMessages();
+    const productMessages = messages.products.core;
+    const { navigate, renderOptionExtras } = useProductDetailHost();
+    const resolvedLocale = useProductLocale();
+    const client = useVoyantProductsContext();
+    const data = useProductDetailData(id);
+    const dialogs = useProductDetailDialogs();
+    const { product, isPending, slots, rules, channels, mappings, media, itineraryNameById } = data;
+    const { mutations, refetch, invalidateProduct } = data;
+    const overrideQueries = useQueries({
+        queries: slots.map((slot) => ({
+            ...getDeparturePriceOverridesQueryOptions(client, slot.id),
+            enabled: !!slot.id,
+        })),
+    });
+    const slotIdsWithOverrides = useMemo(() => {
+        const set = new Set();
+        slots.forEach((slot, index) => {
+            const result = overrideQueries[index];
+            const items = result?.data?.data ?? [];
+            if (items.some((o) => o.active))
+                set.add(slot.id);
+        });
+        return set;
+    }, [slots, overrideQueries]);
+    const brochure = media.find((item) => item.isBrochure && item.isBrochureCurrent) ??
+        media.find((item) => item.isBrochure) ??
+        null;
+    const galleryMedia = media.filter((item) => !item.isBrochure);
+    if (isPending) {
+        return _jsx(ProductDetailSkeleton, {});
+    }
+    if (!product) {
+        return (_jsxs("div", { className: "flex flex-col items-center justify-center gap-4 py-12", children: [_jsx("p", { className: "text-muted-foreground", children: productMessages.detailNotFound }), _jsx(Button, { variant: "outline", onClick: () => navigate.toProducts(), children: productMessages.backToProducts })] }));
+    }
+    return (_jsxs("div", { className: "flex flex-col gap-6 p-6", children: [_jsx(ProductDetailHeader, { product: product, isDuplicating: mutations.duplicateProduct.isPending, isDeleting: mutations.deleteProduct.isPending, onEdit: dialogs.edit.openNow, onAddBooking: () => navigate.toNewBooking(id), onDuplicate: () => {
+                    mutations.duplicateProduct.mutate(undefined, {
+                        onSuccess: (result) => {
+                            navigate.toProduct(result.data.id);
+                        },
+                    });
+                }, onDelete: () => {
+                    if (confirm(productMessages.deleteConfirm)) {
+                        mutations.deleteProduct.mutate(undefined, {
+                            onSuccess: () => navigate.toProducts(),
+                        });
+                    }
+                } }), _jsxs("div", { className: "grid grid-cols-1 gap-6 lg:grid-cols-[minmax(0,1fr)_320px]", children: [_jsxs("div", { className: "flex min-w-0 flex-col gap-6", children: [_jsx(ProductDetailsSection, { product: product, onEdit: dialogs.edit.openNow }), _jsx(ProductMediaSection, { productId: id, media: galleryMedia, isUploading: mutations.uploadMedia.isPending, onUpload: (file) => mutations.uploadMedia.mutate({ file }), onSetCover: (mediaId) => mutations.setCover.mutate(mediaId), onDelete: (mediaId) => {
+                                    if (confirm(productMessages.deleteMediaConfirm)) {
+                                        mutations.deleteMedia.mutate(mediaId);
+                                    }
+                                } }), _jsx(ProductDeparturesSection, { slots: slots, itineraryNameById: itineraryNameById, slotIdsWithOverrides: slotIdsWithOverrides, onCreate: dialogs.departure.openNew, onEdit: dialogs.departure.openEdit, onOverridePrice: dialogs.departureOverride.openEdit, onManageAvailability: (slot) => navigate.toAvailability(slot.id), onDelete: (slotId) => {
+                                    if (confirm(productMessages.deleteDepartureConfirm)) {
+                                        mutations.deleteSlot.mutate(slotId);
+                                    }
+                                } }), _jsx(ProductSchedulesSection, { rules: rules, onCreate: dialogs.schedule.openNew, onEdit: dialogs.schedule.openEdit, onDelete: (ruleId) => {
+                                    if (confirm(productMessages.deleteScheduleConfirm)) {
+                                        mutations.deleteRule.mutate(ruleId);
+                                    }
+                                } }), _jsx(ProductDetailItinerarySection, { productId: id }), _jsx(ProductsUiMessagesProvider, { locale: resolvedLocale, children: _jsx(ProductOptionsSection, { productId: id, renderOptionDetails: (option) => (_jsx(PricingPanel, { productId: id, optionId: option.id, optionName: option.name, productCurrency: product.sellCurrency, layout: deriveOptionPricingLayout(product.bookingMode), extras: renderOptionExtras?.(id, option.id) })) }) }), _jsx(ProductExtrasSection, { productId: id }), _jsx(ProductPaymentPolicySection, { product: product, onSuccess: invalidateProduct }), _jsx(ProductMarketRulesSection, { productId: id })] }), _jsxs("div", { className: "flex flex-col gap-6", children: [_jsx(ProductChannelsSection, { allChannels: channels, mappings: mappings, onAddChannel: (channelId) => mutations.addChannelMapping.mutate(channelId), onRemoveChannel: (mappingId) => mutations.removeChannelMapping.mutate(mappingId) }), _jsx(ProductOrganizeSection, { product: product, onEdit: dialogs.edit.openNow }), _jsx(ProductBrochureSection, { brochure: brochure, isGenerating: mutations.generateBrochure.isPending, onGenerate: () => mutations.generateBrochure.mutate() }), _jsx(ProductActivitySection, { productId: id })] })] }), _jsx(ProductDialog, { open: dialogs.edit.open, onOpenChange: dialogs.edit.setOpen, product: product, onSuccess: () => {
+                    dialogs.edit.close();
+                    invalidateProduct();
+                } }), _jsx(DepartureDialog, { open: dialogs.departure.open, onOpenChange: dialogs.departure.setOpen, productId: id, slot: dialogs.departure.editing, onSuccess: () => {
+                    dialogs.departure.close();
+                    refetch.slots();
+                } }), _jsx(ScheduleDialog, { open: dialogs.schedule.open, onOpenChange: dialogs.schedule.setOpen, productId: id, rule: dialogs.schedule.editing, onSuccess: () => {
+                    dialogs.schedule.close();
+                    refetch.rules();
+                } }), _jsx(DeparturePricingOverrideDialog, { open: dialogs.departureOverride.open, onOpenChange: dialogs.departureOverride.setOpen, departureId: dialogs.departureOverride.editing?.id ?? null, optionId: dialogs.departureOverride.editing?.optionId ?? null, onSuccess: () => {
+                    dialogs.departureOverride.close();
+                } })] }));
+}

package/dist/components/product-detail/product-detail-sections.d.ts

@@ -0,0 +1,63 @@
+import { type ReactNode } from "react";
+import type { DepartureSlot } from "./product-departure-dialog.js";
+import { type AvailabilityRule, type ChannelInfo, type ChannelProductMapping, type ProductMediaItem, type ProductRecord } from "./product-detail-shared.js";
+export declare function Section({ title, actions, children, contentClassName, }: {
+    title: string;
+    actions?: ReactNode;
+    children: ReactNode;
+    contentClassName?: string;
+}): import("react/jsx-runtime").JSX.Element;
+export declare function DetailRow({ label, value }: {
+    label: string;
+    value: ReactNode;
+}): import("react/jsx-runtime").JSX.Element;
+export declare function ActionMenu({ children }: {
+    children: ReactNode;
+}): import("react/jsx-runtime").JSX.Element;
+export declare function EmptyState({ message }: {
+    message: string;
+}): import("react/jsx-runtime").JSX.Element;
+export declare function ProductDetailsSection({ product, onEdit, }: {
+    product: ProductRecord;
+    onEdit: () => void;
+}): import("react/jsx-runtime").JSX.Element;
+export declare function ProductDeparturesSection({ slots, itineraryNameById, slotIdsWithOverrides, onCreate, onEdit, onOverridePrice, onManageAvailability, onDelete, }: {
+    slots: DepartureSlot[];
+    itineraryNameById: Map<string, string>;
+    slotIdsWithOverrides?: ReadonlySet<string>;
+    onCreate: () => void;
+    onEdit: (slot: DepartureSlot) => void;
+    onOverridePrice?: (slot: DepartureSlot) => void;
+    onManageAvailability?: (slot: DepartureSlot) => void;
+    onDelete: (slotId: string) => void;
+}): import("react/jsx-runtime").JSX.Element;
+export declare function ProductSchedulesSection({ rules, onCreate, onEdit, onDelete, }: {
+    rules: AvailabilityRule[];
+    onCreate: () => void;
+    onEdit: (rule: AvailabilityRule) => void;
+    onDelete: (ruleId: string) => void;
+}): import("react/jsx-runtime").JSX.Element;
+export declare function ProductChannelsSection({ allChannels, mappings, onAddChannel, onRemoveChannel, }: {
+    allChannels: ChannelInfo[];
+    mappings: ChannelProductMapping[];
+    onAddChannel: (channelId: string) => void;
+    onRemoveChannel: (mappingId: string) => void;
+}): import("react/jsx-runtime").JSX.Element;
+export declare function ProductOrganizeSection({ product, onEdit, }: {
+    product: ProductRecord;
+    onEdit: () => void;
+}): import("react/jsx-runtime").JSX.Element;
+export declare function ProductBrochureSection({ brochure, isGenerating, onGenerate, }: {
+    brochure: ProductMediaItem | null;
+    isGenerating: boolean;
+    onGenerate: () => void;
+}): import("react/jsx-runtime").JSX.Element;
+export declare function ProductMediaSection({ productId, media, isUploading, onUpload, onSetCover, onDelete, }: {
+    productId: string;
+    media: ProductMediaItem[];
+    isUploading: boolean;
+    onUpload: (file: File) => void;
+    onSetCover: (mediaId: string) => void;
+    onDelete: (mediaId: string) => void;
+}): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=product-detail-sections.d.ts.map

package/dist/components/product-detail/product-detail-sections.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"product-detail-sections.d.ts","sourceRoot":"","sources":["../../../src/components/product-detail/product-detail-sections.tsx"],"names":[],"mappings":"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"}