@deenruv/admin-dashboard 1.0.0

package/dist/pages/orders/_components/ShippingMethod.js

@@ -0,0 +1,112 @@
+'use client';
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { Button, Label, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, Dialog, DialogContent, DialogDescription, DialogHeader, DialogTitle, DialogTrigger, apiClient, cn, useOrder, OrderDetailSelector, Badge, CustomCard, useTranslation, priceFormatter, } from '@deenruv/react-ui-devkit';
+import { eligibleShippingMethodsSelector } from "../../../graphql/draft_order";
+import { Edit, Truck, Package, AlertCircle, Check, Loader2 } from 'lucide-react';
+import { useEffect, useMemo, useState } from 'react';
+import { toast } from 'sonner';
+export const ShippingMethod = () => {
+    const { mode, order, setOrder, modifiedOrder, setModifiedOrder } = useOrder();
+    const currentOrder = useMemo(() => (mode === 'update' ? (modifiedOrder ? modifiedOrder : order) : order), [mode, order, modifiedOrder]);
+    const { t } = useTranslation('orders');
+    const [open, setOpen] = useState(false);
+    const [localSelectedShippingMethod, setLocalSelectedShippingMethod] = useState(undefined);
+    const [isSubmitting, setIsSubmitting] = useState(false);
+    const [isLoading, setIsLoading] = useState(false);
+    const [shippingMethods, setShippingMethods] = useState([]);
+    const selectedShipping = useMemo(() => shippingMethods.find((method) => method.id === currentOrder?.shippingLines?.[0]?.shippingMethod.id), [shippingMethods, currentOrder]);
+    useEffect(() => {
+        const fetch = async () => {
+            if (order && order.id) {
+                setIsLoading(true);
+                try {
+                    const { eligibleShippingMethodsForDraftOrder } = await apiClient('query')({
+                        eligibleShippingMethodsForDraftOrder: [{ orderId: order.id }, eligibleShippingMethodsSelector],
+                    });
+                    if (!eligibleShippingMethodsForDraftOrder) {
+                        toast.error(t('toasts.orderLoadingDraftShippingError', { value: order.id }));
+                    }
+                    setShippingMethods(eligibleShippingMethodsForDraftOrder);
+                    // Set the currently selected method when opening the dialog
+                    if (currentOrder?.shippingLines?.[0]?.shippingMethod.id) {
+                        setLocalSelectedShippingMethod(currentOrder.shippingLines[0].shippingMethod.id);
+                    }
+                }
+                catch (error) {
+                    toast.error(t('toasts.orderLoadingDraftShippingError', { value: order.id }));
+                }
+                finally {
+                    setIsLoading(false);
+                }
+            }
+        };
+        fetch();
+    }, [t, currentOrder]);
+    const selectShippingMethod = async (orderId, shippingMethodId) => {
+        setIsSubmitting(true);
+        try {
+            if (mode === 'update' && selectedShipping && modifiedOrder) {
+                const currentShipping = shippingMethods.find((m) => m.id === shippingMethodId);
+                if (!currentShipping) {
+                    toast.error(t('selectShipmentMethod.methodNotFound', 'Selected shipping method not found'));
+                    return;
+                }
+                setModifiedOrder({
+                    ...modifiedOrder,
+                    shippingLines: [
+                        {
+                            ...modifiedOrder.shippingLines[0],
+                            price: currentShipping.price,
+                            priceWithTax: currentShipping.priceWithTax,
+                            shippingMethod: {
+                                ...modifiedOrder.shippingLines[0].shippingMethod,
+                                id: currentShipping.id,
+                                name: currentShipping.name,
+                                code: currentShipping.code,
+                            },
+                        },
+                    ],
+                });
+                toast.success(t('selectShipmentMethod.shippingAdded', 'Shipping method updated successfully'));
+                setOpen(false);
+                return;
+            }
+            const { setDraftOrderShippingMethod } = await apiClient('mutation')({
+                setDraftOrderShippingMethod: [
+                    { orderId, shippingMethodId },
+                    {
+                        __typename: true,
+                        '...on Order': OrderDetailSelector,
+                        '...on IneligibleShippingMethodError': { message: true, errorCode: true },
+                        '...on NoActiveOrderError': { message: true, errorCode: true },
+                        '...on OrderModificationError': { message: true, errorCode: true },
+                    },
+                ],
+            });
+            if (setDraftOrderShippingMethod.__typename === 'Order') {
+                setOrder(setDraftOrderShippingMethod);
+                toast.success(t('selectShipmentMethod.shippingAdded', 'Shipping method added successfully'));
+                setOpen(false);
+            }
+            else {
+                toast.error(`${setDraftOrderShippingMethod.errorCode}: ${setDraftOrderShippingMethod.message}`);
+            }
+        }
+        catch (error) {
+            toast.error(t('selectShipmentMethod.error', 'Failed to set shipping method'));
+        }
+        finally {
+            setIsSubmitting(false);
+        }
+    };
+    return (_jsx(CustomCard, { notCollapsible: true, color: "orange", description: t('selectShipmentMethod.cardDescription', 'Choose how this order will be delivered to the customer'), title: t('selectShipmentMethod.cardTitle', 'Shipping Method'), icon: _jsx(Truck, {}), upperRight: mode !== 'view' && (_jsxs(Dialog, { open: open, onOpenChange: setOpen, defaultOpen: false, children: [!order?.lines.length ? (_jsx(TooltipProvider, { children: _jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsx(Button, { variant: "ghost", size: "icon", className: "size-8 cursor-not-allowed opacity-50", children: _jsx(Edit, { size: 16, className: "text-muted-foreground" }) }) }), _jsx(TooltipContent, { align: "end", className: "border border-red-200 bg-red-50", children: _jsx("p", { className: "text-xs text-red-500", children: t('selectShipmentMethod.noSelectedTip', 'Add products to the order first') }) })] }) })) : (_jsx(DialogTrigger, { asChild: true, children: _jsx(Button, { variant: "ghost", size: "icon", className: "size-8", children: _jsx(Edit, { size: 16, className: "text-orange-500 dark:text-orange-400" }) }) })), _jsxs(DialogContent, { className: "max-w-[70vw] p-6", children: [_jsxs("div", { className: "flex flex-col gap-6", children: [_jsxs(DialogHeader, { children: [_jsxs(DialogTitle, { className: "flex items-center gap-2 text-xl", children: [_jsx(Truck, { className: "size-5 text-orange-500 dark:text-orange-400" }), t('selectShipmentMethod.setMethodTitle', 'Select Shipping Method')] }), _jsx(DialogDescription, { className: "text-muted-foreground mt-2", children: t('selectShipmentMethod.setMethodDescription', 'Choose how this order will be delivered') })] }), isLoading ? (_jsxs("div", { className: "flex flex-col items-center justify-center py-12", children: [_jsx("div", { className: "size-10 animate-spin rounded-full border-4 border-orange-200 border-t-orange-500" }), _jsx("p", { className: "text-muted-foreground mt-4 text-sm", children: t('selectShipmentMethod.loading', 'Loading shipping methods...') })] })) : (_jsx(_Fragment, { children: shippingMethods.length === 0 ? (_jsxs("div", { className: "flex flex-col items-center justify-center gap-3 py-12 text-center", children: [_jsx("div", { className: "rounded-full bg-orange-100 p-3 dark:bg-orange-900/30", children: _jsx(AlertCircle, { className: "size-6 text-orange-500 dark:text-orange-400" }) }), _jsxs("div", { children: [_jsx("p", { className: "font-medium", children: t('selectShipmentMethod.noMethods', 'No shipping methods available') }), _jsx("p", { className: "text-muted-foreground mt-1 text-sm", children: t('selectShipmentMethod.noMethodsHint', 'Make sure the order has products and a shipping address') })] })] })) : (_jsx("div", { className: "grid grid-cols-1 gap-3 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4", children: shippingMethods.map((shippingMethod) => (_jsx("div", { className: "w-full", children: _jsxs("button", { onClick: () => setLocalSelectedShippingMethod(shippingMethod.id), className: cn('relative flex w-full flex-col gap-2 rounded-lg border p-4 transition-all', 'hover:border-orange-500/70 hover:shadow-sm', localSelectedShippingMethod === shippingMethod.id
+                                                    ? 'border-orange-500 bg-orange-50 shadow-sm dark:border-orange-400 dark:bg-orange-900/10'
+                                                    : 'border-border'), children: [localSelectedShippingMethod === shippingMethod.id && (_jsx("div", { className: "absolute right-2 top-2", children: _jsx(Check, { className: "size-4 text-green-500" }) })), _jsxs("div", { className: "mb-1 flex items-center gap-2", children: [_jsx(Package, { className: "size-4 text-orange-500 dark:text-orange-400" }), _jsx("h3", { className: "text-base font-medium", children: shippingMethod.name })] }), _jsx(Badge, { variant: "outline", className: "w-fit text-xs", children: shippingMethod.code }), _jsxs("div", { className: "border-border mt-2 w-full border-t pt-2", children: [_jsxs("div", { className: "flex items-center justify-between gap-2", children: [_jsx("span", { className: "text-muted-foreground text-xs", children: "Base price: " }), _jsx("span", { className: "text-sm font-medium", children: priceFormatter(shippingMethod.price, order?.currencyCode) })] }), _jsxs("div", { className: "mt-1 flex items-center justify-between gap-2", children: [_jsx("span", { className: "text-muted-foreground text-xs", children: "With tax: " }), _jsx("span", { className: "text-sm font-medium text-orange-600 dark:text-orange-400", children: priceFormatter(shippingMethod.priceWithTax, order?.currencyCode) })] })] })] }) }, shippingMethod.id))) })) }))] }), _jsxs("div", { className: "mt-4 flex justify-end gap-2", children: [_jsx(Button, { variant: "outline", onClick: () => setOpen(false), disabled: isSubmitting, children: t('common.cancel', 'Cancel') }), _jsx(Button, { disabled: !localSelectedShippingMethod || !order?.id || isSubmitting || isLoading, className: "gap-2", onClick: async () => {
+                                        const method = shippingMethods.find((method) => method.id === localSelectedShippingMethod);
+                                        if (method && order?.id)
+                                            await selectShippingMethod(order.id, method.id);
+                                    }, children: isSubmitting ? (_jsxs(_Fragment, { children: [_jsx(Loader2, { className: "size-4 animate-spin" }), t('common.processing', 'Processing...')] })) : (_jsxs(_Fragment, { children: [_jsx(Check, { className: "size-4" }), t('selectShipmentMethod.save', 'Save Shipping Method')] })) })] })] })] })), children: _jsx("div", { className: "border-border bg-muted/50 rounded-lg border p-3", children: _jsx("div", { className: "flex items-start gap-3", children: !order?.lines.length ? (_jsxs(_Fragment, { children: [_jsx("div", { className: "mt-0.5 flex size-8 items-center justify-center rounded-full bg-amber-100 dark:bg-amber-900/30", children: _jsx(AlertCircle, { className: "size-4 text-amber-500" }) }), _jsx("div", { className: "flex-1", children: _jsx("p", { className: "text-muted-foreground text-sm italic", children: t('selectShipmentMethod.noSelectedTip', 'Add products to the order first') }) })] })) : !selectedShipping ? (_jsx(_Fragment, { children: _jsxs("div", { className: "flex-1", children: [_jsx("p", { className: "text-muted-foreground text-sm italic", children: t('selectShipmentMethod.noSelected', 'No shipping method selected') }), mode !== 'view' && (_jsxs(Button, { variant: "outline", size: "sm", className: "mt-2 gap-2", onClick: () => {
+                                    if (order?.lines.length)
+                                        setOpen(true);
+                                }, disabled: !order?.lines.length, children: [_jsx(Truck, { className: "size-3.5" }), t('selectShipmentMethod.addMethod', 'Add Shipping Method')] }))] }) })) : (_jsxs("div", { className: "relative flex w-full flex-col gap-2", children: [_jsxs("div", { className: "mb-1 flex items-center gap-2", children: [_jsx(Package, { className: "size-4 text-orange-500 dark:text-orange-400" }), _jsx(Label, { className: "text-sm font-medium", children: selectedShipping.name })] }), _jsx(Badge, { variant: "outline", className: "w-fit text-xs", children: selectedShipping.code }), _jsxs("div", { className: "border-border mt-2 w-full border-t pt-2", children: [_jsxs("div", { className: "flex items-center justify-between gap-2", children: [_jsx("span", { className: "text-muted-foreground text-xs", children: "Base price: " }), _jsx("span", { className: "text-sm font-medium", children: priceFormatter(selectedShipping.price, order?.currencyCode) })] }), _jsxs("div", { className: "mt-1 flex items-center justify-between gap-2", children: [_jsx("span", { className: "text-muted-foreground text-xs", children: "With tax: " }), _jsx("span", { className: "text-sm font-medium text-orange-600 dark:text-orange-400", children: priceFormatter(selectedShipping.priceWithTax, order?.currencyCode) })] })] })] }, selectedShipping.id)) }) }) }));
+};

