@deenruv/admin-dashboard 1.0.5 → 1.0.9

package/dist/pages/shipping-methods/Detail.js

@@ -1,7 +1,7 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { useCallback } from 'react';
 import { useParams } from 'react-router';
-import { useTranslation, DetailView, createDeenruvForm, getMutation, useMutation, } from '@deenruv/react-ui-devkit';
+import { useTranslation, DetailView, createDeenruvForm, getMutation, useMutation } from '@deenruv/react-ui-devkit';
 import { ShippingMethodDetailView } from "./_components/ShippingMethodDetailView.js";
 const CreateShippingMethodMutation = getMutation('createShippingMethod');
 const EditShippingMethodMutation = getMutation('updateShippingMethod');
@@ -13,23 +13,24 @@ export const ShippingMethodsDetailPage = () => {
     const [remove] = useMutation(DeleteShippingMethodMutation);
     const { t } = useTranslation('shippingMethods');
     const onSubmitHandler = useCallback((data) => {
-        if (!data.code?.validatedValue) {
+        if (!data.code) {
             throw new Error('Name is required.');
         }
+        const checker = data.checker;
         const inputData = {
-            code: data.code?.validatedValue,
-            calculator: data.calculator?.validatedValue,
-            fulfillmentHandler: data.fulfillmentHandler?.validatedValue,
-            translations: data.translations.validatedValue,
-            checker: data.checker?.validatedValue,
-            ...(data.customFields?.validatedValue ? { customFields: data.customFields?.validatedValue } : {}),
+            code: data.code,
+            calculator: data.calculator,
+            fulfillmentHandler: data.fulfillmentHandler,
+            translations: data.translations,
+            checker,
+            ...(data.customFields ? { customFields: data.customFields } : {}),
         };
         if (id) {
             return update({
                 input: {
                     id,
                     ...inputData,
-                    checker: data.checker?.validatedValue?.code !== '' ? data.checker?.validatedValue : undefined,
+                    checker: checker?.code !== '' ? checker : undefined,
                 },
             });
         }
@@ -76,7 +77,6 @@ export const ShippingMethodsDetailPage = () => {
                                 const hasCode = !!v?.code;
                                 const hasInvalidArguments = v?.arguments.filter((a) => !a.value || a.value === 'false').length; // args have 'false' value by default
                                 const errors = [];
-                                console.log(v?.arguments);
                                 if (!hasCode)
                                     errors.push(t('validation.checkerCodeRequired'));
                                 if (hasInvalidArguments)
@@ -92,8 +92,10 @@ export const ShippingMethodsDetailPage = () => {
                         },
                         translations: {
                             validate: (v) => {
-                                const { name } = v[0];
-                                if (!name)
+                                if (!Array.isArray(v) || v.length === 0)
+                                    return [t('validation.nameRequired')];
+                                const hasName = v.some((entry) => entry && entry.name);
+                                if (!hasName)
                                     return [t('validation.nameRequired')];
                             },
                         },

package/dist/pages/shipping-methods/_components/Lines.js

@@ -16,5 +16,5 @@ export const Lines = ({ onLinesChange }) => {
                         priceWithTax: product.priceWithTax.__typename === 'SinglePrice' ? product.priceWithTax.value : product.priceWithTax.min,
                     }));
                     setCurrentProducts(products);
-                } }), _jsxs(Table, { children: [_jsx(TableHeader, { className: "text-nowrap", children: _jsxs(TableRow, { noHover: true, children: [_jsx(TableHead, { children: t('details.lines.product') }), _jsx(TableHead, { children: t('details.lines.price') }), _jsx(TableHead, { children: t('details.lines.total') })] }) }), _jsx(TableBody, { children: currentProducts.length ? (currentProducts.map((line) => (_jsxs(TableRow, { children: [_jsx(TableCell, { children: _jsxs("div", { className: "flex w-max items-center gap-2", children: [_jsx(ImageWithPreview, { imageClassName: "aspect-square w-10 rounded-md object-cover w-[40px] h-[40px]", src: line.featuredAsset?.preview || line.product?.featuredAsset?.preview }), _jsx("div", { className: "font-semibold", children: line.product.name })] }) }), _jsx(TableCell, { children: line.price }), _jsx(TableCell, { children: line.priceWithTax })] }, line.id)))) : (_jsx(TableCell, { colSpan: 8, children: _jsx("div", { className: "mt-4 flex items-center justify-center", children: _jsx("span", { children: t('details.lines.noItems') }) }) })) })] })] }));
+                } }), _jsxs(Table, { children: [_jsx(TableHeader, { className: "text-nowrap", children: _jsxs(TableRow, { noHover: true, children: [_jsx(TableHead, { children: t('details.lines.product') }), _jsx(TableHead, { children: t('details.lines.price') }), _jsx(TableHead, { children: t('details.lines.total') })] }) }), _jsx(TableBody, { children: currentProducts.length ? (currentProducts.map((line) => (_jsxs(TableRow, { children: [_jsx(TableCell, { children: _jsxs("div", { className: "flex w-max items-center gap-2", children: [_jsx(ImageWithPreview, { imageClassName: "aspect-square w-10 rounded-md object-cover w-[40px] h-[40px]", src: line.featuredAsset?.preview || line.product?.featuredAsset?.preview }), _jsx("div", { className: "font-semibold", children: line.product.name })] }) }), _jsx(TableCell, { children: line.price }), _jsx(TableCell, { children: line.priceWithTax })] }, line.id)))) : (_jsx(TableRow, { noHover: true, children: _jsx(TableCell, { colSpan: 3, children: _jsx("div", { className: "mt-4 flex items-center justify-center", children: _jsx("span", { children: t('details.lines.noItems') }) }) }) })) })] })] }));
 };

package/dist/pages/shipping-methods/_components/ShippingMethodDetailView.js

