@deenruv/admin-dashboard 1.0.5 → 1.0.9

package/dist/pages/collections/_components/CollectionProductVariantsDrawer.js

@@ -24,5 +24,5 @@ export const CollectionProductVariantsDrawer = ({ collectionId, collectionName,
     };
     return (_jsx("div", { children: _jsxs(Drawer, { direction: "right", children: [children, _jsxs(DrawerContent, { className: "top-0 right-0 left-auto mt-0 w-[85vw]", children: [_jsxs(DrawerHeader, { className: "flex items-center justify-between", children: [_jsxs("div", { className: "flex items-center gap-4", children: [_jsxs("div", { className: "shrink-0", children: [_jsx(DrawerTitle, { children: t('drawer.title', { collectionName, interpolation: { escapeValue: false } }) }), _jsx(DrawerDescription, { children: t('drawer.count', { count }) }), ' '] }), _jsxs(Select, { value: firstFilterKey, onValueChange: (e) => {
                                                 setFilter({ [e]: {} });
-                                            }, children: [_jsx(SelectTrigger, { className: "w-[280px]", children: _jsx(SelectValue, { placeholder: t('drawer.filter.title') }) }), _jsx(SelectContent, { children: filterOptions.map((i) => (_jsx(SelectItem, { className: "cursor-pointer", value: i, children: t(`drawer.filter.labels.${i}`) }, i))) })] }), filter && handleFilterValue(firstFilterKey)] }), _jsx(DrawerClose, { children: _jsx(Button, { children: t('drawer.close') }) })] }), _jsx(ContentsTable, { collectionId: collectionId, filter: filter })] })] }) }));
+                                            }, children: [_jsx(SelectTrigger, { className: "w-[280px]", children: _jsx(SelectValue, { placeholder: t('drawer.filter.title') }) }), _jsx(SelectContent, { children: filterOptions.map((i) => (_jsx(SelectItem, { className: "cursor-pointer", value: i, children: t(`drawer.filter.labels.${i}`) }, i))) })] }), filter && handleFilterValue(firstFilterKey)] }), _jsx(DrawerClose, { asChild: true, children: _jsx(Button, { children: t('drawer.close') }) })] }), _jsx(ContentsTable, { collectionId: collectionId, filter: filter })] })] }) }));
 };

package/dist/pages/countries/Detail.js

@@ -14,14 +14,14 @@ export const CountriesDetailPage = () => {
     const [remove] = useMutation(DeleteCountryMutation);
     const { translationsValidator, stringValidator } = useValidators();
     const onSubmitHandler = useCallback((data) => {
-        if (!data.code?.validatedValue) {
+        if (!data.code) {
             throw new Error('Code is required.');
         }
         const inputData = {
-            code: data.code.validatedValue,
-            enabled: data.enabled?.validatedValue || data.enabled?.initialValue,
-            translations: data.translations?.validatedValue,
-            ...(data.customFields?.validatedValue ? { customFields: data.customFields?.validatedValue } : {}),
+            code: data.code,
+            enabled: data.enabled,
+            translations: data.translations,
+            ...(data.customFields ? { customFields: data.customFields } : {}),
         };
         if (id) {
             return update({ input: { id, ...inputData } });

package/dist/pages/countries/_components/CountryDetailView.js

@@ -3,26 +3,33 @@ import { useCallback, useEffect } from 'react';
 import { Input, Label, Switch, useSettings, useDetailView, DetailViewMarker, CustomCard, CardIcons, setInArrayBy, useTranslation, } from '@deenruv/react-ui-devkit';
 export const CountryDetailView = () => {
     const { form, entity, fetchEntity, id } = useDetailView('countries-detail-view', 'CreateCountryInput', 'code', 'enabled', 'translations', 'customFields');
-    const { base: { setField, state }, } = form;
+    const { base } = form;
     const { t } = useTranslation('countries');
     const { translationsLanguage: currentTranslationLng } = useSettings();
-    const translations = state?.translations?.value || [];
+    const translations = base.watch('translations') || [];
     const currentTranslationValue = translations.find((v) => v.languageCode === currentTranslationLng);
     useEffect(() => {
         (async () => {
             const resp = await fetchEntity();
             if (!resp)
                 return;
-            setField('code', resp.code);
-            setField('translations', resp.translations);
-            setField('enabled', resp.enabled);
+            base.setField('code', resp.code);
+            base.setField('translations', resp.translations);
+            base.setField('enabled', resp.enabled);
         })();
     }, []);
     const setTranslationField = useCallback((field, e) => {
-        setField('translations', setInArrayBy(translations, (t) => t.languageCode !== currentTranslationLng, {
+        const baseTranslation = currentTranslationValue ?? {
+            languageCode: currentTranslationLng,
+            name: '',
+        };
+        base.setField('translations', setInArrayBy(translations, (t) => t.languageCode === currentTranslationLng, {
+            ...baseTranslation,
             [field]: e,
             languageCode: currentTranslationLng,
         }));
-    }, [currentTranslationLng, translations]);
-    return (_jsx("main", { className: "min-h-96", children: _jsxs("div", { className: "mx-auto mt-2 flex w-full max-w-[1440px] flex-col gap-4 2xl:px-8", children: [_jsx(CustomCard, { title: t('details.basic.title'), icon: _jsx(CardIcons.basic, {}), color: "green", children: _jsxs("div", { className: "flex items-start gap-3", 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, onChange: (e) => setField('code', e.target.value), errors: state.code?.errors, required: true }) }), _jsxs("div", { className: "mt-7 flex basis-full items-center gap-3 md:basis-1/3", children: [_jsx(Switch, { checked: state.enabled?.value, onCheckedChange: (e) => setField('enabled', e) }), _jsx(Label, { children: t('details.basic.enabled') })] })] }) }), _jsx(DetailViewMarker, { position: 'countries-detail-view' })] }) }));
+    }, [currentTranslationLng, translations, currentTranslationValue]);
+    return (_jsx("main", { className: "min-h-96", children: _jsxs("div", { className: "mx-auto mt-2 flex w-full max-w-[1440px] flex-col gap-4 2xl:px-8", children: [_jsx(CustomCard, { title: t('details.basic.title'), icon: _jsx(CardIcons.basic, {}), color: "green", children: _jsxs("div", { className: "flex items-start gap-3", 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: 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: "mt-7 flex basis-full items-center gap-3 md:basis-1/3", children: [_jsx(Switch, { checked: base.watch('enabled'), onCheckedChange: (e) => base.setField('enabled', e) }), _jsx(Label, { children: t('details.basic.enabled') })] })] }) }), _jsx(DetailViewMarker, { position: 'countries-detail-view' })] }) }));
 };

package/dist/pages/customer-groups/Detail.js