package/dist/pages/orders/_components/SpecialLineItem.js

@@ -0,0 +1,7 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Button, priceFormatter } from '@deenruv/react-ui-devkit';
+import { Minus, Package, Plus } from 'lucide-react';
+export const SpecialLineItem = ({ variant, adjustLineItem }) => {
+    const imageUrl = variant?.featuredAsset?.preview || variant?.product?.featuredAsset?.preview;
+    return (_jsx("div", { className: "flex h-full w-2/5 flex-col gap-4", children: _jsxs("div", { className: "bg-card text-card-foreground flex size-full flex-col space-y-3 rounded-lg border p-3 shadow-sm", children: [imageUrl ? (_jsx("img", { alt: `${variant?.product.name} image`, className: "aspect-square h-64 w-full rounded-md border bg-white object-cover shadow-sm", height: "56", width: "56", src: imageUrl || '/placeholder.svg' })) : (_jsx("div", { className: "bg-muted/30 flex size-14 items-center justify-center rounded-md border", children: _jsx(Package, { className: "text-muted-foreground size-6" }) })), _jsxs("div", { className: "flex flex-col gap-2", children: [_jsxs("div", { className: "flex min-w-0 flex-1 flex-col", children: [_jsx("span", { className: "line-clamp-1 text-sm font-medium md:text-base", children: variant?.product.name }), variant?.name && variant.name !== variant?.product.name && (_jsx("span", { className: "text-muted-foreground line-clamp-1 text-xs", children: variant.name }))] }), _jsxs("div", { className: "flex min-w-0 flex-1 flex-col", children: [_jsx("span", { className: "line-clamp-1 select-none text-sm font-medium md:text-base", children: "Price (TAX)" }), _jsxs("span", { className: "text-muted-foreground line-clamp-1 text-xs", children: [priceFormatter(variant.price), " (", priceFormatter(variant.priceWithTax), ")"] })] }), variant.sku ? (_jsxs("div", { className: "flex min-w-0 flex-1 flex-col", children: [_jsx("span", { className: "line-clamp-1 select-none text-sm font-medium md:text-base", children: "SKU" }), variant.sku && _jsx("span", { className: "text-muted-foreground line-clamp-1 text-xs", children: variant.sku })] })) : null] }), variant?.quantity ? (_jsx("div", { className: "ml-auto", children: adjustLineItem ? (_jsx("div", { className: "flex items-center", children: _jsxs("div", { className: "bg-background inline-flex items-center rounded-md border shadow-sm", children: [_jsx(Button, { variant: "ghost", size: "sm", type: "button", onClick: () => adjustLineItem(Math.max(1, (variant.quantity || 1) - 1)), className: "hover:bg-muted h-8 rounded-r-none border-r px-2", "aria-label": "Decrease quantity", children: _jsx(Minus, { className: "size-3.5" }) }), _jsx("span", { className: "px-3 py-1 text-sm font-medium tabular-nums", children: variant?.quantity }), _jsx(Button, { variant: "ghost", size: "sm", type: "button", onClick: () => adjustLineItem((variant.quantity || 0) + 1), className: "hover:bg-muted h-8 rounded-l-none border-l px-2", "aria-label": "Increase quantity", children: _jsx(Plus, { className: "size-3.5" }) })] }) })) : null })) : null] }) }));
+};

