@arquimedes.co/eureka-forms 2.0.34-test → 2.0.35-test

package/src/App/AppFunctions.ts

@@ -1,240 +0,0 @@
-import { nanoid } from 'nanoid';
-import { Form } from '../@Types';
-import { FormStep, Mapper } from '../@Types/FormStep';
-import StepTypes, { FormTypes } from '../constants/FormStepTypes';
-import { getRawText, stringToDraft } from '../Utils/DraftFunctions';
-import { SiteState, ValuesStore } from '../States/SiteSlice';
-import { CustomStep } from '../FormSteps/CustomStep';
-import { calcSubSteps } from '../FormSteps/StepFunctions';
-import { MapperElement } from '../@Types/MapperElement';
-
-export const calcValuesStore = (
-    form: Readonly<Form>,
-    originalValues: Record<string, any> = {},
-    postview: boolean = false,
-    customSteps: Record<string, CustomStep> = {}
-): ValuesStore => {
-    const values: ValuesStore = {
-        global: {},
-        sections: {},
-    };
-    for (const idValue of Object.keys(originalValues)) {
-        const step = form.steps[idValue];
-        if (step && !form.hiddenSteps?.includes(step.id)) {
-            const value = mapOriginalValue(
-                step,
-                originalValues[step.id],
-                values,
-                form
-            );
-            if (value !== undefined) {
-                if (!values.sections[step.idSection])
-                    values.sections[step.idSection] = {};
-                values.sections[step.idSection][step.id] = value;
-            }
-        } else {
-            values.global[idValue] = originalValues[idValue];
-        }
-    }
-
-    if (postview) return values;
-    for (const section of Object.values(form.sections)) {
-        for (const idStep of section.steps) {
-            const step = form.steps[idStep];
-            if (
-                step.type !== StepTypes.MAPPER ||
-                values.sections[step.idSection]?.[step.id]
-            )
-                continue;
-            if (!values.sections[step.idSection])
-                values.sections[step.idSection] = {};
-            const { element, mappers } = addMapperStep(step, customSteps);
-            values.sections[step.idSection] = {
-                ...values.sections[step.idSection],
-                ...mappers,
-                [step.id]: [element],
-            };
-        }
-    }
-    return values;
-};
-
-export const addMapperStep = <Type>(
-    step: Mapper,
-    customSteps: Record<string, CustomStep>
-): {
-    element: MapperElement<Type>;
-    /** Record of all the new mapper values created */
-    mappers: Record<string, MapperElement<Type>[]>;
-    /** Record of all the new steps created */
-    steps: Record<string, FormStep>;
-} => {
-    const idElement = nanoid();
-    const element: MapperElement<Type> = {
-        ids: {},
-        id: idElement,
-        originalValues: {},
-        isOriginal: false,
-    };
-    let steps: Record<string, FormStep> = {};
-    let mappers: Record<string, MapperElement<Type>[]> = {};
-    for (const idStep of Object.keys(step.steps)) {
-        const baseStep = JSON.parse(JSON.stringify(step.steps[idStep]));
-        const newIdStep = step.id + '-' + idStep + '-' + idElement;
-        baseStep.id = newIdStep;
-        element.ids[idStep] = newIdStep;
-        steps[newIdStep] = baseStep;
-    }
-    calcRecursiveData(element, steps, customSteps);
-    for (const nestedStep of Object.values(step.steps)) {
-        if (nestedStep.type === StepTypes.MAPPER) {
-            const nested = addMapperStep<Type>(nestedStep, customSteps);
-            steps = { ...steps, ...nested.steps };
-            mappers = { ...mappers, ...nested.mappers };
-            mappers[element.ids[nestedStep.id]] = [nested.element];
-        }
-    }
-    return { element, mappers, steps };
-};
-
-export function calcRecursiveData<Type>(
-    element: Readonly<MapperElement<Type>>,
-    newSteps: Record<string, FormStep>,
-    customSteps: Record<string, CustomStep>
-): void {
-    if (!newSteps) return;
-    for (const idStep of Object.keys(newSteps)) {
-        const step = newSteps[idStep];
-        step.id = idStep;
-        if (step.dependencies) {
-            for (let i = 0; i < step.dependencies.length; i++) {
-                const idDep: string = step.dependencies[i];
-                const newId = element.ids[idDep];
-                if (newId) {
-                    step.dependencies[i] = newId;
-                }
-            }
-        }
-        const custom = customSteps[step?.type];
-        if (custom?.calcRecursiveData) {
-            custom.calcRecursiveData(step, element.ids);
-        }
-        calcSubSteps(
-            step.id,
-            newSteps,
-            (idStep: string): string => element.ids[idStep] ?? idStep
-        );
-    }
-}
-
-export const mapOriginalValue = (
-    step: FormStep,
-    value: any,
-    values: ValuesStore,
-    form?: Readonly<Form>
-): any => {
-    if (!value) return value;
-    switch (step?.type) {
-        case StepTypes.MAPPER: {
-            const elements = value;
-            const mappedElements: MapperElement<any>[] = [];
-            for (const element of elements) {
-                const idElement = element.id ?? nanoid();
-                const mappedElement: MapperElement<any> = {
-                    id: idElement,
-                    ids: {},
-                    originalValues: {},
-                    isOriginal: true,
-                };
-                if (element.value) {
-                    mappedElement.value = element.value;
-                }
-                for (const idStep of Object.keys(step.steps)) {
-                    const newIdStep = step.id + '-' + idStep + '-' + idElement;
-                    mappedElement.ids[idStep] = newIdStep;
-                    const value = mapOriginalValue(
-                        step.steps[idStep],
-                        element[idStep],
-                        values,
-                        form
-                    );
-                    if (value !== undefined) {
-                        if (!values.sections[step.idSection])
-                            values.sections[step.idSection] = {};
-                        values.sections[step.idSection][newIdStep] = value;
-                    }
-                }
-                for (const key of Object.keys(element)) {
-                    if (step.steps[key] || key === 'id') continue;
-                    mappedElement.originalValues[key] = element[key];
-                }
-                mappedElements.push(mappedElement);
-            }
-            return mappedElements;
-        }
-        case StepTypes.TEXTAREA: {
-            if (step.hasTextEditor) {
-                if (typeof value === 'string') {
-                    return stringToDraft(value);
-                }
-                return getRawText(value?.draft, value?.text);
-            }
-            const defaultValue = value.value ?? value;
-            if (typeof defaultValue === 'string') {
-                return defaultValue;
-            } else {
-                return defaultValue?.text ?? '';
-            }
-        }
-        case StepTypes.SELECTOR: {
-            const option = step.options.find(
-                (option) => option.value === value
-            );
-            if (!value?.value) return option;
-            return value;
-        }
-        case StepTypes.CLASSIFIER_SELECTOR: {
-            const stepClassifier = form?.classifiers?.[step.idClassifier ?? ''];
-            if (stepClassifier && !value.value) {
-                const classifier = form.classifiers?.[value];
-                return { value, label: classifier?.name };
-            }
-            break;
-        }
-        default:
-            if (
-                step.type.startsWith('CBR_') &&
-                value?.id &&
-                typeof value.id === 'number'
-            ) {
-                return { ...value, id: value.id.toString() };
-            }
-            return value;
-    }
-};
-
-export const calcInitialSections = (
-    form: Form
-): Pick<
-    SiteState,
-    'previousSections' | 'idCurrentSection' | 'nextSections'
-> => {
-    const previousSections: string[] = [];
-    const nextSections: string[] = calcNextSections(form.firstSection, form);
-    let idCurrentSection: string | null = null;
-    if (form.type === FormTypes.STEPPER) {
-        const firstSection = nextSections.shift();
-        if (firstSection) idCurrentSection = firstSection;
-    }
-
-    return { previousSections, idCurrentSection, nextSections };
-};
-
-const calcNextSections = (idSection: string, form: Form): string[] => {
-    const section = form.sections[idSection];
-    if (!section) return [];
-    const sections = [idSection];
-    if (section.nextSection)
-        sections.push(...calcNextSections(section.nextSection, form));
-    return sections;
-};