@@ -15,7 +15,7 @@ const SHIPPING_METHOD_FORM_KEYS = [
 ];
 export const ShippingMethodDetailView = () => {
     const { form, entity, fetchEntity, id } = useDetailView('shippingMethods-detail-view', ...SHIPPING_METHOD_FORM_KEYS);
-    const { base: { setField, state }, } = form;
+    const { base } = form;
     const { t } = useTranslation('shippingMethods');
     const [fulfillmentHandlersOptions, setFulfillmentHandlersOptions] = useState();
     const { translationsLanguage: currentTranslationLng } = useSettings();
@@ -24,17 +24,17 @@ export const ShippingMethodDetailView = () => {
             const res = await fetchEntity();
             if (!res)
                 return;
-            setField('code', res.code);
-            setField('translations', res.translations);
-            setField('checker', {
+            base.setField('code', res.code);
+            base.setField('translations', res.translations);
+            base.setField('checker', {
                 arguments: res.checker?.args || [],
                 code: res.checker?.code || '',
             });
-            setField('calculator', {
+            base.setField('calculator', {
                 arguments: res.calculator?.args || [],
                 code: res.calculator?.code || '',
             });
-            setField('fulfillmentHandler', res.fulfillmentHandlerCode);
+            base.setField('fulfillmentHandler', res.fulfillmentHandlerCode);
         })();
     }, []);
     const fetchFulfillmentHandlers = useCallback(async () => {
@@ -49,19 +49,32 @@ export const ShippingMethodDetailView = () => {
     useEffect(() => {
         fetchFulfillmentHandlers();
     }, [id, fetchFulfillmentHandlers]);
-    const translations = state?.translations?.value || [];
+    const translations = base.watch('translations') || [];
     const currentTranslationValue = translations.find((v) => v.languageCode === currentTranslationLng);
     const setTranslationField = useCallback((field, e) => {
-        setField('translations', setInArrayBy(translations, (t) => t.languageCode !== currentTranslationLng, {
+        // Merge with existing translation to preserve other fields (name, description, etc.)
+        const baseTranslation = currentTranslationValue ?? {
+            languageCode: currentTranslationLng,
+            name: '',
+            description: '',
+        };
+        base.setField('translations', setInArrayBy(translations, (t) => t.languageCode === currentTranslationLng, {
+            ...baseTranslation,
             [field]: e,
             languageCode: currentTranslationLng,
         }));
-    }, [currentTranslationLng, translations]);
-    return (_jsx("main", { className: "my-4", children: _jsxs("div", { className: "flex flex-col gap-3", children: [_jsx(CustomCard, { title: t('details.basic.title'), icon: _jsx(CardIcons.basic, {}), color: "green", children: _jsxs("div", { className: "flex flex-wrap items-start gap-4 p-0 pt-4", children: [_jsxs("div", { className: "flex w-full flex-wrap items-start gap-4 p-0 pt-4 xl:flex-nowrap", children: [_jsx("div", { className: "flex basis-full md:basis-1/3", children: _jsx(Input, { label: t('details.basic.name'), value: currentTranslationValue?.name ?? undefined, onChange: (e) => setTranslationField('name', e.target.value), errors: state.translations?.errors, required: true }) }), _jsx("div", { className: "flex basis-full md:basis-1/3", children: _jsx(Input, { label: t('details.basic.code'), value: state.code?.value ?? undefined, onChange: (e) => setField('code', e.target.value), errors: state.code?.errors, required: true }) })] }), _jsxs("div", { className: "flex basis-full flex-col", children: [_jsx(Label, { className: "mb-2", children: t('details.basic.description') }), _jsx(RichTextEditor, { content: currentTranslationValue?.description ?? undefined, onContentChanged: (e) => setTranslationField('description', e) })] }), _jsx("div", { className: "flex basis-full", children: _jsx(SimpleSelect, { label: t('details.basic.fulfillmentHandler'), value: state.fulfillmentHandler?.value ?? undefined, onValueChange: (e) => setField('fulfillmentHandler', e), options: fulfillmentHandlersOptions, errors: state.fulfillmentHandler?.errors }) })] }) }), _jsx(DetailViewMarker, { position: 'shippingMethods-detail-view' }), _jsx(EntityCustomFields, { entityName: "shippingMethod", id: id, hideButton: true, onChange: (customFields, translations) => {
-                        setField('customFields', customFields);
+    }, [currentTranslationLng, translations, currentTranslationValue]);
+    return (_jsx("main", { className: "my-4", children: _jsxs("div", { className: "flex flex-col gap-3", children: [_jsx(CustomCard, { title: t('details.basic.title'), icon: _jsx(CardIcons.basic, {}), color: "green", children: _jsxs("div", { className: "flex flex-wrap items-start gap-4 p-0 pt-4", children: [_jsxs("div", { className: "flex w-full flex-wrap items-start gap-4 p-0 pt-4 xl:flex-nowrap", children: [_jsx("div", { className: "flex basis-full md:basis-1/3", children: _jsx(Input, { label: t('details.basic.name'), value: currentTranslationValue?.name ?? '', onChange: (e) => setTranslationField('name', e.target.value), errors: base.formState.errors?.translations?.message
+                                                ? [base.formState.errors.translations.message]
+                                                : undefined, required: true }) }), _jsx("div", { className: "flex basis-full md:basis-1/3", children: _jsx(Input, { label: t('details.basic.code'), value: base.watch('code') ?? '', onChange: (e) => base.setField('code', e.target.value), errors: base.formState.errors?.code?.message ? [base.formState.errors.code.message] : undefined, required: true }) })] }), _jsxs("div", { className: "flex basis-full flex-col", children: [_jsx(Label, { className: "mb-2", children: t('details.basic.description') }), _jsx(RichTextEditor, { content: currentTranslationValue?.description ?? '', onContentChanged: (e) => setTranslationField('description', e) })] }), _jsx("div", { className: "flex basis-full", children: _jsx(SimpleSelect, { label: t('details.basic.fulfillmentHandler'), value: base.watch('fulfillmentHandler') ?? '', onValueChange: (e) => base.setField('fulfillmentHandler', e), options: fulfillmentHandlersOptions, errors: base.formState.errors?.fulfillmentHandler?.message
+                                        ? [base.formState.errors.fulfillmentHandler.message]
+                                        : undefined }) })] }) }), _jsx(DetailViewMarker, { position: 'shippingMethods-detail-view' }), _jsx(EntityCustomFields, { entityName: "shippingMethod", id: id, hideButton: true, onChange: (customFields, translations) => {
+                        base.setField('customFields', customFields);
                         if (translations)
-                            setField('translations', translations);
+                            base.setField('translations', translations);
                     }, initialValues: entity && 'customFields' in entity
                         ? { customFields: entity.customFields, translations: entity.translations }
-                        : { customFields: {} } }), _jsx(CheckerCard, { currentCheckerValue: state.checker?.value ?? undefined, onCheckerValueChange: (checker) => checker && setField('checker', checker), errors: state.checker?.errors }), _jsx(CalculatorCard, { currentCalculatorValue: state.calculator?.value ?? undefined, onCalculatorValueChange: (calculator) => calculator && setField('calculator', calculator), errors: state.calculator?.errors }), _jsx(TestCard, { calculator: state.calculator?.value ?? undefined, checker: state.checker?.value ?? undefined })] }) }));
+                        : { customFields: {} } }), _jsx(CheckerCard, { currentCheckerValue: base.watch('checker') ?? undefined, onCheckerValueChange: (checker) => checker && base.setField('checker', checker), errors: base.formState.errors?.checker?.message ? [base.formState.errors.checker.message] : undefined }), _jsx(CalculatorCard, { currentCalculatorValue: base.watch('calculator') ?? undefined, onCalculatorValueChange: (calculator) => calculator && base.setField('calculator', calculator), errors: base.formState.errors?.calculator?.message
+                        ? [base.formState.errors.calculator.message]
+                        : undefined }), _jsx(TestCard, { calculator: base.watch('calculator') ?? undefined, checker: base.watch('checker') ?? undefined })] }) }));
 };

package/dist/pages/shipping-methods/_components/TestCard.js

@@ -1,15 +1,30 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { Button, Input, Separator, useServer, apiClient, CustomCard, CardIcons, useGFFLP, SimpleSelect, priceFormatter, useTranslation, } from '@deenruv/react-ui-devkit';
-import { useCallback, useEffect, useState } from 'react';
+import { Button, Input, Separator, useServer, apiClient, CustomCard, CardIcons, useDeenruvForm, z, SimpleSelect, priceFormatter, useTranslation, } from '@deenruv/react-ui-devkit';
+import { useCallback, useEffect, useRef, useState } from 'react';
 import { CircleCheck, CircleX } from 'lucide-react';
 import { Lines } from "./Lines";
+const testShippingSchema = z.object({
+    shippingAddress: z
+        .object({
+        countryCode: z.string().default(''),
+        city: z.string().default(''),
+        streetLine1: z.string().default('test'),
+        postalCode: z.string().default(''),
+        province: z.string().default(''),
+    })
+        .default({ countryCode: '', city: '', streetLine1: 'test', postalCode: '', province: '' }),
+    calculator: z.any().optional(),
+    checker: z.any().optional(),
+    lines: z.array(z.any()).optional(),
+});
 export const TestCard = ({ calculator, checker }) => {
     const { t } = useTranslation('shippingMethods');
     const [testResult, setTestResult] = useState();
     const { countries } = useServer();
-    const { state, setField } = useGFFLP('TestShippingMethodInput', 'shippingAddress', 'calculator', 'checker', 'lines')({
-        shippingAddress: {
-            initialValue: {
+    const form = useDeenruvForm({
+        schema: testShippingSchema,
+        defaultValues: {
+            shippingAddress: {
                 countryCode: '',
                 city: '',
                 streetLine1: 'test',
@@ -18,28 +33,54 @@ export const TestCard = ({ calculator, checker }) => {
             },
         },
     });
+    const shippingAddress = form.watch('shippingAddress');
+    const calculatorValue = form.watch('calculator');
+    const checkerValue = form.watch('checker');
+    const lines = form.watch('lines');
+    // Sync calculator/checker props into local form only when the serialized
+    // value actually changes.  Props arrive from parent's watch() which
+    // returns new object refs on every render — the ref-based comparison
+    // prevents an infinite setValue → rerender → setValue loop.
+    // `form.setField` is now referentially stable (useCallback in useDeenruvForm),
+    // so it won't re-trigger these effects on its own.
+    const prevCalculatorRef = useRef(undefined);
+    const prevCheckerRef = useRef(undefined);
     useEffect(() => {
-        if (calculator)
-            setField('calculator', calculator);
-        if (checker)
-            setField('checker', checker);
-    }, [calculator, checker, setField]);
+        const serialized = calculator ? JSON.stringify(calculator) : undefined;
+        if (serialized && serialized !== prevCalculatorRef.current) {
+            prevCalculatorRef.current = serialized;
+            form.setField('calculator', calculator);
+        }
+    }, [calculator, form.setField]);
+    useEffect(() => {
+        const serialized = checker ? JSON.stringify(checker) : undefined;
+        if (serialized && serialized !== prevCheckerRef.current) {
+            prevCheckerRef.current = serialized;
+            form.setField('checker', checker);
+        }
+    }, [checker, form.setField]);
+    // Read the current address via getValues inside the callback to avoid
+    // stale-closure issues without adding `shippingAddress` (which changes
+    // on every keystroke) to the dependency array.
     const setAddressField = useCallback((addressField, e) => {
-        setField('shippingAddress', {
-            ...state.shippingAddress.value,
+        const current = form.getValues('shippingAddress');
+        form.setField('shippingAddress', {
+            ...current,
             [addressField]: e,
         });
-    }, [state.shippingAddress]);
+    }, [form.getValues, form.setField]);
     const testShippingMethod = useCallback(async () => {
-        if (state.calculator && state.checker && state.shippingAddress && state.lines?.validatedValue) {
+        const currentValues = form.getValues();
+        const { calculator: calc, checker: chk, shippingAddress: addr, lines: ln } = currentValues;
+        if (calc && chk && addr && ln) {
             const resp = await apiClient('query')({
                 testShippingMethod: [
                     {
                         input: {
-                            calculator: state.calculator.validatedValue,
-                            checker: state.checker.validatedValue,
-                            lines: state.lines.validatedValue,
-                            shippingAddress: state.shippingAddress.validatedValue,
+                            calculator: calc,
+                            checker: chk,
+                            lines: ln,
+                            shippingAddress: addr,
                         },
                     },
                     {
@@ -54,9 +95,14 @@ export const TestCard = ({ calculator, checker }) => {
             });
             setTestResult(resp.testShippingMethod);
         }
-    }, [state]);
-    return (_jsx(CustomCard, { title: t('details.test.title'), icon: _jsx(CardIcons.shipping, {}), color: "cyan", bottomRight: _jsx(Button, { className: "w-48", onClick: testShippingMethod, children: t('details.test.button') }), children: _jsxs("div", { className: "flex flex-col gap-4", children: [_jsxs("div", { className: "flex flex-wrap gap-3", children: [_jsx("div", { className: "flex flex-1 basis-full md:basis-1/3", children: _jsx(Input, { label: t('details.test.city'), value: state.shippingAddress?.value.city ?? undefined, onChange: (e) => setAddressField('city', e.target.value), required: true }) }), _jsx("div", { className: "flex flex-1 basis-full md:basis-1/3", children: _jsx(Input, { label: t('details.test.province'), value: state.shippingAddress?.value.province ?? undefined, onChange: (e) => setAddressField('province', e.target.value), required: true }) }), _jsx("div", { className: "flex flex-1 basis-full md:basis-1/3", children: _jsx(Input, { label: t('details.test.postalCode'), value: state.shippingAddress?.value.postalCode ?? undefined, onChange: (e) => setAddressField('postalCode', e.target.value), required: true }) }), _jsx("div", { className: "flex flex-1 basis-full md:basis-1/3", children: _jsx(SimpleSelect, { label: t('details.test.country'), value: state.shippingAddress?.value.countryCode, onValueChange: (e) => setAddressField('countryCode', e), options: countries.map((c) => ({
+    }, [form.getValues]);
+    // Stable callback for Lines component — avoids identity churn that would
+    // cause Lines' useEffect(onLinesChange) to re-fire every render.
+    const handleLinesChange = useCallback((e) => {
+        form.setField('lines', e);
+    }, [form.setField]);
+    return (_jsx(CustomCard, { title: t('details.test.title'), icon: _jsx(CardIcons.shipping, {}), color: "cyan", bottomRight: _jsx(Button, { className: "w-48", onClick: testShippingMethod, children: t('details.test.button') }), children: _jsxs("div", { className: "flex flex-col gap-4", children: [_jsxs("div", { className: "flex flex-wrap gap-3", children: [_jsx("div", { className: "flex flex-1 basis-full md:basis-1/3", children: _jsx(Input, { label: t('details.test.city'), value: shippingAddress?.city ?? undefined, onChange: (e) => setAddressField('city', e.target.value), required: true }) }), _jsx("div", { className: "flex flex-1 basis-full md:basis-1/3", children: _jsx(Input, { label: t('details.test.province'), value: shippingAddress?.province ?? undefined, onChange: (e) => setAddressField('province', e.target.value), required: true }) }), _jsx("div", { className: "flex flex-1 basis-full md:basis-1/3", children: _jsx(Input, { label: t('details.test.postalCode'), value: shippingAddress?.postalCode ?? undefined, onChange: (e) => setAddressField('postalCode', e.target.value), required: true }) }), _jsx("div", { className: "flex flex-1 basis-full md:basis-1/3", children: _jsx(SimpleSelect, { label: t('details.test.country'), value: shippingAddress?.countryCode, onValueChange: (e) => setAddressField('countryCode', e), options: countries.map((c) => ({
                                     label: c.name,
                                     value: c.code,
-                                })) }) })] }), _jsx(Separator, {}), _jsx(Lines, { onLinesChange: (e) => setField('lines', e) }), testResult && (_jsxs("div", { className: "flex flex-col gap-3", children: [_jsx("div", { className: "flex gap-3", children: testResult.eligible ? (_jsxs(_Fragment, { children: [_jsx(CircleCheck, { color: "green" }), t('details.test.eligible')] })) : (_jsxs(_Fragment, { children: [_jsx(CircleX, { color: "red" }), t('details.test.notEligible')] })) }), _jsxs("div", { children: [_jsxs("span", { className: "font-semibold", children: [t('details.lines.price'), ":"] }), ' ', priceFormatter(testResult.quote?.price)] }), _jsxs("div", { children: [_jsxs("span", { className: "font-semibold", children: [t('details.lines.total'), ":"] }), ' ', priceFormatter(testResult.quote?.priceWithTax)] })] }))] }) }));
+                                })) }) })] }), _jsx(Separator, {}), _jsx(Lines, { onLinesChange: handleLinesChange }), testResult && (_jsxs("div", { className: "flex flex-col gap-3", children: [_jsx("div", { className: "flex gap-3", children: testResult.eligible ? (_jsxs(_Fragment, { children: [_jsx(CircleCheck, { color: "green" }), t('details.test.eligible')] })) : (_jsxs(_Fragment, { children: [_jsx(CircleX, { color: "red" }), t('details.test.notEligible')] })) }), _jsxs("div", { children: [_jsxs("span", { className: "font-semibold", children: [t('details.lines.price'), ":"] }), ' ', priceFormatter(testResult.quote?.price)] }), _jsxs("div", { children: [_jsxs("span", { className: "font-semibold", children: [t('details.lines.total'), ":"] }), ' ', priceFormatter(testResult.quote?.priceWithTax)] })] }))] }) }));
 };

package/dist/pages/status/_components/Health.js

@@ -1,5 +1,6 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useTranslation, Badge, Button, CardIcons, cn, CustomCard, Skeleton, useServer, } from '@deenruv/react-ui-devkit';
+import { useShallow } from 'zustand/react/shallow';
 import { RefreshCw, AlertCircle, CheckCircle, XCircle } from 'lucide-react';
 const getStatusBadge = (status) => {
     const statusLower = status.toLowerCase();
@@ -15,7 +16,7 @@ const getStatusBadge = (status) => {
 };
 export const Health = () => {
     const { t } = useTranslation('system');
-    const { data, lastUpdated, loading } = useServer((state) => state.status);
+    const { data, lastUpdated, loading } = useServer(useShallow((state) => state.status));
     const fetchStatus = useServer((state) => state.fetchStatus);
     return (_jsx(CustomCard, { title: t('health.title'), ...(lastUpdated && { description: t('health.updated') + '' + lastUpdated.toLocaleTimeString() }), color: data.status ? (data.status === 'up' ? 'green' : 'red') : 'gray', icon: _jsx(CardIcons.action, {}), upperRight: _jsxs(Button, { variant: "outline", size: "sm", onClick: fetchStatus, disabled: loading, className: "h-9", children: [_jsx(RefreshCw, { className: cn('mr-2 h-4 w-4', loading && 'animate-spin') }), loading ? t('health.refreshing') : t('health.refresh')] }), children: loading && !data.status ? (_jsxs("div", { className: "space-y-4", children: [_jsx(Skeleton, { className: "h-6 w-32" }), _jsxs("div", { className: "space-y-2", children: [_jsx(Skeleton, { className: "h-5 w-full" }), _jsx(Skeleton, { className: "h-5 w-full" }), _jsx(Skeleton, { className: "h-5 w-3/4" })] })] })) : data.status ? (_jsxs("div", { className: "space-y-6", children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx("h3", { className: "text-base font-medium", children: t('health.status') }), getStatusBadge(data.status)] }), _jsxs("div", { children: [_jsx("h3", { className: "mb-3 text-base font-medium", children: t('health.details') }), _jsx("div", { className: "divide-y rounded-md border", children: Object.entries(data.details).map(([key, detail], index) => (_jsxs("div", { className: cn('flex items-center justify-between px-4 py-3', index % 2 === 0 ? 'bg-muted/20' : 'bg-background'), children: [_jsx("span", { className: "text-sm font-medium", children: key }), getStatusBadge(detail.status)] }, key))) })] })] })) : (_jsxs("div", { className: "flex flex-col items-center justify-center py-8 text-center", children: [_jsx(AlertCircle, { className: "mb-3 size-10 text-muted-foreground" }), _jsx("h3", { className: "text-lg font-medium", children: t('health.error.title') }), _jsx("p", { className: "mt-1 text-sm text-muted-foreground", children: t('health.error.description') }), _jsx(Button, { variant: "outline", size: "sm", onClick: fetchStatus, className: "mt-4", children: t('health.error.button') })] })) }));
 };

package/dist/pages/status/_components/Jobs.js

@@ -153,9 +153,7 @@ export const Jobs = () => {
             accessorKey: 'jobData',
             header: () => _jsx(TableLabel, { children: t('jobs.table.jobData') }),
             cell: ({ row }) => {
-                return JsonPopup({
-                    data: row.original.data,
-                });
+                return _jsx(JsonPopup, { data: row.original.data });
             },
         },
         {
@@ -170,9 +168,7 @@ export const Jobs = () => {
             accessorKey: 'jobResult',
             header: () => _jsx(TableLabel, { children: t('jobs.table.jobResult') }),
             cell: ({ row }) => {
-                return JobResultPopover({
-                    result: row.original.result,
-                });
+                return _jsx(JobResultPopover, { result: row.original.result });
             },
         },
         {

package/dist/pages/stock-locations/Detail.js

@@ -35,13 +35,13 @@ export const StockLocationsDetailPage = () => {
     const [remove] = useMutation(DeleteStockLocationMutation);
     const { nameValidator } = useValidators();
     const onSubmitHandler = useCallback((data) => {
-        if (!data.name?.validatedValue) {
+        if (!data.name) {
             throw new Error('Name is required.');
         }
         const inputData = {
-            name: data.name.validatedValue,
-            description: data.description?.validatedValue,
-            ...(data.customFields?.validatedValue ? { customFields: data.customFields?.validatedValue } : {}),
+            name: data.name,
+            description: data.description,
+            ...(data.customFields ? { customFields: data.customFields } : {}),
         };
         if (id) {
             return update({ input: { id, ...inputData } });

package/dist/pages/stock-locations/_components/StockLocationDetailView.js

@@ -6,17 +6,17 @@ export const StockLocationDetailView = () => {
     const contentLng = useSettings((p) => p.translationsLanguage);
     const { t } = useTranslation('stockLocations');
     const { form, entity, fetchEntity, id } = useDetailView('stockLocations-detail-view', ...STOCK_LOCATION_FORM_KEYS);
-    const { base: { setField, state }, } = form;
+    const { base } = form;
     useEffect(() => {
         (async () => {
             const res = await fetchEntity();
             if (!res)
                 return;
-            setField('name', res.name);
-            setField('description', res['description']);
+            base.setField('name', res.name);
+            base.setField('description', res['description']);
         })();
     }, [contentLng]);
-    return (_jsx("main", { className: "min-h-96", children: _jsxs("div", { className: "flex flex-col gap-3", children: [_jsx(CustomCard, { title: t('details.basic.title'), icon: _jsx(CardIcons.basic, {}), color: "green", children: _jsxs("div", { className: "flex flex-col gap-3", children: [_jsx(Input, { label: t('details.basic.name'), value: state.name?.value, onChange: (e) => setField('name', e.target.value), errors: state.name?.errors, required: true }), _jsxs("div", { className: "flex basis-full flex-col", children: [_jsx(Label, { className: "mb-2", children: t('details.basic.description') }), _jsx(RichTextEditor, { content: state.description?.value ?? undefined, onContentChanged: (e) => setField('description', e) })] })] }) }), _jsx(DetailViewMarker, { position: 'stockLocations-detail-view' }), _jsx(EntityCustomFields, { entityName: "stockLocation", id: id, hideButton: true, onChange: (customFields) => {
-                        setField('customFields', customFields);
+    return (_jsx("main", { className: "min-h-96", children: _jsxs("div", { className: "flex flex-col gap-3", children: [_jsx(CustomCard, { title: t('details.basic.title'), icon: _jsx(CardIcons.basic, {}), color: "green", children: _jsxs("div", { className: "flex flex-col gap-3", children: [_jsx(Input, { label: t('details.basic.name'), value: base.watch('name'), onChange: (e) => base.setField('name', e.target.value), errors: base.formState.errors?.name?.message ? [base.formState.errors.name.message] : undefined, required: true }), _jsxs("div", { className: "flex basis-full flex-col", children: [_jsx(Label, { className: "mb-2", children: t('details.basic.description') }), _jsx(RichTextEditor, { content: base.watch('description') ?? undefined, onContentChanged: (e) => base.setField('description', e) })] })] }) }), _jsx(DetailViewMarker, { position: 'stockLocations-detail-view' }), _jsx(EntityCustomFields, { entityName: "stockLocation", id: id, hideButton: true, onChange: (customFields) => {
+                        base.setField('customFields', customFields);
                     }, initialValues: entity && 'customFields' in entity ? { customFields: entity.customFields } : { customFields: {} } })] }) }));
 };

package/dist/pages/tax-categories/Detail.js

@@ -56,13 +56,13 @@ export const TaxCategoriesDetailPage = () => {
                         },
                     },
                     onSubmitted: (data) => {
-                        if (!data.name?.validatedValue) {
+                        if (!data.name) {
                             throw new Error('Name is required.');
                         }
                         const inputData = {
-                            name: data.name.validatedValue,
-                            isDefault: data.isDefault?.validatedValue,
-                            ...(data.customFields?.validatedValue ? { customFields: data.customFields?.validatedValue } : {}),
+                            name: data.name,
+                            isDefault: data.isDefault,
+                            ...(data.customFields ? { customFields: data.customFields } : {}),
                         };
                         return id
                             ? update({

package/dist/pages/tax-categories/_components/TaxCategoryDetailView.js

@@ -6,19 +6,19 @@ export const TaxCategoryDetailView = () => {
     const contentLng = useSettings((p) => p.translationsLanguage);
     const { id, form, entity, fetchEntity } = useDetailView('taxCategories-detail-view', ...TAX_CATEGORY_FORM_KEYS);
     const { t } = useTranslation('taxCategories');
-    const { base: { setField, state }, } = form;
+    const { base } = form;
     useEffect(() => {
         (async () => {
             const res = await fetchEntity();
             if (!res)
                 return;
-            setField('name', res.name);
-            setField('isDefault', res['isDefault']);
+            base.setField('name', res.name);
+            base.setField('isDefault', res['isDefault']);
         })();
     }, [contentLng]);
-    return (_jsx("div", { children: _jsxs("div", { className: "flex w-full flex-col gap-4", children: [_jsx(CustomCard, { title: t('details.basic.title'), icon: _jsx(CardIcons.basic, {}), color: "green", children: _jsxs("div", { className: "flex items-start gap-4", children: [_jsx("div", { className: "flex basis-full md:basis-1/2", children: _jsx(Input, { label: t('details.basic.name'), value: state.name?.value, required: true, onChange: (e) => {
-                                        setField('name', e.target.value);
-                                    }, errors: state.name?.errors }) }), _jsxs("div", { className: "mt-7 flex basis-full items-center gap-3 md:basis-1/2", children: [_jsx(Switch, { checked: state.isDefault?.value ?? undefined, onCheckedChange: (e) => setField('isDefault', e) }), _jsx(Label, { children: t('details.basic.isDefault') })] })] }) }), _jsx(DetailViewMarker, { position: 'taxCategories-detail-view' }), _jsx(EntityCustomFields, { entityName: "taxCategory", id: id, hideButton: true, onChange: (customFields) => {
-                        setField('customFields', customFields);
+    return (_jsx("div", { children: _jsxs("div", { className: "flex w-full flex-col gap-4", children: [_jsx(CustomCard, { title: t('details.basic.title'), icon: _jsx(CardIcons.basic, {}), color: "green", children: _jsxs("div", { className: "flex items-start gap-4", children: [_jsx("div", { className: "flex basis-full md:basis-1/2", children: _jsx(Input, { label: t('details.basic.name'), value: base.watch('name'), required: true, onChange: (e) => {
+                                        base.setField('name', e.target.value);
+                                    }, errors: base.formState.errors?.name?.message ? [base.formState.errors.name.message] : undefined }) }), _jsxs("div", { className: "mt-7 flex basis-full items-center gap-3 md:basis-1/2", children: [_jsx(Switch, { checked: base.watch('isDefault') ?? undefined, onCheckedChange: (e) => base.setField('isDefault', e) }), _jsx(Label, { children: t('details.basic.isDefault') })] })] }) }), _jsx(DetailViewMarker, { position: 'taxCategories-detail-view' }), _jsx(EntityCustomFields, { entityName: "taxCategory", id: id, hideButton: true, onChange: (customFields) => {
+                        base.setField('customFields', customFields);
                     }, initialValues: entity && 'customFields' in entity ? { customFields: entity.customFields } : { customFields: {} } })] }) }));
 };

package/dist/pages/tax-rates/Detail.js

@@ -14,17 +14,17 @@ export const TaxRatesDetailPage = () => {
     const { t } = useTranslation('taxRates');
     const { nameValidator, stringValidator, numberValidator } = useValidators();
     const onSubmitHandler = useCallback((data) => {
-        if (!data.name?.validatedValue) {
+        if (!data.name) {
             throw new Error('Name is required.');
         }
         const inputData = {
-            name: data.name.validatedValue,
-            enabled: data.enabled.value,
-            categoryId: data.categoryId.validatedValue,
-            value: data.value?.validatedValue || data.value?.initialValue,
-            zoneId: data.zoneId.validatedValue,
-            customerGroupId: data.customerGroupId?.validatedValue,
-            ...(data.customFields?.validatedValue ? { customFields: data.customFields?.validatedValue } : {}),
+            name: data.name,
+            enabled: (data.enabled ?? true),
+            categoryId: data.categoryId,
+            value: data.value,
+            zoneId: data.zoneId,
+            customerGroupId: data.customerGroupId,
+            ...(data.customFields ? { customFields: data.customFields } : {}),
         };
         if (id) {
             return update({ input: { id, ...inputData } });

package/dist/pages/tax-rates/_components/TaxRateDetailView.js

@@ -16,7 +16,7 @@ export const TaxRateDetailView = () => {
     const [taxCategoriesOptions, setTaxCategoriesOptions] = useState([]);
     const [zonesOptions, setZonesOptions] = useState([]);
     const { form, entity, fetchEntity, id } = useDetailView('taxRates-detail-view', ...TAX_RATES_FORM_KEYS);
-    const { base: { setField, state }, } = form;
+    const { base } = form;
     const fetchItemsForOptions = useCallback(async () => {
         const response = await apiClient('query')({
             taxCategories: [
@@ -51,14 +51,18 @@ export const TaxRateDetailView = () => {
         console.log('ENT', entity);
         if (!entity)
             return;
-        setField('name', entity.name);
-        setField('enabled', entity.enabled);
-        setField('categoryId', entity.category.id);
-        setField('customerGroupId', entity.customerGroup?.id);
-        setField('zoneId', entity.zone.id);
-        setField('value', entity.value);
+        base.setField('name', entity.name);
+        base.setField('enabled', entity.enabled);
+        base.setField('categoryId', entity.category.id);
+        base.setField('customerGroupId', entity.customerGroup?.id);
+        base.setField('zoneId', entity.zone.id);
+        base.setField('value', entity.value);
     }, [entity]);
-    return (_jsx("main", { className: "my-4 min-h-96", children: _jsxs("div", { className: "flex flex-col gap-3", children: [_jsx(CustomCard, { title: t('details.basic.title'), icon: _jsx(CardIcons.basic, {}), color: "green", children: _jsxs("div", { className: "flex flex-col gap-4 p-0 pt-4", children: [_jsxs("div", { className: "flex items-start gap-4", children: [_jsx("div", { className: "flex basis-full md:basis-1/2", children: _jsx(Input, { label: t('details.basic.name'), value: state.name?.value ?? undefined, onChange: (e) => setField('name', e.target.value), errors: state.name?.errors, required: true }) }), _jsx("div", { className: "flex basis-full md:basis-1/2", children: _jsx(Input, { type: "number", label: t('details.basic.value'), value: state.value?.value ?? undefined, onChange: (e) => setField('value', +e.target.value), errors: state.value?.errors, endAdornment: '%', min: 0, max: 100, required: true }) })] }), _jsxs("div", { className: "flex items-end gap-4", children: [_jsx("div", { className: "flex basis-full md:basis-1/2", children: _jsx(SimpleSelect, { label: t('details.basic.taxCategory'), value: state.categoryId?.value ?? undefined, onValueChange: (e) => setField('categoryId', e), options: taxCategoriesOptions, errors: state.categoryId?.errors, required: true }) }), _jsx("div", { className: "flex basis-full md:basis-1/2", children: _jsx(SimpleSelect, { label: t('details.basic.zone'), value: state.zoneId?.value ?? undefined, onValueChange: (e) => setField('zoneId', e), options: zonesOptions, errors: state.zoneId?.errors, required: true }) })] }), _jsx("div", { className: "flex items-end gap-4", children: _jsxs("div", { className: "mb-2 flex basis-full items-center gap-3 md:basis-1/2", children: [_jsx(Switch, { checked: state.enabled?.value ?? undefined, onCheckedChange: (e) => setField('enabled', e) }), _jsx(Label, { children: t('details.basic.enabled') })] }) })] }) }), _jsx(DetailViewMarker, { position: 'taxRates-detail-view' }), _jsx(EntityCustomFields, { entityName: "taxRate", id: id, onChange: (customFields) => {
-                        setField('customFields', customFields);
+    return (_jsx("main", { className: "my-4 min-h-96", children: _jsxs("div", { className: "flex flex-col gap-3", children: [_jsx(CustomCard, { title: t('details.basic.title'), icon: _jsx(CardIcons.basic, {}), color: "green", children: _jsxs("div", { className: "flex flex-col gap-4 p-0 pt-4", children: [_jsxs("div", { className: "flex items-start gap-4", children: [_jsx("div", { className: "flex basis-full md:basis-1/2", children: _jsx(Input, { label: t('details.basic.name'), value: base.watch('name') ?? undefined, onChange: (e) => base.setField('name', e.target.value), errors: base.formState.errors?.name?.message ? [base.formState.errors.name.message] : undefined, required: true }) }), _jsx("div", { className: "flex basis-full md:basis-1/2", children: _jsx(Input, { type: "number", label: t('details.basic.value'), value: base.watch('value') ?? undefined, onChange: (e) => base.setField('value', +e.target.value), errors: base.formState.errors?.value?.message ? [base.formState.errors.value.message] : undefined, endAdornment: '%', min: 0, max: 100, required: true }) })] }), _jsxs("div", { className: "flex items-end gap-4", children: [_jsx("div", { className: "flex basis-full md:basis-1/2", children: _jsx(SimpleSelect, { label: t('details.basic.taxCategory'), value: base.watch('categoryId') ?? undefined, onValueChange: (e) => base.setField('categoryId', e), options: taxCategoriesOptions, errors: base.formState.errors?.categoryId?.message
+                                                ? [base.formState.errors.categoryId.message]
+                                                : undefined, required: true }) }), _jsx("div", { className: "flex basis-full md:basis-1/2", children: _jsx(SimpleSelect, { label: t('details.basic.zone'), value: base.watch('zoneId') ?? undefined, onValueChange: (e) => base.setField('zoneId', e), options: zonesOptions, errors: base.formState.errors?.zoneId?.message
+                                                ? [base.formState.errors.zoneId.message]
+                                                : undefined, required: true }) })] }), _jsx("div", { className: "flex items-end gap-4", children: _jsxs("div", { className: "mb-2 flex basis-full items-center gap-3 md:basis-1/2", children: [_jsx(Switch, { checked: base.watch('enabled') ?? undefined, onCheckedChange: (e) => base.setField('enabled', e) }), _jsx(Label, { children: t('details.basic.enabled') })] }) })] }) }), _jsx(DetailViewMarker, { position: 'taxRates-detail-view' }), _jsx(EntityCustomFields, { entityName: "taxRate", id: id, onChange: (customFields) => {
+                        base.setField('customFields', customFields);
                     }, initialValues: entity && 'customFields' in entity ? { customFields: entity.customFields } : { customFields: {} }, hideButton: true })] }) }));
 };

package/dist/pages/zones/Detail.js

@@ -43,15 +43,15 @@ export const ZonesDetailPage = () => {
         });
     }, [id, t]);
     const onSubmitHandler = useCallback((data, additionalData) => {
-        if (!data.name?.validatedValue) {
+        if (!data.name) {
             throw new Error('Name is required.');
         }
         const { membersIdsToRemove = [], membersIdsToAdd = [] } = additionalData && 'membersIdsToRemove' in additionalData && 'membersIdsToAdd' in additionalData
             ? additionalData
             : {};
         const inputData = {
-            name: data.name.validatedValue,
-            ...(data.customFields?.validatedValue ? { customFields: data.customFields?.validatedValue } : {}),
+            name: data.name,
+            ...(data.customFields ? { customFields: data.customFields } : {}),
         };
         if (id) {
             return Promise.all([
@@ -60,7 +60,7 @@ export const ZonesDetailPage = () => {
             ]).then(([res]) => res);
         }
         else {
-            return create({ input: { ...inputData, memberIds: data.memberIds?.validatedValue } });
+            return create({ input: { ...inputData, memberIds: data.memberIds } });
         }
     }, [id, update, create]);
     const onDeleteHandler = useCallback(() => {

package/dist/pages/zones/_components/ZoneDetailView.js

@@ -4,7 +4,7 @@ import { Input, Label, MultipleSelector, useServer, useDetailView, DetailViewMar
 const STOCK_LOCATION_FORM_KEYS = ['CreateZoneInput', 'name', 'memberIds', 'customFields'];
 export const ZoneDetailView = () => {
     const { form, fetchEntity, entity, setAdditionalData, id } = useDetailView('zones-detail-view', ...STOCK_LOCATION_FORM_KEYS);
-    const { base: { setField, state }, } = form;
+    const { base } = form;
     const editMode = useMemo(() => !!id, [id]);
     const { t } = useTranslation('zones');
     const [countriesOptions, setCountriesOptions] = useState();
@@ -19,12 +19,12 @@ export const ZoneDetailView = () => {
             const res = await fetchEntity();
             if (!res)
                 return;
-            setField('name', res.name);
-            setField('memberIds', res.members.map((m) => m.id));
+            base.setField('name', res.name);
+            base.setField('memberIds', res.members.map((m) => m.id));
         })();
     }, []);
     const handleChange = useCallback((options) => {
-        setField('memberIds', options.map((o) => o.value));
+        base.setField('memberIds', options.map((o) => o.value));
         if (editMode && entity) {
             const backendMembersIds = entity.members.map((m) => m.id);
             const optionValues = options.map((o) => o.value);
@@ -39,11 +39,12 @@ export const ZoneDetailView = () => {
             // if currentState doesn't include BE ids, remove them
             setMembersIdsToRemove(toRemove);
         }
-    }, [editMode, setField, entity]);
-    return (_jsx("main", { className: "my-4 min-h-96", children: _jsxs("div", { className: "flex flex-col gap-3", children: [_jsx(CustomCard, { title: t('details.basic.title'), icon: _jsx(CardIcons.basic, {}), color: "green", children: _jsxs("div", { className: "flex gap-3", children: [_jsx("div", { className: "flex basis-full md:basis-1/2", children: _jsx(Input, { label: t('details.basic.name'), value: state.name?.value, onChange: (e) => setField('name', e.target.value), errors: state.name?.errors, required: true }) }), _jsxs("div", { className: "flex basis-full flex-col md:basis-1/2", children: [_jsx(Label, { className: "mb-2", children: t('details.basic.members') }), _jsx(MultipleSelector, { options: countriesOptions, value: state?.memberIds?.value?.map((id) => ({
+    }, [editMode, base.setField, entity]);
+    const memberIds = base.watch('memberIds');
+    return (_jsx("main", { className: "my-4 min-h-96", children: _jsxs("div", { className: "flex flex-col gap-3", children: [_jsx(CustomCard, { title: t('details.basic.title'), icon: _jsx(CardIcons.basic, {}), color: "green", children: _jsxs("div", { className: "flex gap-3", children: [_jsx("div", { className: "flex basis-full md:basis-1/2", children: _jsx(Input, { label: t('details.basic.name'), value: base.watch('name'), onChange: (e) => base.setField('name', e.target.value), errors: base.formState.errors?.name?.message ? [base.formState.errors.name.message] : undefined, required: true }) }), _jsxs("div", { className: "flex basis-full flex-col md:basis-1/2", children: [_jsx(Label, { className: "mb-2", children: t('details.basic.members') }), _jsx(MultipleSelector, { options: countriesOptions, value: memberIds?.map((id) => ({
                                             label: countriesOptions?.find((o) => o.value === id)?.label || id,
                                             value: id,
                                         })), placeholder: t('details.basic.memberPlaceholder'), onChange: handleChange, hideClearAllButton: true })] })] }) }), _jsx(DetailViewMarker, { position: 'zones-detail-view' }), _jsx(EntityCustomFields, { entityName: "zone", id: id, hideButton: true, onChange: (customFields) => {
-                        setField('customFields', customFields);
+                        base.setField('customFields', customFields);
                     }, initialValues: entity && 'customFields' in entity ? { customFields: entity.customFields } : { customFields: {} } })] }) }));
 };

package/dist/version.js

@@ -1 +1 @@
-export const ADMIN_DASHBOARD_VERSION = '1.0.5';
+export const ADMIN_DASHBOARD_VERSION = '1.0.9';