package/dist/pages/orders/_components/SurchargeCard.js

@@ -0,0 +1,99 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { SurchargeTable } from './';
+import { useTranslation, Button, Checkbox, Input, Label, useGFFLP, useOrder, CustomCard, } from '@deenruv/react-ui-devkit';
+import { useCallback, useState } from 'react';
+import { PlusCircle, DollarSign, Tag, FileText, Percent, Receipt, Loader2 } from 'lucide-react';
+export const SurchargeCard = () => {
+    const { t } = useTranslation('orders');
+    const { setModifyOrderInput, modifyOrderInput, setModifiedOrder, modifiedOrder } = useOrder();
+    const [isSubmitting, setIsSubmitting] = useState(false);
+    const { state, setField } = useGFFLP('SurchargeInput', 'description', 'price', 'priceIncludesTax', 'sku', 'taxDescription', 'taxRate')({
+        description: {
+            initialValue: '',
+            validate: (v) => {
+                if (!v || v === '')
+                    return [t('surcharge.validation.descriptionRequired', 'Description is required')];
+            },
+        },
+        sku: {
+            initialValue: '',
+            validate: (v) => {
+                if (!v || v === '')
+                    return [t('surcharge.validation.skuRequired', 'SKU is required')];
+            },
+        },
+        price: {
+            initialValue: 0,
+            validate: (v) => {
+                if (v === undefined || v === null)
+                    return [t('surcharge.validation.priceRequired', 'Price is required')];
+                if (v <= 0)
+                    return [t('surcharge.validation.pricePositive', 'Price must be greater than zero')];
+            },
+        },
+        priceIncludesTax: {
+            initialValue: false,
+        },
+        taxDescription: {
+            initialValue: '',
+        },
+        taxRate: {
+            initialValue: 0,
+        },
+    });
+    const handleAddSurcharge = useCallback(async () => {
+        // Validate all fields
+        if (!state.description?.value || !state.sku?.value || !state.price?.value || state.price?.value <= 0) {
+            return;
+        }
+        setIsSubmitting(true);
+        try {
+            const orderWithSurcharge = Object.assign({}, modifyOrderInput);
+            const { description, price, priceIncludesTax, sku, taxDescription, taxRate } = state;
+            const surchargesArray = modifyOrderInput?.surcharges || [];
+            surchargesArray.push({
+                description: description?.value || '',
+                price: price?.value,
+                priceIncludesTax: priceIncludesTax?.value || false,
+                sku: sku?.value,
+                taxDescription: taxDescription?.value,
+                taxRate: taxRate?.value,
+            });
+            orderWithSurcharge.surcharges = surchargesArray;
+            if (modifiedOrder)
+                setModifiedOrder({
+                    ...modifiedOrder,
+                    surcharges: [
+                        ...modifiedOrder.surcharges,
+                        {
+                            description: description?.value || '',
+                            price: taxRate?.value && priceIncludesTax?.value ? price?.value / (1 + taxRate.value / 100) : price?.value,
+                            sku: sku?.value,
+                            createdAt: new Date().toDateString(),
+                            priceWithTax: taxRate?.value && !priceIncludesTax?.value
+                                ? +price?.value * (+taxRate?.value / 100) + +price?.value
+                                : +price?.value,
+                            taxRate: taxRate?.value || 0,
+                        },
+                    ],
+                });
+            setModifyOrderInput(orderWithSurcharge);
+            // Reset form fields
+            setField('description', '');
+            setField('sku', '');
+            setField('price', 0);
+            setField('priceIncludesTax', false);
+            setField('taxDescription', '');
+            setField('taxRate', 0);
+        }
+        finally {
+            setIsSubmitting(false);
+        }
+    }, [state, modifiedOrder, modifyOrderInput, setModifiedOrder, setModifyOrderInput, setField]);
+    return (_jsx(CustomCard, { color: "yellow", description: t('surcharge.description', 'Add additional fees or charges to this order'), title: t('surcharge.title', 'Order Surcharges'), icon: _jsx(Receipt, { className: "size-5 text-yellow-500 dark:text-yellow-400" }), bottomRight: _jsx(Button, { onClick: handleAddSurcharge, disabled: isSubmitting ||
+                !state.description?.value ||
+                !state.sku?.value ||
+                !state.price?.value ||
+                state.price?.value <= 0, className: "ml-auto gap-2", children: isSubmitting ? (_jsxs(_Fragment, { children: [_jsx(Loader2, { className: "size-4 animate-spin" }), t('surcharge.processing', 'Processing...')] })) : (_jsxs(_Fragment, { children: [_jsx(PlusCircle, { className: "size-4" }), t('surcharge.addButton', 'Add Surcharge')] })) }), children: _jsxs("div", { className: "space-y-6", children: [_jsx(SurchargeTable, {}), _jsx("div", { children: _jsxs("div", { className: "mb-4 grid grid-cols-1 gap-4 md:grid-cols-3 lg:grid-cols-5", children: [_jsxs("div", { className: "space-y-2", children: [_jsxs(Label, { htmlFor: "surcharge-description", className: "text-sm font-medium", children: [t('surcharge.labels.description', 'Description'), " ", _jsx("span", { className: "text-red-500", children: "*" })] }), _jsxs("div", { className: "relative", children: [_jsx(Input, { id: "surcharge-description", placeholder: t('surcharge.placeholders.description', 'Enter surcharge description'), value: state.description?.value || '', onChange: (e) => setField('description', e.target.value), className: "pl-9", errors: state.description?.errors }), _jsx("div", { className: "text-muted-foreground absolute left-3 top-1/2 -translate-y-1/2", children: _jsx(FileText, { className: "size-4" }) })] })] }), _jsxs("div", { className: "space-y-2", children: [_jsxs(Label, { htmlFor: "surcharge-sku", className: "text-sm font-medium", children: [t('surcharge.labels.sku', 'SKU'), " ", _jsx("span", { className: "text-red-500", children: "*" })] }), _jsxs("div", { className: "relative", children: [_jsx(Input, { id: "surcharge-sku", placeholder: t('surcharge.placeholders.sku', 'Enter SKU code'), value: state.sku?.value || '', onChange: (e) => setField('sku', e.target.value), className: "pl-9", errors: state.sku?.errors }), _jsx("div", { className: "text-muted-foreground absolute left-3 top-1/2 -translate-y-1/2", children: _jsx(Tag, { className: "size-4" }) })] })] }), _jsxs("div", { className: "space-y-2", children: [_jsxs(Label, { htmlFor: "surcharge-price", className: "text-sm font-medium", children: [t('surcharge.labels.price', 'Price'), " ", _jsx("span", { className: "text-red-500", children: "*" })] }), _jsxs("div", { className: "relative", children: [_jsx(Input, { id: "surcharge-price", type: "currency", endAdornment: modifiedOrder?.currencyCode, step: "0.01", min: "0", placeholder: t('surcharge.placeholders.price', 'Enter price'), value: state.price?.value || '', onChange: (e) => setField('price', +e.target.value), className: "pl-9", errors: state.price?.errors }), _jsx("div", { className: "text-muted-foreground absolute left-3 top-1/2 -translate-y-1/2", children: _jsx(DollarSign, { className: "size-4" }) })] })] }), _jsxs("div", { className: "space-y-2", children: [_jsx(Label, { htmlFor: "surcharge-tax-rate", className: "text-sm font-medium", children: t('surcharge.labels.taxRate', 'Tax Rate (%)') }), _jsxs("div", { className: "relative", children: [_jsx(Input, { id: "surcharge-tax-rate", type: "number", step: "0.01", min: "0", placeholder: t('surcharge.placeholders.taxRate', 'Enter tax rate'), value: state.taxRate?.value || 0, onChange: (e) => setField('taxRate', +e.target.value), className: "pl-9" }), _jsx("div", { className: "text-muted-foreground absolute left-3 top-1/2 -translate-y-1/2", children: _jsx(Percent, { className: "size-4" }) })] })] }), _jsxs("div", { className: "space-y-2", children: [_jsx(Label, { htmlFor: "surcharge-tax-description", className: "text-sm font-medium", children: t('surcharge.labels.taxDescription', 'Tax Description') }), _jsxs("div", { className: "relative", children: [_jsx(Input, { id: "surcharge-tax-description", placeholder: t('surcharge.placeholders.taxDescription', 'Enter tax description'), value: state.taxDescription?.value || '', onChange: (e) => setField('taxDescription', e.target.value), className: "pl-9" }), _jsx("div", { className: "text-muted-foreground absolute left-3 top-1/2 -translate-y-1/2", children: _jsx(FileText, { className: "size-4" }) })] })] }), _jsxs("div", { className: "space-y-2", children: [_jsx(Label, { htmlFor: "surcharge-tax-included", className: "text-sm font-medium", children: t('surcharge.labels.includesTax', { value: state.taxRate?.value }) }), _jsxs("div", { className: "flex items-center gap-2 pt-2", children: [_jsx(Checkbox, { id: "surcharge-tax-included", checked: state.priceIncludesTax?.value || false, onCheckedChange: (e) => setField('priceIncludesTax', Boolean(e)) }), _jsx(Label, { htmlFor: "surcharge-tax-included", className: "cursor-pointer text-sm", children: t('surcharge.placeholders.taxIncluded', 'Tax is included in the price') })] })] })] }) })] }) }));
+};