package/src/App/AppHooks.test.ts

@@ -1,139 +0,0 @@
-import mockAxios from 'jest-mock-axios';
-import { useSetupApp } from './AppHooks';
-import { renderHookWithProviders } from '../Utils/TestUtils';
-import { Form } from '../@Types';
-
-const BaseForm: Form = {
-    isStandAlone: true,
-    sections: {
-        FIRST: {
-            id: 'FIRST',
-            name: 'FIRST',
-            nextSection: null,
-            steps: [],
-        },
-    },
-    steps: {},
-    size: {
-        blockNum: 4,
-        blockSize: 210,
-        spacingSize: 20,
-    },
-    firstSection: 'FIRST',
-};
-
-describe('AppHooks', function () {
-    afterEach(() => {
-        mockAxios.reset();
-    });
-
-    describe('useSetupApp', function () {
-        test('Empty App', async () => {
-            const {
-                result: { current },
-                waitFor,
-            } = renderHookWithProviders(() => useSetupApp(false, {}));
-            await waitFor(() => current.form !== undefined);
-            expect(current.form).toBeNull();
-            expect(current.organization).toBeNull();
-            expect(current.branding).toBeUndefined();
-        });
-
-        test('Standalone Preview', async () => {
-            mockAxios.get.mockImplementation((): any => {
-                return Promise.resolve({
-                    data: {
-                        idOrganization: 'capta',
-                    },
-                });
-            });
-            const { result, waitFor } = renderHookWithProviders(() =>
-                useSetupApp(false, {
-                    formData: BaseForm,
-                    preview: true,
-                })
-            );
-            await waitFor(() => result.current.form !== undefined);
-            expect(mockAxios.get).toHaveBeenCalledWith('/organization');
-            expect(result.current.form).toBeTruthy();
-            expect(result.current.organization?.idOrganization).toBe('capta');
-        });
-
-        test('Embedded Form', async () => {
-            const { result, waitFor } = renderHookWithProviders(() =>
-                useSetupApp(false, {
-                    formData: BaseForm,
-                })
-            );
-            await waitFor(() => result.current.form !== undefined);
-            expect(result.current.form).toBeTruthy();
-            expect(result.current.organization).toBeNull();
-            expect(result.current.branding).toBeUndefined();
-        });
-
-        test('Apikey Default', async () => {
-            mockAxios.get.mockImplementation((a): any => {
-                if (a === '/organization') {
-                    return Promise.resolve({
-                        data: {
-                            idOrganization: 'capta',
-                            branding: {
-                                name: 'Branding',
-                            },
-                        },
-                    });
-                } else if (a === '/form/123') {
-                    return Promise.resolve({
-                        data: BaseForm,
-                    });
-                } else {
-                    return Promise.reject();
-                }
-            });
-            const { result, waitFor } = renderHookWithProviders(() =>
-                useSetupApp(false, {
-                    apiKey: '123',
-                })
-            );
-            await waitFor(() => result.current.form !== undefined);
-            expect(mockAxios.get).toHaveBeenCalledWith('/organization');
-            expect(result.current.form).toBeTruthy();
-            expect(result.current.organization?.idOrganization).toBe('capta');
-            expect(result.current.branding?.name).toBe('Branding');
-        });
-
-        test('Apikey With Custom Branding', async () => {
-            mockAxios.get.mockImplementation((a): any => {
-                if (a === '/organization') {
-                    return Promise.resolve({
-                        data: {
-                            idOrganization: 'capta',
-                            customBrandings: true,
-                        },
-                    });
-                } else if (a === '/form/123') {
-                    return Promise.resolve({
-                        data: {
-                            ...BaseForm,
-                            branding: {
-                                name: 'Custom Branding',
-                            },
-                        } as Form,
-                    });
-                } else {
-                    return Promise.reject();
-                }
-            });
-            const { result, waitFor } = renderHookWithProviders(() =>
-                useSetupApp(false, {
-                    apiKey: '123',
-                })
-            );
-            await waitFor(() => result.current.form !== undefined);
-            expect(mockAxios.get).toHaveBeenCalledWith('/organization');
-            expect(result.current.form).toBeTruthy();
-            expect(result.current.organization?.idOrganization).toBe('capta');
-            expect(result.current.branding?.name).toBe('Custom Branding');
-        });
-    });
-});