@@ -35,12 +35,12 @@ export const CustomerGroupsDetailPage = () => {
     const [remove] = useMutation(DeleteCustomerGroupMutation);
     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,
-            ...(data.customFields?.validatedValue ? { customFields: data.customFields?.validatedValue } : {}),
+            name: data.name,
+            ...(data.customFields ? { customFields: data.customFields } : {}),
         };
         if (id) {
             return update({ input: { id, ...inputData } });

package/dist/pages/customer-groups/_components/CustomerGroupsDetailView.js

@@ -6,16 +6,16 @@ export const CustomerGroupsDetailView = () => {
     const contentLng = useSettings((p) => p.translationsLanguage);
     const { t } = useTranslation('customerGroups');
     const { id, form, entity, fetchEntity } = useDetailView('customerGroups-detail-view', ...CUSTOMER_GROUPS_FORM_KEYS);
-    const { base: { setField, state }, } = form;
+    const { base } = form;
     useEffect(() => {
         (async () => {
             const res = await fetchEntity();
             if (!res)
                 return;
-            setField('name', res.name);
+            base.setField('name', res.name);
         })();
     }, [contentLng]);
-    return (_jsx("main", { className: "min-h-96", children: _jsxs("div", { className: "flex flex-col gap-3", children: [_jsx(CustomCard, { title: t('basic.header'), icon: _jsx(CardIcons.basic, {}), children: _jsx(Input, { className: "w-1/2", label: t('basic.name'), value: state.name?.value, onChange: (e) => setField('name', e.target.value), errors: state.name?.errors, required: true }) }), _jsx(DetailViewMarker, { position: 'customerGroups-detail-view' }), _jsx(EntityCustomFields, { entityName: "customerGroup", 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('basic.header'), icon: _jsx(CardIcons.basic, {}), children: _jsx(Input, { className: "w-1/2", label: t('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 }) }), _jsx(DetailViewMarker, { position: 'customerGroups-detail-view' }), _jsx(EntityCustomFields, { entityName: "customerGroup", id: id, hideButton: true, onChange: (customFields) => {
+                        base.setField('customFields', customFields);
                     }, initialValues: entity && 'customFields' in entity ? { customFields: entity.customFields } : { customFields: {} } })] }) }));
 };

package/dist/pages/customers/Detail.js

@@ -46,14 +46,12 @@ export const CustomersDetailPage = () => {
                     },
                     onSubmitted: (data) => {
                         const sharedInput = {
-                            emailAddress: data.emailAddress?.validatedValue,
-                            firstName: data.firstName?.validatedValue,
-                            lastName: data.lastName?.validatedValue,
-                            phoneNumber: data.phoneNumber?.validatedValue,
-                            title: data.title?.validatedValue,
-                            ...('customFields' in data && data.customFields?.validatedValue
-                                ? { customFields: data.customFields.validatedValue }
-                                : {}),
+                            emailAddress: data.emailAddress,
+                            firstName: data.firstName,
+                            lastName: data.lastName,
+                            phoneNumber: data.phoneNumber,
+                            title: data.title,
+                            ...('customFields' in data && data.customFields ? { customFields: data.customFields } : {}),
                         };
                         if (!sharedInput.emailAddress || !sharedInput.firstName || !sharedInput.lastName)
                             return;

package/dist/pages/customers/_components/AddressForm.js

@@ -1,77 +1,65 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { forwardRef, useEffect, useImperativeHandle } from 'react';
-import { Input, SimpleSelect, useGFFLP, useServer, EntityCustomFields, useTranslation, } from '@deenruv/react-ui-devkit';
+import { Input, SimpleSelect, useDeenruvForm, z, useServer, EntityCustomFields, useTranslation, } from '@deenruv/react-ui-devkit';
 export const AddressForm = forwardRef(({ initialValues: address, addressId, onInputChange }, ref) => {
     const { t } = useTranslation('customers');
     const countries = useServer((p) => p.countries);
-    const { state, setField, checkIfAllFieldsAreValid } = useGFFLP('CreateAddressInput', 'city', 'company', 'countryCode', 'fullName', 'phoneNumber', 'postalCode', 'streetLine1', 'streetLine2', 'province', 'customFields')({
-        fullName: {
-            initialValue: address?.fullName,
-            validate: (v) => {
-                if (!v || v === '')
-                    return [t('selectAddress.nameRequired')];
-            },
-        },
-        company: { initialValue: address?.company },
-        streetLine1: {
-            initialValue: address?.streetLine1,
-            validate: (v) => {
-                if (!v || v === '')
-                    return [t('selectAddress.streetRequired')];
-            },
-        },
-        streetLine2: { initialValue: address?.streetLine2 },
-        postalCode: {
-            initialValue: address?.postalCode,
-            validate: (v) => {
-                if (!v || v === '')
-                    return [t('selectAddress.postalCodeRequired')];
-            },
-        },
-        countryCode: {
-            initialValue: address?.country.code,
-            validate: (v) => {
-                if (!v || v === '')
-                    return [t('selectAddress.countryRequired')];
-            },
-        },
-        phoneNumber: {
-            initialValue: address?.phoneNumber,
-            validate: (v) => {
-                if (!v || v === '')
-                    return [t('selectAddress.phoneNumberRequired')];
-            },
-        },
-        city: {
-            initialValue: address?.city,
-            validate: (v) => {
-                if (!v || v === '')
-                    return [t('selectAddress.cityRequired')];
-            },
+    const addressSchema = z.object({
+        fullName: z.string().min(1, t('selectAddress.nameRequired')),
+        company: z.string().default(''),
+        streetLine1: z.string().min(1, t('selectAddress.streetRequired')),
+        streetLine2: z.string().default(''),
+        postalCode: z.string().min(1, t('selectAddress.postalCodeRequired')),
+        countryCode: z.string().min(1, t('selectAddress.countryRequired')),
+        phoneNumber: z.string().min(1, t('selectAddress.phoneNumberRequired')),
+        city: z.string().min(1, t('selectAddress.cityRequired')),
+        province: z.string().default(''),
+        customFields: z.record(z.string(), z.any()).default({}),
+    });
+    const form = useDeenruvForm({
+        schema: addressSchema,
+        defaultValues: {
+            fullName: address?.fullName ?? '',
+            company: address?.company ?? '',
+            streetLine1: address?.streetLine1 ?? '',
+            streetLine2: address?.streetLine2 ?? '',
+            postalCode: address?.postalCode ?? '',
+            countryCode: address?.country?.code ?? '',
+            phoneNumber: address?.phoneNumber ?? '',
+            city: address?.city ?? '',
+            province: address?.province ?? '',
+            customFields: {},
         },
-        province: { initialValue: address?.province },
     });
+    const formValues = form.watch();
     useImperativeHandle(ref, () => ({
-        validate: checkIfAllFieldsAreValid,
+        validate: () => {
+            // trigger is async but ref API expects sync boolean — use formState.isValid
+            // which is reliable because mode is 'onTouched' and all fields have been interacted with
+            void form.trigger();
+            return form.formState.isValid;
+        },
     }));
     useEffect(() => {
         const input = {
-            countryCode: state.countryCode.validatedValue,
-            streetLine1: state.streetLine1.validatedValue,
-            streetLine2: state.streetLine2.validatedValue,
-            city: state.city.validatedValue,
-            company: state.company.validatedValue,
-            fullName: state.fullName.validatedValue,
-            phoneNumber: state.phoneNumber.validatedValue,
-            postalCode: state.postalCode.validatedValue,
-            province: state.province?.validatedValue,
-            ...(state.customFields?.validatedValue ? { customFields: state.customFields?.validatedValue } : {}),
+            countryCode: formValues.countryCode,
+            streetLine1: formValues.streetLine1,
+            streetLine2: formValues.streetLine2,
+            city: formValues.city,
+            company: formValues.company,
+            fullName: formValues.fullName,
+            phoneNumber: formValues.phoneNumber,
+            postalCode: formValues.postalCode,
+            province: formValues.province,
+            ...(formValues.customFields && Object.keys(formValues.customFields).length > 0
+                ? { customFields: formValues.customFields }
+                : {}),
         };
         onInputChange(input);
-    }, [state]);
-    return (_jsxs("form", { className: "flex flex-col gap-3 overflow-auto", children: [_jsx(Input, { label: t('selectAddress.inputNameLabel'), placeholder: t('selectAddress.inputNamePlaceholder'), value: state.fullName?.value ?? undefined, defaultValue: state?.fullName?.value ?? undefined, onChange: (e) => setField('fullName', e.target.value), errors: state.fullName?.errors, required: true }), _jsx(Input, { label: t('selectAddress.inputCompanyLabel'), placeholder: t('selectAddress.inputCompanyPlaceholder'), value: state.company?.value ?? undefined, defaultValue: state?.company?.value ?? undefined, onChange: (e) => setField('company', e.target.value), errors: state.company?.errors }), _jsx(Input, { label: t('selectAddress.inputStreetLabel'), placeholder: t('selectAddress.inputStreetPlaceholder'), value: state.streetLine1?.value, defaultValue: state?.streetLine1?.value, onChange: (e) => setField('streetLine1', e.target.value), errors: state.streetLine1?.errors, required: true }), _jsx(Input, { label: t('selectAddress.inputStreet2Label'), placeholder: t('selectAddress.inputStreet2Placeholder'), value: state.streetLine2?.value ?? undefined, defaultValue: state?.streetLine2?.value ?? undefined, onChange: (e) => setField('streetLine2', e.target.value), errors: state.streetLine2?.errors }), _jsx(Input, { label: t('selectAddress.inputCityLabel'), placeholder: t('selectAddress.inputCityPlaceholder'), defaultValue: state?.city?.value ?? undefined, onChange: (e) => setField('city', e.target.value), errors: state.city?.errors, required: true }), _jsx(Input, { label: t('selectAddress.inputProvinceLabel'), placeholder: t('selectAddress.inputProvincePlaceholder'), defaultValue: state?.province?.value ?? undefined, onChange: (e) => setField('province', e.target.value), errors: state.province?.errors }), _jsx(Input, { label: t('selectAddress.inputPostalLabel'), placeholder: t('selectAddress.inputPostalPlaceholder'), value: state.postalCode?.value ?? undefined, defaultValue: state?.postalCode?.value ?? undefined, onChange: (e) => setField('postalCode', e.target.value), errors: state.postalCode?.errors, required: true }), _jsx(Input, { label: t('selectAddress.inputPhoneLabel'), placeholder: t('selectAddress.inputPhonePlaceholder'), value: state.phoneNumber?.value ?? undefined, defaultValue: state?.phoneNumber?.value ?? undefined, onChange: (e) => setField('phoneNumber', e.target.value), errors: state.phoneNumber?.errors, required: true }), _jsx(SimpleSelect, { label: t('selectAddress.countrySelectLabel'), options: countries.map((c) => ({ label: c.name, value: c.code })), value: state.countryCode?.value, onValueChange: (value) => setField('countryCode', value), errors: state.countryCode?.errors, required: true }), addressId && (_jsx(EntityCustomFields, { id: addressId, entityName: "address", hideButton: true, initialValues: address && 'customFields' in address
+    }, [formValues]);
+    return (_jsxs("form", { className: "flex flex-col gap-3 overflow-auto", children: [_jsx(Input, { label: t('selectAddress.inputNameLabel'), placeholder: t('selectAddress.inputNamePlaceholder'), value: formValues.fullName ?? undefined, defaultValue: formValues.fullName ?? undefined, onChange: (e) => form.setField('fullName', e.target.value), errors: form.formState.errors.fullName?.message ? [form.formState.errors.fullName.message] : undefined, required: true }), _jsx(Input, { label: t('selectAddress.inputCompanyLabel'), placeholder: t('selectAddress.inputCompanyPlaceholder'), value: formValues.company ?? undefined, defaultValue: formValues.company ?? undefined, onChange: (e) => form.setField('company', e.target.value), errors: form.formState.errors.company?.message ? [form.formState.errors.company.message] : undefined }), _jsx(Input, { label: t('selectAddress.inputStreetLabel'), placeholder: t('selectAddress.inputStreetPlaceholder'), value: formValues.streetLine1, defaultValue: formValues.streetLine1, onChange: (e) => form.setField('streetLine1', e.target.value), errors: form.formState.errors.streetLine1?.message ? [form.formState.errors.streetLine1.message] : undefined, required: true }), _jsx(Input, { label: t('selectAddress.inputStreet2Label'), placeholder: t('selectAddress.inputStreet2Placeholder'), value: formValues.streetLine2 ?? undefined, defaultValue: formValues.streetLine2 ?? undefined, onChange: (e) => form.setField('streetLine2', e.target.value), errors: form.formState.errors.streetLine2?.message ? [form.formState.errors.streetLine2.message] : undefined }), _jsx(Input, { label: t('selectAddress.inputCityLabel'), placeholder: t('selectAddress.inputCityPlaceholder'), defaultValue: formValues.city ?? undefined, onChange: (e) => form.setField('city', e.target.value), errors: form.formState.errors.city?.message ? [form.formState.errors.city.message] : undefined, required: true }), _jsx(Input, { label: t('selectAddress.inputProvinceLabel'), placeholder: t('selectAddress.inputProvincePlaceholder'), defaultValue: formValues.province ?? undefined, onChange: (e) => form.setField('province', e.target.value), errors: form.formState.errors.province?.message ? [form.formState.errors.province.message] : undefined }), _jsx(Input, { label: t('selectAddress.inputPostalLabel'), placeholder: t('selectAddress.inputPostalPlaceholder'), value: formValues.postalCode ?? undefined, defaultValue: formValues.postalCode ?? undefined, onChange: (e) => form.setField('postalCode', e.target.value), errors: form.formState.errors.postalCode?.message ? [form.formState.errors.postalCode.message] : undefined, required: true }), _jsx(Input, { label: t('selectAddress.inputPhoneLabel'), placeholder: t('selectAddress.inputPhonePlaceholder'), value: formValues.phoneNumber ?? undefined, defaultValue: formValues.phoneNumber ?? undefined, onChange: (e) => form.setField('phoneNumber', e.target.value), errors: form.formState.errors.phoneNumber?.message ? [form.formState.errors.phoneNumber.message] : undefined, required: true }), _jsx(SimpleSelect, { label: t('selectAddress.countrySelectLabel'), options: countries.map((c) => ({ label: c.name, value: c.code })), value: formValues.countryCode, onValueChange: (value) => form.setField('countryCode', value), errors: form.formState.errors.countryCode?.message ? [form.formState.errors.countryCode.message] : undefined, required: true }), addressId && (_jsx(EntityCustomFields, { id: addressId, entityName: "address", hideButton: true, initialValues: address && 'customFields' in address
                     ? { customFields: address.customFields }
                     : { customFields: {} }, onChange: (cf) => {
-                    setField('customFields', cf);
+                    form.setField('customFields', cf);
                 }, additionalData: {}, withoutBorder: true }))] }));
 });

package/dist/pages/customers/_components/AddressesCard.js

@@ -5,5 +5,5 @@ import { PlusCircle } from 'lucide-react';
 import { AddressDialog } from "./AddressDialog";
 export const AddressesCard = ({ addresses, customerId, onActionCompleted }) => {
     const { t } = useTranslation('customers');
-    return (_jsx(CustomCard, { title: t('addresses.header'), icon: _jsx(CardIcons.address, {}), color: "green", bottomRight: customerId && (_jsx(AddressDialog, { customerId: customerId, onActionCompleted: onActionCompleted, children: _jsxs(Button, { variant: "secondary", className: "flex items-center gap-2", children: [_jsx(PlusCircle, {}), t('addresses.addBtn')] }) })), children: _jsx("div", { className: "flex gap-4", children: addresses?.length ? (addresses?.map((a) => _jsx(Address, { onActionCompleted: onActionCompleted, address: a, customerId: customerId }))) : (_jsx("p", { className: "w-full text-center", children: t(customerId ? 'addresses.empty' : 'addresses.createCustomerFirst') })) }) }));
+    return (_jsx(CustomCard, { title: t('addresses.header'), icon: _jsx(CardIcons.address, {}), color: "green", bottomRight: customerId && (_jsx(AddressDialog, { customerId: customerId, onActionCompleted: onActionCompleted, children: _jsxs(Button, { variant: "secondary", className: "flex items-center gap-2", children: [_jsx(PlusCircle, {}), t('addresses.addBtn')] }) })), children: _jsx("div", { className: "flex gap-4", children: addresses?.length ? (addresses?.map((a) => (_jsx(Address, { onActionCompleted: onActionCompleted, address: a, customerId: customerId }, a.id)))) : (_jsx("p", { className: "w-full text-center", children: t(customerId ? 'addresses.empty' : 'addresses.createCustomerFirst') })) }) }));
 };

package/dist/pages/customers/_components/CustomerDetailView.js

@@ -16,18 +16,18 @@ export const CustomerDetailView = () => {
     const [addresses, setAddresses] = useState([]);
     const contentLng = useSettings((p) => p.translationsLanguage);
     const { form, entity, id, fetchEntity } = useDetailView('customers-detail-view', ...CUSTOMER_FORM_KEYS);
-    const { base: { setField, state }, } = form;
+    const { base } = form;
     const handleFetchEntity = useCallback(async () => {
         const res = await fetchEntity();
         if (!res)
             return;
-        setField('title', res.title);
-        setField('phoneNumber', res.phoneNumber);
-        setField('firstName', res.firstName);
-        setField('lastName', res.lastName);
-        setField('emailAddress', res.emailAddress);
+        base.setField('title', res.title);
+        base.setField('phoneNumber', res.phoneNumber);
+        base.setField('firstName', res.firstName);
+        base.setField('lastName', res.lastName);
+        base.setField('emailAddress', res.emailAddress);
         if ('customFields' in res)
-            setField('customFields', res.customFields);
+            base.setField('customFields', res.customFields);
         setAddresses(res.addresses);
     }, []);
     useEffect(() => {
@@ -35,7 +35,7 @@ export const CustomerDetailView = () => {
             await handleFetchEntity();
         })();
     }, [contentLng]);
-    return (_jsx("main", { className: "min-h-96", children: _jsxs("div", { className: "flex flex-col gap-3", children: [_jsx(PersonalDataCard, { setField: setField, state: state }), _jsx(DetailViewMarker, { position: 'customers-detail-view' }), _jsx(EntityCustomFields, { entityName: "customer", id: id, hideButton: true, additionalData: {}, initialValues: entity && 'customFields' in entity ? { customFields: entity.customFields } : { customFields: {} }, onChange: (cf) => {
-                        setField('customFields', cf);
+    return (_jsx("main", { className: "min-h-96", children: _jsxs("div", { className: "flex flex-col gap-3", children: [_jsx(PersonalDataCard, { setField: base.setField, state: base }), _jsx(DetailViewMarker, { position: 'customers-detail-view' }), _jsx(EntityCustomFields, { entityName: "customer", id: id, hideButton: true, additionalData: {}, initialValues: entity && 'customFields' in entity ? { customFields: entity.customFields } : { customFields: {} }, onChange: (cf) => {
+                        base.setField('customFields', cf);
                     } }), id && _jsx(AddressesCard, { addresses: addresses, customerId: id, onActionCompleted: handleFetchEntity })] }) }));
 };

package/dist/pages/dashboard/Dashboard.js

@@ -1,10 +1,11 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { DashboardWidgets, useWidgetsStore, DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuLabel, DropdownMenuSeparator, DropdownMenuGroup, Button, DropdownMenuCheckboxItem, useTranslation, } from '@deenruv/react-ui-devkit';
+import { useShallow } from 'zustand/react/shallow';
 export const Dashboard = () => {
     const { t } = useTranslation('common');
-    const { widgets, setShowWidget } = useWidgetsStore((state) => ({
+    const { widgets, setShowWidget } = useWidgetsStore(useShallow((state) => ({
         widgets: state.widgets,
         setShowWidget: state.setShowWidget,
-    }));
+    })));
     return (_jsxs("div", { className: "px-4 pt-2 pb-4 md:px-8 md:py-4", children: [_jsx("div", { className: "mb-4 flex justify-end", children: !!widgets.length && (_jsxs(DropdownMenu, { children: [_jsx(DropdownMenuTrigger, { asChild: true, children: _jsx(Button, { variant: "outline", children: t('widgets.add') }) }), _jsxs(DropdownMenuContent, { className: "w-42", children: [_jsx(DropdownMenuLabel, { children: t('widgets.title') }), _jsx(DropdownMenuSeparator, {}), _jsx(DropdownMenuGroup, { children: widgets.map((widget) => (_jsx(DropdownMenuCheckboxItem, { checked: widget.visible, onCheckedChange: (checked) => setShowWidget(widget.id, checked), children: widget.name }, widget.id))) })] })] })) }), _jsx(DashboardWidgets, {})] }));
 };

package/dist/pages/extensions/Extensions.js

@@ -1,9 +1,7 @@
-'use client';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useMemo, useState } from 'react';
-import { Badge, Button, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuLabel, DropdownMenuSeparator, DropdownMenuTrigger, Input, PageBlock, Switch, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, usePluginStore, } from '@deenruv/react-ui-devkit';
-import { BarChart3, Box, Check, ChevronDown, Code2, Cog, Download, FileCode, Filter, Grid3X3, Info, LayoutDashboard, List, MessageSquare, Puzzle, RefreshCw, Search, Settings, Table, X, } from 'lucide-react';
-import { Separator } from '@radix-ui/react-dropdown-menu';
+import { Badge, Button, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuLabel, DropdownMenuSeparator, DropdownMenuTrigger, Input, PageBlock, Separator, Switch, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, usePluginStore, } from '@deenruv/react-ui-devkit';
+import { BarChart3, Box, Check, ChevronDown, Code2, Cog, FileCode, Filter, Grid3X3, Info, LayoutDashboard, List, MessageSquare, Puzzle, RefreshCw, Search, Settings, Table, X, } from 'lucide-react';
 const getCategoryIcon = (category) => {
     switch (category) {
         case 'visualization':
@@ -35,16 +33,16 @@ const getStatusBadge = (status) => {
     }
 };
 export const Extensions = () => {
-    const { plugins: _plugins, changePluginStatus } = usePluginStore();
+    const { allPlugins: _plugins, changePluginStatus } = usePluginStore();
     const [searchTerm, setSearchTerm] = useState('');
     const [categoryFilter, setCategoryFilter] = useState('all');
     const [statusFilter, setStatusFilter] = useState('all');
     const [view, setView] = useState('grid');
     const plugins = useMemo(() => _plugins.map((plugin) => ({
         ...plugin,
-        description: 'No description provided',
-        category: 'unknown',
-        author: 'Unknown',
+        description: plugin.description || 'No description provided',
+        category: plugin.category || 'unknown',
+        author: plugin.author || 'Deenruv',
     })), [_plugins]);
     const filteredPlugins = plugins.filter((plugin) => {
         const matchesSearch = plugin.name.toLowerCase().includes(searchTerm.toLowerCase()) ||
@@ -54,11 +52,12 @@ export const Extensions = () => {
         return matchesSearch && matchesCategory && matchesStatus;
     });
     const totalPlugins = plugins.length;
-    const activePlugins = plugins.filter((p) => p).length;
+    const activePlugins = plugins.filter((p) => p.status === 'active').length;
+    const inactivePlugins = plugins.length - activePlugins;
     const totalWidgets = plugins.reduce((sum, plugin) => sum + (plugin.widgets?.length || 0), 0);
     const totalComponents = plugins.reduce((sum, plugin) => sum + (plugin.components?.length || 0), 0);
     const categories = ['all', ...new Set(plugins.map((p) => p.category))];
-    return (_jsx(PageBlock, { children: _jsxs("div", { className: "flex flex-col gap-6", children: [_jsx("div", { className: "flex flex-col gap-2", children: _jsxs("div", { className: "flex items-center justify-between", children: [_jsxs("div", { children: [_jsx("h1", { className: "text-3xl font-bold tracking-tight", children: "Extensions Dashboard" }), _jsx("p", { className: "mt-1 text-muted-foreground", children: "Manage and monitor your installed plugins" })] }), _jsxs(Button, { children: [_jsx(Download, { className: "mr-2 size-4" }), "Install New Extension"] })] }) }), _jsxs("div", { className: "grid gap-4 md:grid-cols-2 lg:grid-cols-4", children: [_jsxs(Card, { children: [_jsxs(CardHeader, { className: "flex flex-row items-center justify-between space-y-0 pb-2", children: [_jsx(CardTitle, { className: "text-sm font-medium", children: "Total Extensions" }), _jsx(Puzzle, { className: "size-4 text-muted-foreground" })] }), _jsxs(CardContent, { children: [_jsx("div", { className: "text-2xl font-bold", children: totalPlugins }), _jsxs("p", { className: "text-xs text-muted-foreground", children: [activePlugins, " active, ", totalPlugins - activePlugins, " inactive"] })] })] }), _jsxs(Card, { children: [_jsxs(CardHeader, { className: "flex flex-row items-center justify-between space-y-0 pb-2", children: [_jsx(CardTitle, { className: "text-sm font-medium", children: "Total Widgets" }), _jsx(Grid3X3, { className: "size-4 text-muted-foreground" })] }), _jsxs(CardContent, { children: [_jsx("div", { className: "text-2xl font-bold", children: totalWidgets }), _jsxs("p", { className: "text-xs text-muted-foreground", children: ["Across ", plugins.filter((p) => (p.widgets?.length || 0) > 0).length, " extensions"] })] })] }), _jsxs(Card, { children: [_jsxs(CardHeader, { className: "flex flex-row items-center justify-between space-y-0 pb-2", children: [_jsx(CardTitle, { className: "text-sm font-medium", children: "Total Components" }), _jsx(Code2, { className: "size-4 text-muted-foreground" })] }), _jsxs(CardContent, { children: [_jsx("div", { className: "text-2xl font-bold", children: totalComponents }), _jsxs("p", { className: "text-xs text-muted-foreground", children: ["Across ", plugins.filter((p) => (p.components?.length || 0) > 0).length, " extensions"] })] })] }), _jsxs(Card, { children: [_jsxs(CardHeader, { className: "flex flex-row items-center justify-between space-y-0 pb-2", children: [_jsx(CardTitle, { className: "text-sm font-medium", children: "Categories" }), _jsx(LayoutDashboard, { className: "size-4 text-muted-foreground" })] }), _jsxs(CardContent, { children: [_jsx("div", { className: "text-2xl font-bold", children: categories.length - 1 }), _jsx("p", { className: "text-xs text-muted-foreground", children: "Different extension types" })] })] })] }), _jsxs("div", { className: "flex flex-col gap-4 sm:flex-row sm:items-center sm:justify-between", children: [_jsxs("div", { className: "flex flex-1 items-center space-x-2", children: [_jsx(Input, { placeholder: "Search extensions...", className: "max-w-sm", value: searchTerm, onChange: (e) => setSearchTerm(e.target.value), startAdornment: _jsx(Search, { className: "size-4 text-muted-foreground" }) }), _jsxs(DropdownMenu, { children: [_jsx(DropdownMenuTrigger, { asChild: true, children: _jsxs(Button, { variant: "outline", className: "ml-auto", children: [_jsx(Filter, { className: "mr-2 size-4" }), "Filter", _jsx(ChevronDown, { className: "ml-2 size-4" })] }) }), _jsxs(DropdownMenuContent, { align: "end", className: "w-[200px]", children: [_jsx(DropdownMenuLabel, { children: "Filter by Category" }), _jsx(DropdownMenuSeparator, {}), categories.map((category) => (_jsxs(DropdownMenuItem, { onClick: () => setCategoryFilter(category), className: "flex items-center justify-between", children: [_jsx("span", { className: "capitalize", children: category === 'all' ? 'All Categories' : category }), categoryFilter === category && _jsx(Check, { className: "size-4" })] }, category))), _jsx(DropdownMenuSeparator, {}), _jsx(DropdownMenuLabel, { children: "Filter by Status" }), _jsx(DropdownMenuSeparator, {}), _jsxs(DropdownMenuItem, { onClick: () => setStatusFilter('all'), className: "flex items-center justify-between", children: ["All Statuses", statusFilter === 'all' && _jsx(Check, { className: "size-4" })] }), _jsxs(DropdownMenuItem, { onClick: () => setStatusFilter('active'), className: "flex items-center justify-between", children: ["Active", statusFilter === 'active' && _jsx(Check, { className: "size-4" })] }), _jsxs(DropdownMenuItem, { onClick: () => setStatusFilter('inactive'), className: "flex items-center justify-between", children: ["Inactive", statusFilter === 'inactive' && _jsx(Check, { className: "size-4" })] }), _jsxs(DropdownMenuItem, { onClick: () => setStatusFilter('beta'), className: "flex items-center justify-between", children: ["Beta", statusFilter === 'beta' && _jsx(Check, { className: "size-4" })] })] })] })] }), _jsxs("div", { className: "flex items-center space-x-2", children: [_jsx(Button, { variant: view === 'grid' ? 'default' : 'outline', size: "icon", onClick: () => setView('grid'), className: "size-8", children: _jsx(Grid3X3, { className: "size-4" }) }), _jsx(Button, { variant: view === 'list' ? 'default' : 'outline', size: "icon", onClick: () => setView('list'), className: "size-8", children: _jsx(List, { className: "size-4" }) })] })] }), (categoryFilter !== 'all' || statusFilter !== 'all' || searchTerm) && (_jsxs("div", { className: "flex flex-wrap gap-2", children: [categoryFilter !== 'all' && (_jsxs(Badge, { variant: "secondary", className: "flex items-center gap-1", children: ["Category: ", _jsx("span", { className: "capitalize", children: categoryFilter }), _jsx(Button, { variant: "ghost", size: "icon", className: "ml-1 size-4 p-0", onClick: () => setCategoryFilter('all'), children: _jsx(X, { className: "size-3" }) })] })), statusFilter !== 'all' && (_jsxs(Badge, { variant: "secondary", className: "flex items-center gap-1", children: ["Status: ", _jsx("span", { className: "capitalize", children: statusFilter }), _jsx(Button, { variant: "ghost", size: "icon", className: "ml-1 size-4 p-0", onClick: () => setStatusFilter('all'), children: _jsx(X, { className: "size-3" }) })] })), searchTerm && (_jsxs(Badge, { variant: "secondary", className: "flex items-center gap-1", children: ["Search: ", searchTerm, _jsx(Button, { variant: "ghost", size: "icon", className: "ml-1 size-4 p-0", onClick: () => setSearchTerm(''), children: _jsx(X, { className: "size-3" }) })] })), _jsx(Button, { variant: "ghost", size: "sm", className: "h-6 text-xs", onClick: () => {
+    return (_jsx(PageBlock, { children: _jsxs("div", { className: "flex flex-col gap-6", children: [_jsx("div", { className: "flex flex-col gap-2", children: _jsx("div", { className: "flex items-center justify-between", children: _jsxs("div", { children: [_jsx("h1", { className: "text-3xl font-bold tracking-tight", children: "Extensions Dashboard" }), _jsx("p", { className: "mt-1 text-muted-foreground", children: "Manage and monitor your installed plugins" })] }) }) }), _jsxs("div", { className: "grid gap-4 md:grid-cols-2 lg:grid-cols-4", children: [_jsxs(Card, { children: [_jsxs(CardHeader, { className: "flex flex-row items-center justify-between space-y-0 pb-2", children: [_jsx(CardTitle, { className: "text-sm font-medium", children: "Total Extensions" }), _jsx(Puzzle, { className: "size-4 text-muted-foreground" })] }), _jsxs(CardContent, { children: [_jsx("div", { className: "text-2xl font-bold", children: totalPlugins }), _jsxs("p", { className: "text-xs text-muted-foreground", children: [activePlugins, " active, ", inactivePlugins, " inactive"] })] })] }), _jsxs(Card, { children: [_jsxs(CardHeader, { className: "flex flex-row items-center justify-between space-y-0 pb-2", children: [_jsx(CardTitle, { className: "text-sm font-medium", children: "Total Widgets" }), _jsx(Grid3X3, { className: "size-4 text-muted-foreground" })] }), _jsxs(CardContent, { children: [_jsx("div", { className: "text-2xl font-bold", children: totalWidgets }), _jsxs("p", { className: "text-xs text-muted-foreground", children: ["Across ", plugins.filter((p) => (p.widgets?.length || 0) > 0).length, " extensions"] })] })] }), _jsxs(Card, { children: [_jsxs(CardHeader, { className: "flex flex-row items-center justify-between space-y-0 pb-2", children: [_jsx(CardTitle, { className: "text-sm font-medium", children: "Total Components" }), _jsx(Code2, { className: "size-4 text-muted-foreground" })] }), _jsxs(CardContent, { children: [_jsx("div", { className: "text-2xl font-bold", children: totalComponents }), _jsxs("p", { className: "text-xs text-muted-foreground", children: ["Across ", plugins.filter((p) => (p.components?.length || 0) > 0).length, " extensions"] })] })] }), _jsxs(Card, { children: [_jsxs(CardHeader, { className: "flex flex-row items-center justify-between space-y-0 pb-2", children: [_jsx(CardTitle, { className: "text-sm font-medium", children: "Categories" }), _jsx(LayoutDashboard, { className: "size-4 text-muted-foreground" })] }), _jsxs(CardContent, { children: [_jsx("div", { className: "text-2xl font-bold", children: categories.length - 1 }), _jsx("p", { className: "text-xs text-muted-foreground", children: "Different extension types" })] })] })] }), _jsxs("div", { className: "flex flex-col gap-4 sm:flex-row sm:items-center sm:justify-between", children: [_jsxs("div", { className: "flex flex-1 items-center space-x-2", children: [_jsx(Input, { placeholder: "Search extensions...", className: "max-w-sm", value: searchTerm, onChange: (e) => setSearchTerm(e.target.value), startAdornment: _jsx(Search, { className: "size-4 text-muted-foreground" }) }), _jsxs(DropdownMenu, { children: [_jsx(DropdownMenuTrigger, { asChild: true, children: _jsxs(Button, { variant: "outline", className: "ml-auto", children: [_jsx(Filter, { className: "mr-2 size-4" }), "Filter", _jsx(ChevronDown, { className: "ml-2 size-4" })] }) }), _jsxs(DropdownMenuContent, { align: "end", className: "w-[200px]", children: [_jsx(DropdownMenuLabel, { children: "Filter by Category" }), _jsx(DropdownMenuSeparator, {}), categories.map((category) => (_jsxs(DropdownMenuItem, { onClick: () => setCategoryFilter(category), className: "flex items-center justify-between", children: [_jsx("span", { className: "capitalize", children: category === 'all' ? 'All Categories' : category }), categoryFilter === category && _jsx(Check, { className: "size-4" })] }, category))), _jsx(DropdownMenuSeparator, {}), _jsx(DropdownMenuLabel, { children: "Filter by Status" }), _jsx(DropdownMenuSeparator, {}), _jsxs(DropdownMenuItem, { onClick: () => setStatusFilter('all'), className: "flex items-center justify-between", children: ["All Statuses", statusFilter === 'all' && _jsx(Check, { className: "size-4" })] }), _jsxs(DropdownMenuItem, { onClick: () => setStatusFilter('active'), className: "flex items-center justify-between", children: ["Active", statusFilter === 'active' && _jsx(Check, { className: "size-4" })] }), _jsxs(DropdownMenuItem, { onClick: () => setStatusFilter('inactive'), className: "flex items-center justify-between", children: ["Inactive", statusFilter === 'inactive' && _jsx(Check, { className: "size-4" })] })] })] })] }), _jsxs("div", { className: "flex items-center space-x-2", children: [_jsx(Button, { variant: view === 'grid' ? 'default' : 'outline', size: "icon", onClick: () => setView('grid'), className: "size-8", children: _jsx(Grid3X3, { className: "size-4" }) }), _jsx(Button, { variant: view === 'list' ? 'default' : 'outline', size: "icon", onClick: () => setView('list'), className: "size-8", children: _jsx(List, { className: "size-4" }) })] })] }), (categoryFilter !== 'all' || statusFilter !== 'all' || searchTerm) && (_jsxs("div", { className: "flex flex-wrap gap-2", children: [categoryFilter !== 'all' && (_jsxs(Badge, { variant: "secondary", className: "flex items-center gap-1", children: ["Category: ", _jsx("span", { className: "capitalize", children: categoryFilter }), _jsx(Button, { variant: "ghost", size: "icon", className: "ml-1 size-4 p-0", onClick: () => setCategoryFilter('all'), children: _jsx(X, { className: "size-3" }) })] })), statusFilter !== 'all' && (_jsxs(Badge, { variant: "secondary", className: "flex items-center gap-1", children: ["Status: ", _jsx("span", { className: "capitalize", children: statusFilter }), _jsx(Button, { variant: "ghost", size: "icon", className: "ml-1 size-4 p-0", onClick: () => setStatusFilter('all'), children: _jsx(X, { className: "size-3" }) })] })), searchTerm && (_jsxs(Badge, { variant: "secondary", className: "flex items-center gap-1", children: ["Search: ", searchTerm, _jsx(Button, { variant: "ghost", size: "icon", className: "ml-1 size-4 p-0", onClick: () => setSearchTerm(''), children: _jsx(X, { className: "size-3" }) })] })), _jsx(Button, { variant: "ghost", size: "sm", className: "h-6 text-xs", onClick: () => {
                                 setCategoryFilter('all');
                                 setStatusFilter('all');
                                 setSearchTerm('');
@@ -66,9 +65,9 @@ export const Extensions = () => {
                                 setCategoryFilter('all');
                                 setStatusFilter('all');
                                 setSearchTerm('');
-                            }, children: "Reset filters" })] })) : view === 'grid' ? (_jsx("div", { className: "grid gap-4 sm:grid-cols-2 lg:grid-cols-3", children: filteredPlugins.map((plugin) => (_jsxs(Card, { className: "overflow-hidden", children: [_jsxs(CardHeader, { className: "pb-2", children: [_jsxs("div", { className: "flex items-center justify-between", children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx("div", { className: "rounded-md bg-primary/10 p-2", children: getCategoryIcon(plugin.category) }), _jsx(CardTitle, { className: "text-lg", children: plugin.name })] }), getStatusBadge(plugin.status)] }), _jsx(CardDescription, { className: "mt-2", children: plugin.description })] }), _jsxs(CardContent, { className: "pb-2", children: [_jsxs("div", { className: "grid grid-cols-2 gap-2 text-sm", children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx("span", { className: "text-muted-foreground", children: "Version:" }), _jsx("span", { children: plugin.version })] }), _jsxs("div", { className: "flex items-center gap-2", children: [_jsx("span", { className: "text-muted-foreground", children: "Author:" }), _jsx("span", { children: plugin.author })] })] }), _jsx(Separator, { className: "my-3" }), _jsxs("div", { className: "grid grid-cols-4 gap-2 text-center text-sm", children: [_jsxs("div", { children: [_jsx("div", { className: "font-medium", children: plugin.tables?.length }), _jsx("div", { className: "text-xs text-muted-foreground", children: "Tables" })] }), _jsxs("div", { children: [_jsx("div", { className: "font-medium", children: plugin.tabs?.length }), _jsx("div", { className: "text-xs text-muted-foreground", children: "Tabs" })] }), _jsxs("div", { children: [_jsx("div", { className: "font-medium", children: plugin.components?.length }), _jsx("div", { className: "text-xs text-muted-foreground", children: "Components" })] }), _jsxs("div", { children: [_jsx("div", { className: "font-medium", children: plugin.widgets?.length }), _jsx("div", { className: "text-xs text-muted-foreground", children: "Widgets" })] })] })] }), _jsxs(CardFooter, { className: "flex justify-between pt-2", children: [_jsx(TooltipProvider, { children: _jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsx(Button, { variant: "ghost", size: "icon", className: "size-8", children: _jsx(Info, { className: "size-4" }) }) }), _jsx(TooltipContent, { children: "View details" })] }) }), _jsx("div", { className: "flex gap-2", children: _jsxs(Switch, { checked: plugin.status === 'active', onCheckedChange: (checked) => {
+                            }, children: "Reset filters" })] })) : view === 'grid' ? (_jsx("div", { className: "grid gap-4 sm:grid-cols-2 lg:grid-cols-3", children: filteredPlugins.map((plugin) => (_jsxs(Card, { className: "overflow-hidden", children: [_jsxs(CardHeader, { className: "pb-2", children: [_jsxs("div", { className: "flex items-center justify-between", children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx("div", { className: "rounded-md bg-primary/10 p-2", children: getCategoryIcon(plugin.category) }), _jsx(CardTitle, { className: "text-lg", children: plugin.name })] }), getStatusBadge(plugin.status)] }), _jsx(CardDescription, { className: "mt-2", children: plugin.description })] }), _jsxs(CardContent, { className: "pb-2", children: [_jsxs("div", { className: "grid grid-cols-2 gap-2 text-sm", children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx("span", { className: "text-muted-foreground", children: "Version:" }), _jsx("span", { children: plugin.version })] }), _jsxs("div", { className: "flex items-center gap-2", children: [_jsx("span", { className: "text-muted-foreground", children: "Author:" }), _jsx("span", { children: plugin.author })] })] }), _jsx(Separator, { className: "my-3" }), _jsxs("div", { className: "grid grid-cols-4 gap-2 text-center text-sm", children: [_jsxs("div", { children: [_jsx("div", { className: "font-medium", children: plugin.tables?.length || 0 }), _jsx("div", { className: "text-xs text-muted-foreground", children: "Tables" })] }), _jsxs("div", { children: [_jsx("div", { className: "font-medium", children: plugin.tabs?.length || 0 }), _jsx("div", { className: "text-xs text-muted-foreground", children: "Tabs" })] }), _jsxs("div", { children: [_jsx("div", { className: "font-medium", children: plugin.components?.length || 0 }), _jsx("div", { className: "text-xs text-muted-foreground", children: "Components" })] }), _jsxs("div", { children: [_jsx("div", { className: "font-medium", children: plugin.widgets?.length || 0 }), _jsx("div", { className: "text-xs text-muted-foreground", children: "Widgets" })] })] })] }), _jsxs(CardFooter, { className: "flex justify-between pt-2", children: [_jsx(TooltipProvider, { children: _jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsx(Button, { variant: "ghost", size: "icon", className: "size-8", children: _jsx(Info, { className: "size-4" }) }) }), _jsx(TooltipContent, { children: "View details" })] }) }), _jsx("div", { className: "flex gap-2", children: _jsx(Switch, { checked: plugin.status === 'active', onCheckedChange: (checked) => {
                                                 changePluginStatus(plugin.name, checked ? 'active' : 'inactive');
-                                            }, className: "h-6 w-11", children: [_jsx("span", { className: "sr-only", children: "Toggle plugin status" }), _jsx("span", { className: "absolute top-0 left-0 size-6 rounded-full bg-primary transition-transform duration-200 ease-in-out" })] }) })] })] }, plugin.name))) })) : (_jsxs("div", { className: "rounded-md border", children: [_jsxs("div", { className: "grid grid-cols-12 gap-4 p-4 font-medium", children: [_jsx("div", { className: "col-span-4", children: "Name" }), _jsx("div", { className: "col-span-3", children: "Author" }), _jsx("div", { className: "col-span-1 text-center", children: "Version" }), _jsx("div", { className: "col-span-1 text-center", children: "Status" }), _jsx("div", { className: "col-span-3 text-right", children: "Actions" })] }), _jsx(Separator, {}), filteredPlugins.map((plugin, index) => (_jsxs("div", { children: [_jsxs("div", { className: "grid grid-cols-12 items-center gap-4 p-4", children: [_jsx("div", { className: "col-span-4", children: _jsxs("div", { className: "flex items-center gap-3", children: [_jsx("div", { className: "rounded-md bg-primary/10 p-2", children: getCategoryIcon(plugin.category) }), _jsxs("div", { children: [_jsx("div", { className: "font-medium", children: plugin.name }), _jsx("div", { className: "text-xs text-muted-foreground", children: plugin.description })] })] }) }), _jsx("div", { className: "col-span-3", children: plugin.author }), _jsx("div", { className: "col-span-1 text-center", children: plugin.version }), _jsx("div", { className: "col-span-1 text-center", children: getStatusBadge(plugin.status) }), _jsxs("div", { className: "col-span-3 flex justify-end gap-2", children: [_jsxs(Button, { variant: "outline", size: "sm", children: [_jsx(Settings, { className: "mr-2 size-3" }), "Configure"] }), _jsxs(Switch, { checked: plugin.status === 'active', onCheckedChange: (checked) => {
+                                            } }) })] })] }, plugin.name))) })) : (_jsxs("div", { className: "rounded-md border", children: [_jsxs("div", { className: "grid grid-cols-12 gap-4 p-4 font-medium", children: [_jsx("div", { className: "col-span-4", children: "Name" }), _jsx("div", { className: "col-span-3", children: "Author" }), _jsx("div", { className: "col-span-1 text-center", children: "Version" }), _jsx("div", { className: "col-span-1 text-center", children: "Status" }), _jsx("div", { className: "col-span-3 text-right", children: "Actions" })] }), _jsx(Separator, {}), filteredPlugins.map((plugin, index) => (_jsxs("div", { children: [_jsxs("div", { className: "grid grid-cols-12 items-center gap-4 p-4", children: [_jsx("div", { className: "col-span-4", children: _jsxs("div", { className: "flex items-center gap-3", children: [_jsx("div", { className: "rounded-md bg-primary/10 p-2", children: getCategoryIcon(plugin.category) }), _jsxs("div", { children: [_jsx("div", { className: "font-medium", children: plugin.name }), _jsx("div", { className: "text-xs text-muted-foreground", children: plugin.description })] })] }) }), _jsx("div", { className: "col-span-3", children: plugin.author }), _jsx("div", { className: "col-span-1 text-center", children: plugin.version }), _jsx("div", { className: "col-span-1 text-center", children: getStatusBadge(plugin.status) }), _jsxs("div", { className: "col-span-3 flex justify-end gap-2", children: [_jsxs(Button, { variant: "outline", size: "sm", children: [_jsx(Settings, { className: "mr-2 size-3" }), "Configure"] }), _jsx(Switch, { checked: plugin.status === 'active', onCheckedChange: (checked) => {
                                                         changePluginStatus(plugin.name, checked ? 'active' : 'inactive');
-                                                    }, className: "h-6 w-11", children: [_jsx("span", { className: "sr-only", children: "Toggle plugin status" }), _jsx("span", { className: "absolute top-0 left-0 size-6 rounded-full bg-primary transition-transform duration-200 ease-in-out" })] })] })] }), index < filteredPlugins.length - 1 && _jsx(Separator, {})] }, plugin.name)))] }))] }) }));
+                                                    } })] })] }), index < filteredPlugins.length - 1 && _jsx(Separator, {})] }, plugin.name)))] }))] }) }));
 };

package/dist/pages/facets/Detail.js

@@ -14,15 +14,15 @@ export const FacetsDetailPage = () => {
     const [remove] = useMutation(DeleteFacetMutation);
     const { stringValidator, translationsValidator } = useValidators();
     const onSubmitHandler = useCallback((data) => {
-        if (!data.code?.validatedValue) {
+        if (!data.code) {
             throw new Error('Code is required.');
         }
         const inputData = {
-            code: data.code.validatedValue,
-            isPrivate: data.isPrivate?.value || data.isPrivate?.initialValue,
-            translations: data.translations?.validatedValue,
-            values: data.values?.validatedValue,
-            ...(data.customFields?.validatedValue ? { customFields: data.customFields?.validatedValue } : {}),
+            code: data.code,
+            isPrivate: data.isPrivate,
+            translations: data.translations,
+            values: data.values,
+            ...(data.customFields ? { customFields: data.customFields } : {}),
         };
         if (id) {
             return update({ input: { id, ...inputData } });