package/dist/pages/orders/_components/SurchargeTable.js

@@ -0,0 +1,8 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { BooleanCell, Separator, Table, TableBody, TableCell, TableHead, TableHeader, TableRow, priceFormatter, useOrder, useTranslation, } from '@deenruv/react-ui-devkit';
+export const SurchargeTable = () => {
+    const { t } = useTranslation('orders');
+    const { modifyOrderInput, order } = useOrder();
+    const surcharges = modifyOrderInput?.surcharges;
+    return surcharges?.length ? (_jsxs(_Fragment, { children: [_jsxs(Table, { children: [_jsx(TableHeader, { children: _jsxs(TableRow, { noHover: true, children: [_jsx(TableHead, { children: t('surcharge.labels.description') }), _jsx(TableHead, { children: t('surcharge.labels.sku') }), _jsx(TableHead, { children: t('surcharge.labels.price') }), _jsx(TableHead, { children: t('surcharge.labels.includesTax') }), _jsx(TableHead, { children: t('surcharge.labels.taxRate') }), _jsx(TableHead, { children: t('surcharge.labels.taxDescription') })] }) }), _jsx(TableBody, { children: surcharges?.map(({ description, price, priceIncludesTax, sku, taxDescription, taxRate }, index) => (_jsxs(TableRow, { noHover: true, children: [_jsx(TableCell, { className: "capitalize", children: description }), _jsx(TableCell, { children: sku }), _jsx(TableCell, { children: priceFormatter(price, order?.currencyCode) }), _jsx(TableCell, { children: _jsx(BooleanCell, { value: priceIncludesTax }) }), _jsx(TableCell, { children: taxRate }), _jsx(TableCell, { children: taxDescription })] }, index))) })] }), _jsx(Separator, { className: "my-4" })] })) : null;
+};

package/dist/pages/orders/_components/TaxSummary.js