package/src/App/AppHooks.ts

@@ -1,217 +0,0 @@
-import { useCallback, useEffect, useState } from 'react';
-import { Form, Organization } from '../@Types';
-import { AppProps } from './App';
-import { Branding } from '../@Types/Branding';
-import { reset } from '../States/GlobalSlice';
-import { fetchOrganization } from '../Services/OrganizationService';
-import { fetchForm } from '../Services/FormService';
-import { FormStep } from '../@Types/FormStep';
-import { calcCbrForm } from '../Utils/CBRFunctions';
-import { calcInitialSections, calcValuesStore } from './AppFunctions';
-import { useAppDispatch } from '../hooks';
-import InternalFormStyle from '../constants/InternalFormStyle';
-import { calcDependencies } from '../Form/FormFunctions';
-import { iterateNestedSteps } from '../FormSteps/StepFunctions';
-import { createNextState } from '@reduxjs/toolkit';
-
-export const useSetupApp = (
-    isEmbedded: boolean,
-    {
-        preview,
-        internal,
-        postview,
-        partial,
-        editable,
-        handleConfirmed,
-        customSteps,
-        valuesData,
-        apiKey,
-        formData,
-        classifiers,
-        ...others
-    }: Omit<AppProps, 'isWidget'>
-): {
-    form: Form | undefined | null;
-    organization: Organization | undefined | null;
-    branding: Branding | undefined;
-    reload: () => void;
-} => {
-    const [form, setForm] = useState<Form | undefined | null>(undefined);
-    const [organization, setOrganization] = useState<
-        Organization | undefined | null
-    >(undefined);
-    const [branding, setBranding] = useState<Branding | undefined>();
-    const dispatch = useAppDispatch();
-
-    const loadOrg = async (
-        idOrganization?: string
-    ): Promise<Organization | null> => {
-        const organization = await fetchOrganization(idOrganization);
-        if (organization) {
-            if (!isEmbedded) {
-                // document.title = currentOrg.name;
-                // const favicon: any = document.getElementById('favicon');
-                // if (favicon !== undefined) {
-                //     favicon.href = currentOrg.partialLogoUrl;
-                // }
-                //TODO cambiar el color del navbar en movil
-                // eslint-disable-next-line no-console
-            }
-            if (!organization.customBrandings) {
-                setBranding(organization.branding);
-            }
-        }
-        return organization;
-    };
-
-    const loadForm = async (
-        apiKey: string,
-        idOrganization?: string
-    ): Promise<Form | null> => {
-        const form = await fetchForm(apiKey, idOrganization);
-        if (form && form.branding) setBranding(form.branding);
-        return form;
-    };
-
-    const loadData = async (): Promise<void> => {
-        let idOrganization = others.idOrganization;
-        let organization: Organization | null = null;
-        let form: Form | null = formData ?? null;
-        if (form && preview && form.isStandAlone) {
-            organization = await loadOrg();
-        } else if (!form && apiKey) {
-            //Is iframe or widget
-            [organization, form] = await Promise.all([
-                loadOrg(idOrganization),
-                loadForm(apiKey, idOrganization),
-            ]);
-        }
-
-        if (organization && !idOrganization)
-            idOrganization = organization.idOrganization;
-        setOrganization(organization);
-        /** For localhost development */
-        if (!idOrganization && process.env.NODE_ENV !== 'production') {
-            // eslint-disable-next-line no-restricted-globals
-            const match = location.origin.match(/\/\/(.*?)\./);
-            idOrganization = match ? match[1] : '';
-        }
-        if (form) {
-            form = createNextState(form, (form) => {
-                //If a rootStep is a mapper of type section
-                if (form && classifiers) form.classifiers = classifiers;
-                /** Assign the idSection to all the forms steps */
-                for (const section of Object.values(form.sections)) {
-                    for (const idStep of section.steps) {
-                        iterateNestedSteps(
-                            idStep,
-                            form.steps,
-                            (step: FormStep) => {
-                                step.idSection = section.id;
-                            }
-                        );
-                    }
-                }
-
-                const CBRStep = Object.values(form.steps).find(
-                    (step: FormStep): boolean => step.type.startsWith('CBR')
-                );
-                if (CBRStep) form = calcCbrForm(form, valuesData ?? {});
-            });
-        }
-        setForm(form);
-        if (!form || !idOrganization) return;
-        const dependencies = {};
-        const values = calcValuesStore(form, valuesData, postview, customSteps);
-        dispatch(
-            reset({
-                formStyle: internal
-                    ? InternalFormStyle
-                    : {
-                          ...InternalFormStyle,
-                          ...(form?.style ?? {}),
-                      },
-                internal: !!internal,
-                idOrganization,
-                preview: !!preview,
-                partial: !!partial,
-                postview: !!postview,
-                editable: !!(editable ?? true),
-                values,
-                ...calcInitialSections(form),
-                dependencies: calcDependencies(
-                    form.steps,
-                    customSteps,
-                    form.steps,
-                    dependencies,
-                    values
-                ),
-            })
-        );
-    };
-
-    useEffect(() => {
-        loadData();
-        return () => {
-            dispatch({ type: 'CLEAR' });
-        };
-    }, []);
-
-    const reload = useCallback(() => {
-        if (!form) return;
-        const tempForm = { ...form };
-        setForm(undefined);
-        setTimeout(() => {
-            setForm(tempForm);
-        }, 100);
-        if (handleConfirmed) {
-            handleConfirmed();
-        }
-    }, [form]);
-
-    return { form, organization, branding, reload };
-};
-
-export const useLogRocket = (
-    organization: Organization | null | undefined,
-    form: Form | null | undefined,
-    {
-        apiKey,
-        internal,
-        postview,
-        preview,
-    }: Pick<AppProps, 'apiKey' | 'internal' | 'postview' | 'preview'>
-): void => {
-    const loadLogRocket = async (): Promise<void> => {
-        if (
-            form &&
-            organization &&
-            process.env.NODE_ENV === 'production' &&
-            //Tools
-            // apiKey !== 'rCgWiEfOSN1TlUmHO28Y0' &&
-            !internal &&
-            !postview &&
-            !preview
-        ) {
-            try {
-                const LogRocket = await import('logrocket');
-                LogRocket.default.init('63mg8a/forms-uv0gd');
-                LogRocket.default.identify(
-                    organization.idOrganization + '/' + apiKey,
-                    {
-                        name:
-                            organization.name +
-                            '/' +
-                            (form?.name ? form?.name : '404'),
-                    }
-                );
-            } catch (error) {
-                console.error('LogRocker Error', error);
-            }
-        }
-    };
-
-    useEffect(() => {
-        loadLogRocket();
-    }, [organization, form]);
-};

