@arquimedes.co/eureka-forms 3.0.63 → 3.0.64-entity-step-filter

package/dist/App/AppHooks.js

@@ -158,6 +158,14 @@ export const useSetupApp = (isEmbedded, props) => {
         idCurrentAgent,
         handleConfirmed,
     ]);
+    // The host may resolve the classifiers asynchronously (the admin fetches them while the form is
+    // already mounted). `loadData` only copies the prop it saw when it ran, so patch the form whenever a
+    // new dictionary arrives — without re-running the load, which would reset what the user typed.
+    useEffect(() => {
+        if (!classifiers || !form || form.classifiers === classifiers)
+            return;
+        setForm({ ...form, classifiers });
+    }, [classifiers, form]);
     const reload = useCallback(() => {
         if (!form)
             return;

package/dist/App/AppHooks.test.js

@@ -81,6 +81,14 @@ describe('AppHooks', function () {
             expect(result.current.organization).toBeNull();
             expect(result.current.branding).toBeUndefined();
         });
+        test('picks up classifiers that arrive after the first render', async () => {
+            const classifier = { _id: 'tipo', name: 'Tipo de solicitud', children: [] };
+            const { result, rerender } = renderHookWithProviders((props) => useSetupApp(false, { formData: BaseForm, internal: true, classifiers: props.classifiers }), { initialProps: { classifiers: {} } });
+            await waitFor(() => expect(result.current.form).toBeTruthy());
+            expect(result.current.form?.classifiers).toEqual({});
+            rerender({ classifiers: { tipo: classifier } });
+            await waitFor(() => expect(result.current.form?.classifiers?.tipo).toEqual(classifier));
+        });
         test('Apikey Default', async () => {
             mocks.get.mockImplementation((a) => {
                 if (a === '/organization') {

package/dist/FormSteps/ClassifierSelectorStep/ClassifierSelectorStep.lateClassifiers.test.d.ts

@@ -0,0 +1 @@
+import '@testing-library/jest-dom';

package/dist/FormSteps/ClassifierSelectorStep/ClassifierSelectorStep.lateClassifiers.test.js

@@ -0,0 +1,70 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { render, screen } from '@testing-library/react';
+import userEvent from '@testing-library/user-event';
+import { describe, expect, it } from 'vitest';
+import '@testing-library/jest-dom';
+import { Provider } from 'react-redux';
+import { FormProvider, useForm } from 'react-hook-form';
+import { configureStore } from '@reduxjs/toolkit';
+import { EurekaFormsReducer, defaultRootState } from '../../Utils/store';
+import { RootApi } from '../../Utils/_api';
+import FormStepTypes from '../../constants/FormStepTypes';
+import { StoreContext } from '../../Utils/StoreContext';
+import FormContext, { IdFormContext } from '../../Contexts/FormContext';
+import SectionContext from '../../Contexts/SectionContext';
+import MaterialProviders from '../../Utils/MaterialProviders';
+import InternalFormStyle from '../../constants/InternalFormStyle';
+import ClassifierSelectorStep from './ClassifierSelectorStep';
+const ID_FORM = 'LATE_CLASSIFIERS_FORM';
+const step = {
+    id: 'tipo-step',
+    idSection: 'SECTION_1',
+    stepPath: ['tipo-step'],
+    type: FormStepTypes.CLASSIFIER_SELECTOR,
+    idClassifier: 'tipo',
+    label: 'Tipo de solicitud',
+    description: '',
+    searchable: true,
+    options: {},
+    required: false,
+    size: 2,
+};
+/** The project's classifiers, as the host resolves them (asynchronously) and passes them to the form. */
+const classifiers = {
+    tipo: { _id: 'tipo', name: 'Tipo de solicitud', children: ['bug', 'mejora'] },
+    bug: { _id: 'bug', name: 'Error / Bug', children: [] },
+    mejora: { _id: 'mejora', name: 'Propuesta de mejora', children: [] },
+};
+const form = {
+    firstSection: 'SECTION_1',
+    sections: {
+        SECTION_1: { id: 'SECTION_1', name: 'Sección 1', steps: ['tipo-step'], nextSection: null },
+    },
+    steps: { 'tipo-step': step },
+    confirmationMessage: { blocks: [], entityMap: {} },
+    showLink: false,
+    size: { blockSize: 200, blockNum: 4, spacingSize: 10 },
+};
+function makeStore() {
+    return configureStore({
+        reducer: { forms: EurekaFormsReducer, [RootApi.reducerPath]: RootApi.reducer },
+        preloadedState: { forms: { [ID_FORM]: { ...defaultRootState } } },
+        middleware: (getDefaultMiddleware) => getDefaultMiddleware().concat(RootApi.middleware),
+    });
+}
+function Harness({ store, formClassifiers, }) {
+    const methods = useForm({ mode: 'onTouched' });
+    return (_jsx(MaterialProviders, { formStyle: InternalFormStyle, children: _jsx(Provider, { store: store, context: StoreContext, children: _jsx(IdFormContext.Provider, { value: ID_FORM, children: _jsx(FormContext.Provider, { value: { ...form, classifiers: formClassifiers }, children: _jsx(SectionContext.Provider, { value: "SECTION_1", children: _jsx(FormProvider, { ...methods, children: _jsx(ClassifierSelectorStep, { step: step, editable: true }) }) }) }) }) }) }));
+}
+describe('ClassifierSelectorStep with classifiers that arrive after the first render', () => {
+    it('renders nothing while the classifiers are unknown, then the selector with its options', async () => {
+        const user = userEvent.setup();
+        const store = makeStore();
+        const { rerender } = render(_jsx(Harness, { store: store, formClassifiers: undefined }));
+        expect(screen.queryByRole('combobox')).not.toBeInTheDocument();
+        rerender(_jsx(Harness, { store: store, formClassifiers: classifiers }));
+        await user.click(await screen.findByRole('combobox'));
+        expect(await screen.findByRole('option', { name: 'Error / Bug' })).toBeInTheDocument();
+        expect(screen.getByRole('option', { name: 'Propuesta de mejora' })).toBeInTheDocument();
+    });
+});

package/dist/FormSteps/ClassifierSelectorStep/MaterialClassifierSelectorStep/MaterialClassifierSelectorStep.js

@@ -50,8 +50,10 @@ function ClassifierSelectorStep({ step, editable }) {
             };
         }) ?? []);
     }, 
+    // The classifiers dictionary can arrive after the first render (see useSetupApp), so the
+    // options must follow it, not only the dependency values.
     // eslint-disable-next-line react-hooks/exhaustive-deps
-    [dependenciesValues]);
+    [dependenciesValues, classifier, form.classifiers]);
     useEffect(() => {
         if (value && !options?.find((option) => option.value === value?.value)) {
             onChange('');

package/dist/FormSteps/EntityValueStep/MaterialEntityValuePickerStep/MaterialEntityValuePickerStep.js

@@ -13,6 +13,7 @@ import { evaluateCondition } from '../../StepFunctions';
 import StepComponent from '../../Step';
 import ErkValueTypes from '../../../constants/ErkValueTypes';
 import { IntegrationsApi } from '../../../Services/IntegrationService';
+import { entityValueDependencyValue } from '../entityValueDependencyValue';
 function EntityValuePickerStep({ step, editable }) {
     const form = useContext(FormContext);
     const subscribe = useApiSubscribe();
@@ -173,12 +174,9 @@ const getEntityValueOptions = async (step, dependencyStore, { idOrganization, id
                 break;
             }
             case EntityValueDataTypes.STEP: {
-                const currentValue = dependencyStore[filter.idStep]?.value;
-                if (currentValue) {
-                    if (typeof currentValue === 'string')
-                        params.set(filter.idProperty, currentValue);
-                    else
-                        params.set(filter.idProperty, currentValue._id ?? currentValue.id);
+                const currentValue = entityValueDependencyValue(dependencyStore[filter.idStep]);
+                if (currentValue !== undefined) {
+                    params.set(filter.idProperty, currentValue);
                 }
                 else if (filter.required) {
                     return null;

package/dist/FormSteps/EntityValueStep/entityValueDependencyValue.d.ts

@@ -0,0 +1,12 @@
+import { StepDependency } from '../../Form/Form';
+/**
+ * Serializes the current value of a dependency step into the string an entity-picker STEP filter
+ * sends as `values.<idProperty>` query param.
+ *
+ * Entity values (and any id-bearing object) resolve to their id. The answer of a Selector or
+ * Classifier step is a `{ label, value }` option: a Selector keeps `value === label`, so its `value`
+ * is the text the entity property stores; a Classifier's `value` is the classifier id, which no
+ * entity property holds, so it resolves to its `label`. Returns undefined when the dependency has
+ * no usable value, so the caller treats the filter as unresolved.
+ */
+export declare function entityValueDependencyValue(dependency: StepDependency | undefined): string | undefined;

package/dist/FormSteps/EntityValueStep/entityValueDependencyValue.js

@@ -0,0 +1,35 @@
+import FormStepTypes from '../../constants/FormStepTypes';
+/**
+ * Serializes the current value of a dependency step into the string an entity-picker STEP filter
+ * sends as `values.<idProperty>` query param.
+ *
+ * Entity values (and any id-bearing object) resolve to their id. The answer of a Selector or
+ * Classifier step is a `{ label, value }` option: a Selector keeps `value === label`, so its `value`
+ * is the text the entity property stores; a Classifier's `value` is the classifier id, which no
+ * entity property holds, so it resolves to its `label`. Returns undefined when the dependency has
+ * no usable value, so the caller treats the filter as unresolved.
+ */
+export function entityValueDependencyValue(dependency) {
+    const currentValue = dependency?.value;
+    if (currentValue === null || currentValue === undefined || currentValue === '')
+        return undefined;
+    if (typeof currentValue === 'string')
+        return currentValue;
+    if (typeof currentValue === 'number' || typeof currentValue === 'boolean')
+        return String(currentValue);
+    if (currentValue instanceof Date)
+        return currentValue.toISOString();
+    if (typeof currentValue !== 'object')
+        return undefined;
+    const record = currentValue;
+    // A Selector's `value` is the stored text; every other step's `value` may be an id, so its `label` wins.
+    const keys = dependency?.type === FormStepTypes.SELECTOR ? ['_id', 'id', 'value', 'label'] : ['_id', 'id', 'label', 'value'];
+    for (const key of keys) {
+        const candidate = record[key];
+        if (typeof candidate === 'string' && candidate !== '')
+            return candidate;
+        if (typeof candidate === 'number')
+            return String(candidate);
+    }
+    return undefined;
+}

package/dist/FormSteps/EntityValueStep/entityValueDependencyValue.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/FormSteps/EntityValueStep/entityValueDependencyValue.test.js

@@ -0,0 +1,31 @@
+import { describe, expect, test } from 'vitest';
+import FormStepTypes from '../../constants/FormStepTypes';
+import { entityValueDependencyValue } from './entityValueDependencyValue';
+const dep = (type, value) => ({
+    idOriginal: 'dep',
+    dependents: [],
+    type,
+    value,
+});
+describe('entityValueDependencyValue', () => {
+    test('an unanswered dependency is unresolved', () => {
+        expect(entityValueDependencyValue(undefined)).toBeUndefined();
+        expect(entityValueDependencyValue(dep(FormStepTypes.SELECTOR, null))).toBeUndefined();
+        expect(entityValueDependencyValue(dep(FormStepTypes.SELECTOR, ''))).toBeUndefined();
+        expect(entityValueDependencyValue(dep(FormStepTypes.SELECTOR, {}))).toBeUndefined();
+    });
+    test('plain answers are sent as text', () => {
+        expect(entityValueDependencyValue(dep(FormStepTypes.TEXTINPUT, 'Torre 3'))).toBe('Torre 3');
+        expect(entityValueDependencyValue(dep(FormStepTypes.TEXTINPUT, 7))).toBe('7');
+        expect(entityValueDependencyValue(dep(FormStepTypes.DATEPICKER, new Date('2026-01-02T00:00:00.000Z')))).toBe('2026-01-02T00:00:00.000Z');
+    });
+    test('an entity value resolves to its id', () => {
+        expect(entityValueDependencyValue(dep(FormStepTypes.ENTITYVALUEPICKER, { _id: 'ev-1', label: 'Morros' }))).toBe('ev-1');
+        expect(entityValueDependencyValue(dep(FormStepTypes.API_SELECTOR, { id: 'api-1', label: 'X' }))).toBe('api-1');
+    });
+    test('a selector option resolves to its value, a classifier option to its label', () => {
+        expect(entityValueDependencyValue(dep(FormStepTypes.SELECTOR, { label: 'Piso 2', value: 'Piso 2' }))).toBe('Piso 2');
+        expect(entityValueDependencyValue(dep(FormStepTypes.SELECTOR, { label: 'Dos', value: '2' }))).toBe('2');
+        expect(entityValueDependencyValue(dep(FormStepTypes.CLASSIFIER_SELECTOR, { label: 'Piso 2', value: '65f0c1a2b3c4d5e6f7a8b9c0' }))).toBe('Piso 2');
+    });
+});

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@arquimedes.co/eureka-forms",
   "repository": "git://github.com/Arquimede5/Eureka-Forms.git",
-  "version": "3.0.63",
+  "version":"3.0.64-entity-step-filter",
   "scripts": {
     "watch": "node node_modules/@typescript/native/bin/tsc --noEmit --watch --project tsconfig.app.json",
     "start": "vite",