@@ -0,0 +1,11 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow, useOrder, ScrollArea, CustomCard, useTranslation, priceFormatter, } from '@deenruv/react-ui-devkit';
+import { ReceiptText, Percent, Calculator, AlertCircle } from 'lucide-react';
+export const TaxSummary = () => {
+    const { order } = useOrder();
+    const { t } = useTranslation('orders');
+    if (!order)
+        return null;
+    const totalTax = order.taxSummary.reduce((sum, { taxTotal }) => sum + taxTotal, 0);
+    return (_jsx(CustomCard, { color: "indigo", description: t('taxSummary.subTitle', 'Breakdown of taxes applied to this order'), title: t('taxSummary.title'), icon: _jsx(ReceiptText, {}), collapsed: true, children: _jsx(ScrollArea, { className: "max-h-[350px] px-6 pb-6", children: _jsxs(Table, { children: [_jsx(TableHeader, { children: _jsxs(TableRow, { noHover: true, className: "border-border border-b", children: [_jsx(TableHead, { className: "py-3", children: t('taxSummary.description') }), _jsx(TableHead, { className: "py-3", children: t('taxSummary.taxRate') }), _jsx(TableHead, { className: "py-3", children: t('taxSummary.taxBase') }), _jsx(TableHead, { className: "py-3", children: t('taxSummary.taxTotal') })] }) }), _jsx(TableBody, { children: order.taxSummary.length ? (_jsxs(_Fragment, { children: [order.taxSummary.map(({ description, taxRate, taxBase, taxTotal }) => (_jsxs(TableRow, { noHover: true, className: "group", children: [_jsx(TableCell, { className: "py-3 font-medium", children: _jsxs("div", { className: "flex items-center gap-2", children: [_jsx(Calculator, { className: "size-4 text-indigo-500 dark:text-indigo-400" }), _jsx("span", { className: "capitalize", children: description })] }) }), _jsx(TableCell, { className: "py-3", children: _jsxs("div", { className: "flex items-center gap-1", children: [_jsx(Percent, { className: "text-muted-foreground size-3.5" }), _jsxs("span", { className: "font-medium", children: [taxRate, "%"] })] }) }), _jsx(TableCell, { className: "py-3 font-mono text-sm", children: priceFormatter(taxBase, order.currencyCode) }), _jsx(TableCell, { className: "py-3 font-mono text-sm font-medium", children: priceFormatter(taxTotal, order.currencyCode) })] }, description))), _jsxs(TableRow, { noHover: true, className: "border-border bg-muted/30 border-t", children: [_jsx(TableCell, { colSpan: 3, className: "py-3 text-right font-medium", children: t('taxSummary.taxTotal', 'Total Tax') }), _jsx(TableCell, { className: "py-3 font-mono text-sm font-bold", children: priceFormatter(totalTax, order.currencyCode) })] })] })) : (_jsx(TableRow, { noHover: true, children: _jsx(TableCell, { colSpan: 4, className: "text-muted-foreground py-6 text-center", children: _jsxs("div", { className: "flex flex-col items-center justify-center gap-2", children: [_jsx("div", { className: "rounded-full bg-indigo-100 p-3 dark:bg-indigo-900/30", children: _jsx(AlertCircle, { className: "size-6 text-indigo-500 dark:text-indigo-400" }) }), _jsx("p", { children: t('taxSummary.noTaxSummary', 'No tax information available') }), _jsx("p", { className: "text-muted-foreground text-xs", children: t('taxSummary.noTaxSummaryHint', 'Tax information will appear here when taxes are applied to the order') })] }) }) })) })] }) }) }));
+};

package/dist/pages/orders/_components/ToRealizationForm.js

@@ -0,0 +1,64 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Button, Calendar, Popover, PopoverContent, PopoverTrigger, Label, Select, SelectTrigger, SelectValue, SelectContent, SelectGroup, SelectItem, Textarea, cn, useOrder, AssetsModalInput, ImageWithPreview, useTranslation, } from '@deenruv/react-ui-devkit';
+import { format } from 'date-fns';
+import { CalendarIcon } from 'lucide-react';
+import { useState } from 'react';
+import { toast } from 'sonner';
+const colors = ['BIAŁA', 'ŻÓŁTA', 'POMARAŃCZOWA', 'RÓŻOWA', 'ZIELONA', 'CZERWONA'];
+export const ToRealizationForm = ({ onRealizationFinished }) => {
+    const { t } = useTranslation('orders');
+    const { order } = useOrder();
+    const [plannedDate, setPlannedDate] = useState(new Date());
+    const [deadlineDate, setDeadlineDate] = useState(new Date(new Date().getTime() + 7 * 24 * 60 * 60 * 1000));
+    const [color, setColor] = useState(colors[0]);
+    const [note, setNote] = useState('');
+    const [selectedAsset, setSelectedAsset] = useState(order?.lines.map((line) => ({
+        id: line.productVariant.featuredAsset?.id || '',
+        orderLineID: line.id,
+        preview: line.productVariant.featuredAsset?.preview || '',
+    })) || []);
+    const addRealization = async () => {
+        if (!order || !deadlineDate || !plannedDate)
+            return;
+        // const { registerRealization } = await apiClient('mutation')({
+        //   registerRealization: [
+        //     {
+        //       input: {
+        //         orderID: order.id,
+        //         color,
+        //         finalPlannedAt: format(deadlineDate, 'yyyy-MM-dd'),
+        //         plannedAt: format(plannedDate, 'yyyy-MM-dd'),
+        //         assets: selectedAsset,
+        //         note,
+        //       },
+        //     },
+        //     { url: true },
+        //   ],
+        // });
+        // if (registerRealization?.url) {
+        //   window.open(registerRealization.url, '_blank');
+        //   onRealizationFinished();
+        // }
+    };
+    return (_jsxs("div", { className: "flex max-h-[60vh] w-auto  min-w-[60vw] max-w-[95vw] flex-col gap-2 overflow-y-auto pr-1", children: [_jsxs("div", { className: "flex gap-4", children: [_jsxs("div", { className: "flex w-[280px] flex-col gap-4", children: [_jsxs("div", { children: [_jsx(Label, { children: t('changeStatus.planned') }), _jsxs(Popover, { children: [_jsx(PopoverTrigger, { asChild: true, children: _jsxs(Button, { variant: 'outline', className: cn('w-[280px] justify-start text-left font-normal', !plannedDate && 'text-muted-foreground'), children: [_jsx(CalendarIcon, { className: "mr-2 size-4" }), plannedDate ? format(plannedDate, 'PPP') : _jsx("span", { children: t('changeStatus.datePlaceholder') })] }) }), _jsx(PopoverContent, { className: "w-auto p-0", children: _jsx(Calendar, { mode: "single", selected: plannedDate, onSelect: setPlannedDate }) })] })] }), _jsxs("div", { children: [_jsx(Label, { children: t('changeStatus.deadline') }), _jsxs(Popover, { children: [_jsx(PopoverTrigger, { asChild: true, children: _jsxs(Button, { variant: 'outline', className: cn('w-[280px] justify-start text-left font-normal', !plannedDate && 'text-muted-foreground'), children: [_jsx(CalendarIcon, { className: "mr-2 size-4" }), deadlineDate ? format(deadlineDate, 'PPP') : _jsx("span", { children: t('changeStatus.datePlaceholder') })] }) }), _jsx(PopoverContent, { className: "w-auto p-0", children: _jsx(Calendar, { mode: "single", selected: deadlineDate, onSelect: setDeadlineDate }) })] })] }), _jsxs("div", { children: [_jsx(Label, { children: t('changeStatus.color') }), _jsxs(Select, { name: "color", value: color, onValueChange: (e) => setColor(e), children: [_jsx(SelectTrigger, { className: " w-[280px] ", children: _jsx(SelectValue, {}) }), _jsx(SelectContent, { children: _jsx(SelectGroup, { children: colors.map((c) => (_jsx(SelectItem, { value: c, children: c }, c))) }) })] })] }), _jsxs("div", { children: [_jsx(Label, { children: t('changeStatus.info') }), _jsx(Textarea, { className: "h-[60px] w-[280px]  resize-none", maxLength: 64, value: note, onChange: (e) => setNote(e.currentTarget.value) }), _jsx(Label, { className: "text-muted-foreground text-xs", children: t('changeStatus.charLeft', { value: 64 - note.length }) })] })] }), _jsxs("div", { className: "flex flex-1 flex-col gap-2", children: [_jsx(Label, { children: t('changeStatus.selectImages') }), _jsx("div", { className: "flex max-h-[calc(60vh-70px)] flex-1 flex-col gap-2 overflow-y-auto pr-2", children: order?.lines.map((line) => (_jsx(Line, { line: line, asset: selectedAsset.find((a) => a.orderLineID === line.id), onAssetChange: (image) => setSelectedAsset((prev) => prev.map((p) => p.orderLineID === line.id
+                                        ? { orderLineID: p.orderLineID, id: image?.id || '', preview: image?.preview || '' }
+                                        : p)) }, line.id))) })] })] }), _jsx(Button, { className: "ml-auto w-min", onClick: async () => {
+                    if (!plannedDate) {
+                        toast.error(t('changeStatus.plannedError'));
+                        return;
+                    }
+                    if (!deadlineDate) {
+                        toast.error(t('changeStatus.deadlineError'));
+                        return;
+                    }
+                    if (!color) {
+                        toast.error(t('changeStatus.colorError'));
+                        return;
+                    }
+                    await addRealization();
+                }, children: t('changeStatus.button') })] }));
+};
+const Line = ({ line, asset, onAssetChange }) => {
+    console.log(asset);
+    return (_jsxs("div", { className: "flex items-center gap-4", children: [_jsx(ImageWithPreview, { src: asset?.preview, imageClassName: "h-20 w-20 object-contain", alt: asset?.id || line.id }), _jsx("span", { className: "flex-1", children: line.productVariant?.name }), _jsx(AssetsModalInput, { value: asset, setValue: onAssetChange })] }, line.id));
+};