package/src/Contexts/CustomContext.ts

@@ -1,16 +0,0 @@
-import { createContext } from 'react';
-import { CustomStep } from '../FormSteps/CustomStep';
-
-export interface CustomContextData {
-    sendLabel?: string;
-    customStepProps: Record<string, unknown>;
-    customSteps: Record<string, CustomStep>;
-    /** Function to call on postview to fetch the download url of a file */
-    fetchDownloadUrl?: (S3Key: string, fileName: string) => Promise<string>;
-}
-
-const CustomContext = createContext<CustomContextData>({
-    customSteps: {},
-    customStepProps: {},
-});
-export default CustomContext;

package/src/Contexts/FormContext.ts

@@ -1,22 +0,0 @@
-import { createContext } from 'react';
-import { Form } from '../@Types';
-
-const FormContext = createContext<Form>({
-    firstSection: 'FIRST',
-    sections: {
-        FIRST: {
-            id: 'FIRST',
-            name: 'FIRST',
-            steps: [],
-            nextSection: null,
-        },
-    },
-    steps: {},
-    size: {
-        blockSize: 0,
-        blockNum: 4,
-        spacingSize: 0,
-    },
-});
-
-export default FormContext;

package/src/Contexts/SectionContext.ts

@@ -1,5 +0,0 @@
-import { createContext } from 'react';
-
-const SectionContext = createContext<string>('NULL');
-
-export default SectionContext;