package/dist/pages/orders/_components/TopActions.js

@@ -0,0 +1,219 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { AlertDialogHeader, AlertDialogFooter, Button, DropdownMenu, AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogTitle, AlertDialogTrigger, DropdownMenuContent, DropdownMenuItem, DropdownMenuTrigger, Routes, OrderStateBadge, apiClient, usePluginStore, useOrder, useServer, ConfirmationDialog, SimpleSelect, useTranslation, } from '@deenruv/react-ui-devkit';
+import { FulfillmentModal } from "./FulfillmentModal";
+import { ManualOrderChangeModal } from "./ManualOrderChangeModal";
+import { PossibleOrderStates } from "./PossibleOrderStates";
+import { DeletionResult, HistoryEntryType } from '@deenruv/admin-types';
+import { ChevronLeft, EllipsisVerticalIcon, Info } from 'lucide-react';
+import { useMemo, useState } from 'react';
+import { useNavigate } from 'react-router-dom';
+import { toast } from 'sonner';
+import { ORDER_STATE } from "../../../graphql/base";
+import { addFulfillmentToOrderResultSelector } from "../../../graphql/draft_order";
+import { CancelAndRefundDialog, ModifyAcceptModal } from './index.js';
+import React from 'react';
+export const TopActions = () => {
+    const { currentPossibilities, manualChange, setManualChange, fetchOrderHistory, fetchOrder, order, changeOrderState, cancelOrder: _cancelOrder, cancelAndRefundOrder, } = useOrder();
+    const orderProcess = useServer((p) => p.serverConfig?.orderProcess || []);
+    const { t } = useTranslation('orders');
+    const navigate = useNavigate();
+    const { getDetailViewActions } = usePluginStore();
+    const actions = useMemo(() => getDetailViewActions('orders-detail-view'), []);
+    const [cancellationReason, setCancellationReason] = useState('');
+    const reasonOptions = useMemo(() => {
+        const options = [
+            t('cancellationReasons.clientRequest'),
+            t('cancellationReasons.notAvailable'),
+            t('cancellationReasons.mistake'),
+        ];
+        return options.map((o) => ({
+            value: o,
+            label: o,
+        }));
+    }, []);
+    const isOrderValid = useMemo(() => {
+        const isVariantValid = !!order?.lines.every((line) => line.productVariant);
+        const isCustomerValid = !!order?.customer?.id;
+        const isBillingAddressValid = !!order?.billingAddress?.streetLine1;
+        const isShippingAddressValid = !!order?.shippingAddress?.streetLine1;
+        const isShippingMethodValid = !!order?.shippingLines?.length;
+        if (order?.state === ORDER_STATE.ARRANGING_ADDITIONAL_PAYMENT) {
+            const settledPaymentsAmount = order.payments
+                ?.filter((payment) => payment.state === ORDER_STATE.PAYMENT_SETTLED)
+                .reduce((acc, payment) => acc + payment.amount, 0) || 0;
+            return settledPaymentsAmount < order.totalWithTax;
+        }
+        return (isVariantValid && isCustomerValid && isBillingAddressValid && isShippingAddressValid && isShippingMethodValid);
+    }, [order]);
+    const onSubmit = async () => {
+        if (!isOrderValid || !order) {
+            toast.error(t('topActions.fillAll'), { position: 'top-center', closeButton: true });
+            return;
+        }
+        const history = await fetchOrderHistory();
+        let state = ORDER_STATE.ARRANGING_PAYMENT;
+        if (history && order.state === ORDER_STATE.ARRANGING_ADDITIONAL_PAYMENT) {
+            const previousState = history
+                .filter((h) => h.type === HistoryEntryType.ORDER_STATE_TRANSITION)
+                .find((h) => h.data.to === ORDER_STATE.MODIFYING);
+            if (previousState) {
+                state = previousState.data.from;
+            }
+        }
+        changeOrderState(state).catch((err) => {
+            const errorMessage = `
+        ${err?.message || t('topActions.errMsg')}
+        ${err?.transitionError || ''}
+      `;
+            toast(errorMessage);
+        });
+    };
+    const fulfillOrder = async (input) => {
+        if (!order)
+            return;
+        const { addFulfillmentToOrder } = await apiClient('mutation')({
+            addFulfillmentToOrder: [{ input }, addFulfillmentToOrderResultSelector],
+        });
+        if (addFulfillmentToOrder.__typename === 'Fulfillment') {
+            const { transitionFulfillmentToState } = await apiClient('mutation')({
+                transitionFulfillmentToState: [
+                    { id: addFulfillmentToOrder.id, state: ORDER_STATE.SHIPPED },
+                    {
+                        __typename: true,
+                        '...on Fulfillment': {
+                            id: true,
+                        },
+                        '...on FulfillmentStateTransitionError': {
+                            errorCode: true,
+                            fromState: true,
+                            message: true,
+                            toState: true,
+                            transitionError: true,
+                        },
+                    },
+                ],
+            });
+            if (transitionFulfillmentToState.__typename === 'Fulfillment') {
+                fetchOrder(order.id);
+                fetchOrderHistory();
+                toast.success(t('topActions.fulfillmentAdded'));
+                return;
+            }
+            else {
+                toast.error(`${transitionFulfillmentToState.message}`, { position: 'top-center' });
+            }
+        }
+        else {
+            toast.error(`${addFulfillmentToOrder.message}`, { position: 'top-center' });
+        }
+    };
+    const cancelOrder = (lines, cancelShipping) => _cancelOrder({ cancelShipping, lines, reason: cancellationReason })
+        .then(() => {
+        toast.info(t('topActions.orderCanceledSuccessfully'));
+    })
+        .catch((err) => {
+        toast.error(t('topActions.orderCancelError', { value: err.message }));
+    });
+    const cancelAndRefund = (amount, lines, reason, shipping, cancelShipping, adjustment) => cancelAndRefundOrder({ adjustment, amount, cancelShipping, lines, reason, shipping })
+        .then(() => {
+        toast.info(t('topActions.orderRefundedSuccessfully'));
+    })
+        .catch(() => {
+        toast.error(t('topActions.orderRefundError'));
+    });
+    const deleteDraftOrder = async () => {
+        if (!order)
+            return;
+        const { deleteDraftOrder } = await apiClient('mutation')({
+            deleteDraftOrder: [{ orderId: order.id }, { message: true, result: true }],
+        });
+        if (deleteDraftOrder.result === DeletionResult.DELETED) {
+            toast.info(t('topActions.draftDeletedSuccessfully'));
+            navigate(-1);
+        }
+        else {
+            toast.error(t('topActions.draftDeleteError', { value: deleteDraftOrder.message }), { position: 'top-center' });
+        }
+    };
+    const changeOrderStatus = async (newState) => {
+        if (!newState)
+            return;
+        changeOrderState(newState).catch((err) => {
+            toast.error(err?.message
+                ? t('changeStatus.changeStatusFailedMsg', { value: err.message })
+                : t('changeStatus.changeStatusFailed'));
+        });
+        setManualChange({ state: false });
+    };
+    const outstandingPaymentAmount = (order) => {
+        const paymentIsValid = (p) => p?.state !== 'Cancelled' && p.state !== 'Declined' && p.state !== 'Error';
+        let amountCovered = 0;
+        for (const payment of order.payments?.filter(paymentIsValid) ?? []) {
+            const refunds = payment.refunds.filter((r) => r.state !== 'Failed') ?? [];
+            const refundsTotal = (refunds || []).reduce((sum, i) => sum + i['total'], 0);
+            amountCovered += payment.amount - refundsTotal;
+        }
+        return order.totalWithTax - amountCovered;
+    };
+    const canAddFulfillment = useMemo(() => {
+        if (!order)
+            return false;
+        const allFulfillmentLines = (order.fulfillments ?? [])
+            .filter((fulfillment) => fulfillment.state !== 'Cancelled')
+            .reduce((all, fulfillment) => [...all, ...fulfillment.lines], []);
+        let allItemsFulfilled = true;
+        for (const line of order.lines) {
+            const totalFulfilledCount = allFulfillmentLines
+                .filter((row) => row.orderLineId === line.id)
+                .reduce((sum, row) => sum + row.quantity, 0);
+            if (totalFulfilledCount < line.quantity) {
+                allItemsFulfilled = false;
+            }
+        }
+        return (!allItemsFulfilled &&
+            outstandingPaymentAmount(order) === 0 &&
+            (order.nextStates.includes('Shipped') ||
+                order.nextStates.includes('PartiallyShipped') ||
+                order.nextStates.includes('Delivered')));
+    }, [order, currentPossibilities]);
+    // const canCompleteOrder = useMemo(() => {
+    //   return !!(
+    //     order?.fulfillments?.some((f) => f.state === ORDER_STATE.SHIPPED) ||
+    //     !currentPossibilities?.to.some((state) => COMPLETE_ORDER_STATES.includes(state as ORDER_STATE))
+    //   );
+    // }, [order, currentPossibilities]);
+    const needFulfillment = useMemo(() => {
+        const statesNotFromDeenruv = orderProcess.filter((state) => !Object.values(ORDER_STATE).includes(state.name));
+        const states = [ORDER_STATE.PARTIALLY_DELIVERED, ORDER_STATE.SHIPPED, ORDER_STATE.PAYMENT_SETTLED];
+        const doExternalStatesNeedFulfillment = statesNotFromDeenruv.filter((state) => state.to.some((s) => states.includes(s)));
+        states.push(...doExternalStatesNeedFulfillment.map((state) => state.name));
+        return states.includes(order?.state) && order?.state !== ORDER_STATE.SHIPPED;
+    }, [order, currentPossibilities]);
+    const inModifyState = useMemo(() => order?.state === ORDER_STATE.MODIFYING, [order]);
+    const exitingModifyStates = useMemo(() => [ORDER_STATE.DRAFT, ORDER_STATE.ARRANGING_ADDITIONAL_PAYMENT].includes(order?.state), [order]);
+    if (!order)
+        return null;
+    return (_jsxs("div", { className: "flex items-center gap-4 ", children: [currentPossibilities && (_jsx(ManualOrderChangeModal, { open: manualChange.state, setOpen: setManualChange, wantedState: manualChange.toAction, order: order, currentPossibilities: currentPossibilities, onConfirm: (e) => changeOrderStatus(e) })), _jsxs(Button, { variant: "outline", size: "icon", className: "size-7", onClick: () => {
+                    if (order?.state === ORDER_STATE.DRAFT) {
+                        toast.error(t('create.leaveToastMessage'), {
+                            position: 'top-center',
+                            action: {
+                                label: t('create.leaveToastButton'),
+                                onClick: () => navigate(Routes.orders.list, { viewTransition: true }),
+                            },
+                        });
+                    }
+                    else
+                        navigate(Routes.orders.list, { viewTransition: true });
+                }, children: [_jsx(ChevronLeft, { className: "size-4" }), _jsx("span", { className: "sr-only", children: t('create.back') })] }), _jsx("h1", { className: "flex-1 shrink-0 whitespace-nowrap text-xl font-semibold tracking-tight sm:grow-0", children: t('create.orderId', { value: order?.id }) }), _jsx(OrderStateBadge, { state: order?.state }), _jsxs("div", { className: "hidden items-center gap-2 md:ml-auto md:flex", children: [actions?.inline?.map(({ component }) => React.createElement(component)) || null, exitingModifyStates ? (_jsx(Button, { size: "sm", onClick: onSubmit, disabled: !isOrderValid, children: order.state === ORDER_STATE.ARRANGING_ADDITIONAL_PAYMENT
+                            ? t('create.addPaymentButton')
+                            : t('create.completeOrderButton') })) : needFulfillment ? (_jsx(FulfillmentModal, { order: order, onSubmitted: fulfillOrder, disabled: !canAddFulfillment })) : inModifyState ? (_jsx(ModifyAcceptModal, {})) : null, (order.state === ORDER_STATE.ARRANGING_PAYMENT ||
+                        order.state === ORDER_STATE.ARRANGING_ADDITIONAL_PAYMENT) && (_jsxs("div", { className: "flex items-center gap-2 text-sm", children: [_jsx(Info, { size: 20, className: "text-blue-500" }), _jsx("p", { children: t('addPaymentInfo') })] })), order.state === ORDER_STATE.SHIPPED && (_jsxs("div", { className: "flex items-center gap-2 text-sm", children: [_jsx(Info, { size: 20, className: "text-blue-500" }), _jsx("p", { children: t('markFulfillmentInfo') })] }))] }), _jsxs(DropdownMenu, { children: [_jsx(DropdownMenuTrigger, { asChild: true, children: _jsx(Button, { variant: "outline", size: "icon", children: _jsx(EllipsisVerticalIcon, { className: "size-4" }) }) }), _jsxs(DropdownMenuContent, { align: "end", children: [_jsx(DropdownMenuItem, { asChild: true, children: _jsx(PossibleOrderStates, { orderState: order.state }) }), order.state !== ORDER_STATE.CANCELLED &&
+                                order.state !== ORDER_STATE.DRAFT &&
+                                currentPossibilities?.to.length && (_jsx(DropdownMenuItem, { asChild: true, children: _jsx(Button, { onClick: () => setManualChange({ state: true, toAction: undefined }), variant: "ghost", className: "w-full cursor-pointer justify-start px-4 py-2 text-orange-400 hover:text-orange-400 focus-visible:ring-transparent dark:text-orange-400 dark:hover:text-orange-400 dark:focus-visible:ring-transparent", children: t('topActions.manualChangeStatus') }) })), actions?.dropdown?.map(({ component }) => React.createElement(component)) || null, order.state === ORDER_STATE.PARTIALLY_DELIVERED ||
+                                order.state === ORDER_STATE.SHIPPED ||
+                                order.state === ORDER_STATE.PAYMENT_SETTLED ||
+                                order.state === ORDER_STATE.PAYMENT_AUTHORIZED ||
+                                order.state === ORDER_STATE.PARTIALLY_SHIPPED ? (_jsx(DropdownMenuItem, { asChild: true, children: _jsx(Button, { variant: "ghost", className: "w-full cursor-pointer justify-start px-4 py-2 text-blue-400 hover:text-blue-400 dark:text-blue-400 dark:hover:text-blue-400", onClick: changeOrderStatus.bind(null, ORDER_STATE.MODIFYING), children: t('create.modifyOrder') }) })) : null, order.state === ORDER_STATE.ARRANGING_PAYMENT && (_jsx(DropdownMenuItem, { asChild: true, children: _jsx(ConfirmationDialog, { onConfirm: () => cancelOrder(), title: t('create.areYouSure'), description: t('create.cancelOrderMessage'), additionalElement: _jsx(SimpleSelect, { label: t('cancellationLabel'), value: cancellationReason, onValueChange: setCancellationReason, options: reasonOptions }), children: _jsx(Button, { variant: "ghost", className: "w-full justify-start px-4 py-2 text-red-400 hover:text-red-400 dark:text-red-400 dark:hover:text-red-400", children: t('create.cancelOrder') }) }) })), (order.state === ORDER_STATE.PAYMENT_SETTLED ||
+                                order.state === ORDER_STATE.ARRANGING_ADDITIONAL_PAYMENT) && (_jsx(CancelAndRefundDialog, { refundReason: cancellationReason, setRefundReason: setCancellationReason, onConfirm: cancelAndRefund })), order.state === ORDER_STATE.DRAFT && (_jsx(DropdownMenuItem, { asChild: true, children: _jsxs(AlertDialog, { children: [_jsx(AlertDialogTrigger, { asChild: true, children: _jsx(Button, { variant: "ghost", className: "w-full justify-start px-4 py-2  text-red-400 hover:text-red-400 dark:hover:text-red-400", children: t('deleteDraft.button') }) }), _jsxs(AlertDialogContent, { children: [_jsxs(AlertDialogHeader, { children: [_jsx(AlertDialogTitle, { children: t('deleteDraft.title') }), _jsx(AlertDialogDescription, { children: t('deleteDraft.descriptionDraft') })] }), _jsxs(AlertDialogFooter, { children: [_jsx(AlertDialogCancel, { children: t('deleteDraft.cancel') }), _jsx(AlertDialogAction, { onClick: () => deleteDraftOrder(), children: t('deleteDraft.confirm') })] })] })] }) }))] })] })] }));
+};

package/dist/pages/orders/_components/index.js

@@ -0,0 +1,25 @@
+export * from './AddressCard.js';
+export * from './CustomerSelectCard.js';
+export * from './FulfillmentModal.js';
+export * from './LineItem.js';
+export * from './ShippingMethod.js';
+export * from './OrderSummary.js';
+export * from './ManualOrderChangeModal.js';
+export * from './OrderHistory.js';
+export * from './PossibleOrderStates.js';
+export * from './RealizationCard.js';
+export * from './ProductsCard.js';
+export * from './TaxSummary.js';
+export * from './TopActions.js';
+export * from './AddPaymentDialog.js';
+export * from './ModifyAcceptModal.js';
+export * from './ChangesRegister.js';
+export * from './Payments.js';
+export * from './OrderLineActionModal/index.js';
+export * from './CouponCodesCard.js';
+export * from './SurchargeCard.js';
+export * from './SurchargeTable.js';
+export * from './PriceChangedInfo.js';
+export * from './ChangesRegisterTable.js';
+export * from './CancelAndRefundDialog.js';
+export * from './ProductsTable.js';

package/dist/pages/orders/index.js

@@ -0,0 +1,2 @@
+export * from './Detail.js';
+export * from './List.js';