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

package/src/FormSteps/ApiSelectorStep/MaterialApiSelectorStep/MaterialApiSelectorStep.tsx

@@ -1,126 +0,0 @@
-import React, { useContext } from 'react';
-import FormStepTypes, {
-    ApiSelectorOptionTypes,
-    ApiSelectorParamTypes,
-} from '../../../constants/FormStepTypes';
-import StepComponent from '../../Step';
-import { ApiSelectorStepProps, StepOptions } from '../ApiSelectorStep';
-import SmartSelect from '../../SmartSelectStep/MaterialSmartSelectStep/MaterialSmartSelectStep';
-import widgetInstance from '../../../Utils/AxiosWidget';
-import axiosInstance from '../../../Utils/AxiosAPI';
-import InputIcon from '../../../Shared/InputIcon/InputIcon';
-import FormContext from '../../../Contexts/FormContext';
-import { ApiSelector } from '../../../@Types/FormStep';
-import { DependencyStore } from '../../../Form/Form';
-import StepFillerContainer from '../../Utils/@StepFiller/StepFiller';
-
-function ApiSelectorComponent({
-    step,
-    editable,
-    ...others
-}: ApiSelectorStepProps): JSX.Element {
-    const form = useContext(FormContext);
-
-    function calcOptionId(option: any): string {
-        return option?.[step.idAttribute] ?? '';
-    }
-
-    function calcOptionLabel(option: any): string {
-        return option?.[step.labelAttribute] ?? '';
-    }
-
-    return (
-        <StepFillerContainer step={step}>
-            <SmartSelect
-                {...others}
-                editable={editable}
-                step={step}
-                icon={step.icon ? <InputIcon icon={step.icon} /> : undefined}
-                getOptions={getApiOptions}
-                getOptionSelected={(option, value): boolean =>
-                    calcOptionId(option) === calcOptionId(value)
-                }
-                calcDepError={(steps): string | undefined => {
-                    for (const step of steps) {
-                        if (step.type === FormStepTypes.API_SELECTOR) {
-                            return 'Selecciona un ' + step.label;
-                        }
-                    }
-                    return undefined;
-                }}
-                getValueString={(value): string => calcOptionLabel(value)}
-                renderNestedSteps={(value): JSX.Element => {
-                    if (!value) return <></>;
-                    const currentOption = step.options[calcOptionId(value)];
-                    if (currentOption?.type === ApiSelectorOptionTypes.NESTED) {
-                        return (
-                            <React.Fragment>
-                                {currentOption.steps.map((idStep: string) => {
-                                    const subStep = form.steps[idStep];
-                                    return (
-                                        <StepComponent
-                                            editable={editable}
-                                            step={subStep}
-                                            key={idStep}
-                                        />
-                                    );
-                                })}
-                            </React.Fragment>
-                        );
-                    } else return <></>;
-                }}
-            />
-        </StepFillerContainer>
-    );
-}
-export default ApiSelectorComponent;
-
-const getApiOptions = async (
-    idOrganization: string | undefined,
-    step: ApiSelector,
-    dependencyStore: DependencyStore
-): Promise<StepOptions[] | null> => {
-    function calcOptionId(option: any): string {
-        return option?.[step.idAttribute] ?? '';
-    }
-
-    const params = new URLSearchParams({});
-
-    for (const filter of step.queryParams) {
-        switch (filter.type) {
-            case ApiSelectorParamTypes.STEP: {
-                const currentValue = dependencyStore[filter.idStep]?.value;
-                if (currentValue) {
-                    if (typeof currentValue === 'string')
-                        params.set(filter.key, currentValue);
-                    else
-                        params.set(
-                            filter.key,
-                            currentValue.label ?? currentValue.id
-                        );
-                } else if (filter.required) {
-                    return null;
-                }
-                break;
-            }
-            case ApiSelectorParamTypes.VALUE:
-            default:
-                params.set(filter.key, filter.value);
-                break;
-        }
-    }
-    let url = step.url.replace('capta.co', process.env.REACT_APP_DOMAIN!);
-    if (idOrganization && url.includes(process.env.REACT_APP_DOMAIN!))
-        params.set('idOrganization', idOrganization);
-    if (!step.url.includes('?')) url += '?';
-    url += params.toString();
-    const response = await (idOrganization
-        ? widgetInstance.get(url)
-        : axiosInstance.get(url));
-    return response.data.filter(
-        (option: any) =>
-            calcOptionId(option) &&
-            step.options[calcOptionId(option)]?.type !==
-                ApiSelectorOptionTypes.HIDE
-    );
-};

package/src/FormSteps/CBRStepMapper.tsx

@@ -1,256 +0,0 @@
-import { CBRFormStep } from '../@Types/CBRFormStep';
-import CBRFormStepTypes from '../constants/CBRFormStepTypes';
-import PersonRoundedIcon from '@material-ui/icons/PersonRounded';
-import { StepProps } from './Step';
-import TextInputStep from './TextInputStep/TextInputStep';
-import SmartSelectStep from './SmartSelectStep/SmartSelectStep';
-import TextAreaStep from './TextAreaStep/TextAreaStep';
-import CBRIncidentsStep from './@Construction/CBRIncidentsStep/CBRIncidentsStep';
-import { GSmartSelect } from '../@Types/GenericFormSteps';
-import CBRElementStep from './@Construction/CBRElementStep/CBRElementStep';
-import axios from 'axios';
-import CBRPropertyStep from './@Construction/CBRPropertyStep/CBRPropertyStep';
-import InputIcon from '../Shared/InputIcon/InputIcon';
-import { DependencyStore } from '../Form/Form';
-
-const baseUrl = `https://integrations.${process.env.REACT_APP_DOMAIN}/sinco/cbr/`;
-interface CBRStepProps extends Omit<StepProps, 'step'> {
-    step: CBRFormStep;
-}
-
-export interface StepOptions {
-    id: string | number;
-    label: string;
-    idMacroProyecto?: number;
-}
-
-function CBRStepMapper(props: CBRStepProps): JSX.Element {
-    const getTipoDocOptions = async (
-        idOrganization: string | undefined
-    ): Promise<StepOptions[] | null> => {
-        if (!idOrganization) return null;
-        return (
-            await axios.get(
-                baseUrl + 'TiposDoc?idOrganization=' + idOrganization
-            )
-        ).data;
-    };
-
-    const getProyectoOptions = async (
-        idOrganization: string | undefined,
-        step: GSmartSelect,
-        dependencyStore: DependencyStore
-    ): Promise<StepOptions[] | null> => {
-        if (!idOrganization) return null;
-        const idMacroProyecto =
-            dependencyStore[step.dependencies?.[0] ?? '']?.value?.id;
-        let proyectos = (
-            await axios.get(
-                baseUrl + 'Proyectos?idOrganization=' + idOrganization
-            )
-        ).data;
-        if (idMacroProyecto) {
-            proyectos = proyectos.filter(
-                (proyecto: any) => proyecto.idMacroProyecto === idMacroProyecto
-            );
-        }
-        return proyectos;
-    };
-
-    const getMacroProyectoOptions = async (
-        idOrganization: string | undefined
-    ): Promise<StepOptions[] | null> => {
-        if (!idOrganization) return null;
-        return (
-            await axios.get(
-                baseUrl + 'MacroProyectos?idOrganization=' + idOrganization
-            )
-        ).data;
-    };
-
-    const getTipoSolicitanteOptions = async (
-        idOrganization: string | undefined
-    ): Promise<StepOptions[] | null> => {
-        if (!idOrganization) return null;
-        return (
-            await axios.get(
-                baseUrl + 'TiposSolicitante?idOrganization=' + idOrganization
-            )
-        ).data;
-    };
-
-    const getTipoEspaciosOptions = async (
-        idOrganization: string | undefined,
-        step: GSmartSelect,
-        dependencyStore: DependencyStore
-    ): Promise<StepOptions[] | null> => {
-        if (step.dependencies && idOrganization) {
-            const idProyecto = dependencyStore[step.dependencies[0]]?.value?.id;
-            if (!idProyecto) {
-                return null; //null para indicar que falta la depedency
-            }
-            const params = new URLSearchParams({ idProyecto, idOrganization });
-            return (
-                await axios.get(baseUrl + 'TiposEspacio?' + params.toString())
-            ).data;
-        } else {
-            return null;
-        }
-    };
-
-    switch (props.step.type) {
-        case CBRFormStepTypes.CBR_EMAIL:
-            return (
-                <TextInputStep
-                    {...props}
-                    step={props.step as any}
-                    validation={{
-                        type: 'EMAIL',
-                        value: /^(([^<>()[\]\\.,;:\s@"]+(\.[^<>()[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/
-                            .source,
-                        message: 'El correo no es válido',
-                    }}
-                />
-            );
-        case CBRFormStepTypes.CBR_CEL:
-        case CBRFormStepTypes.CBR_PHONE:
-            return (
-                <TextInputStep
-                    {...props}
-                    step={props.step as any}
-                    validation={{
-                        type: 'OTHER',
-                        value: /^(\+[0-9])|([0-9])$/.source,
-                        message: 'El teléfono no es válido',
-                    }}
-                />
-            );
-        case CBRFormStepTypes.CBR_LAST_NAME:
-        case CBRFormStepTypes.CBR_FIRST_NAME:
-        case CBRFormStepTypes.CBR_MIDDLE_NAME:
-        case CBRFormStepTypes.CBR_SECOND_LAST_NAME:
-            return <TextInputStep {...props} step={props.step as any} />;
-        case CBRFormStepTypes.CBR_DOC:
-            return (
-                <TextInputStep
-                    {...props}
-                    step={props.step as any}
-                    icon={<DocumentIconComponent />}
-                />
-            );
-        case CBRFormStepTypes.CBR_TIPO_DOC:
-            return (
-                <SmartSelectStep
-                    {...props}
-                    step={{ ...props.step, showIcon: false }}
-                    getOptions={getTipoDocOptions}
-                    getOptionSelected={(option, value): boolean =>
-                        option.id === value.id
-                    }
-                    getValueString={(value): string => value?.id}
-                />
-            );
-
-        case CBRFormStepTypes.CBR_MACRO_PROYECTO:
-            return (
-                <SmartSelectStep
-                    {...props}
-                    step={props.step}
-                    icon={<InputIcon icon={'PROJECT'} />}
-                    getOptions={getMacroProyectoOptions}
-                    getOptionSelected={(option, value): boolean =>
-                        option.id === value.id
-                    }
-                    getValueString={(value): string => value?.id}
-                />
-            );
-        case CBRFormStepTypes.CBR_PROYECTO:
-            return (
-                <SmartSelectStep
-                    {...props}
-                    step={props.step}
-                    icon={<InputIcon icon={'PROJECT'} />}
-                    getOptions={getProyectoOptions}
-                    getOptionSelected={(option, value): boolean =>
-                        option.id === value.id
-                    }
-                    getValueString={(value): string => value?.id}
-                />
-            );
-
-        case CBRFormStepTypes.CBR_INMUEBLE:
-            return <CBRPropertyStep {...props} step={props.step as any} />;
-
-        case CBRFormStepTypes.CBR_TIPO_SOLICITANTE:
-            return (
-                <SmartSelectStep
-                    {...props}
-                    step={props.step}
-                    icon={
-                        <PersonRoundedIcon
-                            fill="#757575"
-                            style={{
-                                display: 'flex',
-                                height: 23,
-                                width: 23,
-                                marginRight: 3,
-                                marginTop: 1,
-                            }}
-                        />
-                    }
-                    getOptions={getTipoSolicitanteOptions}
-                    getOptionSelected={(option, value): boolean =>
-                        option.id === value.id
-                    }
-                    getValueString={(value): string => value?.id}
-                />
-            );
-
-        case CBRFormStepTypes.CBR_TIPO_ESPACIO:
-            return (
-                <SmartSelectStep
-                    {...props}
-                    step={props.step}
-                    icon={<InputIcon icon={'SPACE'} />}
-                    getOptions={getTipoEspaciosOptions}
-                    calcDepError={(steps): string | undefined => {
-                        for (const step of steps) {
-                            if (
-                                (step.type as any) ===
-                                CBRFormStepTypes.CBR_PROYECTO
-                            ) {
-                                return 'Selecciona un proyecto';
-                            }
-                        }
-                        return undefined;
-                    }}
-                    getOptionSelected={(option, value): boolean =>
-                        option.id === value.id
-                    }
-                    getValueString={(value): string => value?.id}
-                />
-            );
-        case CBRFormStepTypes.CBR_LOCATIVAS:
-            return <CBRElementStep {...props} step={props.step as any} />;
-        case CBRFormStepTypes.CBR_COMENTARIO:
-            return <TextAreaStep {...props} step={props.step as any} />;
-        case CBRFormStepTypes.CBR_INCIDENCIAS:
-            return <CBRIncidentsStep {...props} step={props.step} />;
-        default:
-            return <div></div>;
-    }
-}
-
-export default CBRStepMapper;
-
-function DocumentIconComponent(): JSX.Element {
-    return (
-        <div
-            style={{
-                marginRight: 2,
-            }}
-        >
-            <InputIcon icon={'DOCUMENT'} />
-        </div>
-    );
-}

package/src/FormSteps/CheckBoxStep/CheckBoxStep.tsx

@@ -1,20 +0,0 @@
-import { CheckBox } from '../../@Types/FormStep';
-import { FormStyleTypes } from '../../constants/FormStepTypes';
-import MaterialCheckBoxStep from './MaterialCheckBoxStep/MaterialCheckBoxStep';
-import { StepProps } from '../Step';
-import { useAppSelector } from '../../hooks';
-export interface CheckBoxStepProps extends StepProps {
-    /** The CheckboxStep to display */
-    step: CheckBox;
-}
-function CheckboxStep(props: CheckBoxStepProps): JSX.Element {
-    const { formStyle } = useAppSelector((state) => state.global);
-
-    switch (formStyle.type) {
-        case FormStyleTypes.MATERIAL:
-        default: {
-            return <MaterialCheckBoxStep {...props} />;
-        }
-    }
-}
-export default CheckboxStep;

package/src/FormSteps/CheckBoxStep/MaterialCheckBoxStep/MaterialCheckBoxStep.module.css

@@ -1,26 +0,0 @@
-.checkboxLbl {
-    font-size: 18px;
-    margin-right: 10px;
-    margin-left: 10px;
-    white-space: nowrap;
-    overflow: hidden;
-    text-overflow: ellipsis;
-}
-.labelCheckBoxContainer {
-    display: flex;
-    align-items: center;
-    flex-direction: row;
-    align-items: center;
-    height: 31px;
-}
-
-.descriptionPar {
-    font-size: 0.75rem;
-    margin-left: 14px;
-    margin-top: 4px;
-    font-weight: 400;
-    line-height: 1.66;
-    max-width: 100%;
-    overflow: hidden;
-    text-overflow: ellipsis;
-}

package/src/FormSteps/CheckBoxStep/MaterialCheckBoxStep/MaterialCheckBoxStep.tsx

@@ -1,83 +0,0 @@
-import styles from './MaterialCheckBoxStep.module.css';
-import RoundedCheckBox from '../../../Shared/RoundedCheckBox/RoundedCheckBox';
-import { CheckBoxStepProps } from '../CheckBoxStep';
-import React, { useContext } from 'react';
-import StepComponent from '../../Step';
-import FormContext from '../../../Contexts/FormContext';
-import { useAppSelector } from '../../../hooks';
-import { useFormStep } from '../../StepHooks';
-import StepFillerContainer from '../../Utils/@StepFiller/StepFiller';
-import MaterialInputContainer from '../../Utils/MaterialInputContainer/MaterialInputContainer';
-function CheckBoxStep({ step, editable }: CheckBoxStepProps): JSX.Element {
-    const { ref, value, onChange, error, field } = useFormStep<boolean>(step, {
-        defaultValue: step.defaultValue ?? false,
-        rules: {
-            required: step.required ? 'Este campo es obligatorio' : undefined,
-        },
-        sizeChange: true,
-    });
-
-    const { formStyle, postview } = useAppSelector((state) => state.global);
-    const form = useContext(FormContext);
-
-    const renderNested = (): void | JSX.Element => {
-        const steps = value ? step.steps : step.uncheckedSteps;
-        return (
-            <React.Fragment>
-                {steps?.map((idStep: string) => {
-                    const subStep = form.steps[idStep];
-                    return (
-                        <StepComponent
-                            editable={editable}
-                            step={subStep}
-                            key={idStep}
-                        />
-                    );
-                })}
-            </React.Fragment>
-        );
-    };
-
-    return (
-        <StepFillerContainer step={step}>
-            <MaterialInputContainer step={step} editable={editable}>
-                <div className={styles.labelCheckBoxContainer}>
-                    {step.label && (
-                        <div className={styles.checkboxLbl}>
-                            {step.label}
-                            {step.required ? ' *' : ''}:
-                        </div>
-                    )}
-                    <RoundedCheckBox
-                        {...field}
-                        inputRef={ref}
-                        onChange={onChange}
-                        data-testid={step.id}
-                        padding="0px"
-                        size="1.6rem"
-                        error={!!error}
-                        cantEdit={!editable || postview}
-                        checkedColor={formStyle.primaryColor}
-                        uncheckedColor={formStyle.outlineColor}
-                        checked={value}
-                    ></RoundedCheckBox>
-                </div>
-                {(step.description || !!error) && (
-                    <div
-                        className={styles.descriptionPar}
-                        style={{
-                            color: error
-                                ? formStyle.errorColor
-                                : formStyle.descriptionTextColor,
-                        }}
-                    >
-                        {error ? 'Este campo es obligatorio' : step.description}
-                    </div>
-                )}
-            </MaterialInputContainer>
-            {renderNested()}
-        </StepFillerContainer>
-    );
-}
-
-export default CheckBoxStep;

package/src/FormSteps/ClassifierSelectorStep/ClassifierSelectorStep.tsx

@@ -1,22 +0,0 @@
-import { ClassifierSelector } from '../../@Types/FormStep';
-import { FormStyleTypes } from '../../constants/FormStepTypes';
-import MaterialClassifierSelectorStep from './MaterialClassifierSelectorStep/MaterialClassifierSelectorStep';
-import { StepProps } from '../Step';
-import { useAppSelector } from '../../hooks';
-export interface ClassifierSelectorStepProps extends StepProps {
-    /** The ClassifierSelectorStep to display */
-    step: ClassifierSelector;
-}
-function ClassifierSelectorStep(
-    props: ClassifierSelectorStepProps
-): JSX.Element {
-    const { formStyle } = useAppSelector((state) => state.global);
-
-    switch (formStyle.type) {
-        case FormStyleTypes.MATERIAL:
-        default: {
-            return <MaterialClassifierSelectorStep {...props} />;
-        }
-    }
-}
-export default ClassifierSelectorStep;

package/src/FormSteps/ClassifierSelectorStep/MaterialClassifierSelectorStep/MaterialClassifierSelectorStep.tsx

@@ -1,120 +0,0 @@
-import React, { useContext, useMemo } from 'react';
-import { ClassifierOptionTypes } from '../../../constants/FormStepTypes';
-import StepComponent from '../../Step';
-import { ClassifierSelectorStepProps } from '../ClassifierSelectorStep';
-import { Classifier } from '../../../@Types/Form';
-import RoundedSmartSelect from '../../../Shared/RoundedSmartSelect/RoundedSmartSelect';
-import FormContext from '../../../Contexts/FormContext';
-import { useAppSelector } from '../../../hooks';
-import { useFormStep } from '../../StepHooks';
-import StepFillerContainer from '../../Utils/@StepFiller/StepFiller';
-import MaterialInputContainer from '../../Utils/MaterialInputContainer/MaterialInputContainer';
-import { calcDefaultValue } from '../../StepFunctions';
-
-function ClassifierSelectorStep({
-    step,
-    editable,
-}: ClassifierSelectorStepProps): JSX.Element {
-    const { ref, value, onChange, error, field } = useFormStep<{
-        value: string;
-        label: string;
-    }>(step, {
-        defaultValue: calcDefaultValue(step),
-        sizeChange: true,
-        rules: {
-            required: step.required ? 'Este campo es obligatorio' : undefined,
-        },
-    });
-
-    const { formStyle, postview, preview } = useAppSelector(
-        (state) => state.global
-    );
-    const form = useContext(FormContext);
-
-    if (!step.idClassifier) return <div></div>;
-
-    const classifier: Classifier | undefined =
-        form.classifiers?.[step.idClassifier];
-
-    if (!classifier) return <div></div>;
-
-    const options = useMemo(() => {
-        return classifier.children
-            ?.filter(
-                (idClassifier) =>
-                    step.options[idClassifier]?.type !==
-                        ClassifierOptionTypes.HIDE &&
-                    form.classifiers?.[idClassifier]
-            )
-            .map((idClassifier) => {
-                const classifier = form.classifiers?.[idClassifier];
-                return {
-                    value: classifier?._id,
-                    label:
-                        classifier?.clientName?.trim?.() && preview
-                            ? classifier?.clientName
-                            : classifier?.name,
-                };
-            });
-    }, []);
-
-    const mapNestedOption = (): void | JSX.Element => {
-        if (value) {
-            const currentOption = step.options[value.value];
-            if (currentOption?.type === ClassifierOptionTypes.NESTED) {
-                return (
-                    <React.Fragment>
-                        {currentOption.steps.map((idStep: string) => {
-                            const subStep = form.steps[idStep];
-                            return (
-                                <StepComponent
-                                    step={subStep}
-                                    key={idStep}
-                                    editable={editable}
-                                />
-                            );
-                        })}
-                    </React.Fragment>
-                );
-            }
-        }
-    };
-
-    return (
-        <StepFillerContainer step={step}>
-            <MaterialInputContainer step={step} editable={editable}>
-                <RoundedSmartSelect
-                    {...field}
-                    inputRef={ref}
-                    value={value}
-                    disabled={false}
-                    loading={false}
-                    options={options}
-                    cantEdit={!editable || postview}
-                    fullWidth
-                    backgroundColor={formStyle.stepBackgroundColor ?? 'white'}
-                    label={step.label ? step.label : classifier.name}
-                    required={step.required}
-                    height={'31px'}
-                    searchable={step.searchable}
-                    icon={undefined}
-                    helperTextColor={formStyle.descriptionTextColor}
-                    focusColor={formStyle.primaryColor}
-                    outlineColor={formStyle.outlineColor}
-                    errorColor={formStyle.errorColor}
-                    color={formStyle.textColor}
-                    containerMargin="0px"
-                    handleUpdate={onChange}
-                    getOptionSelected={(option, value): boolean => {
-                        return option.value === value?.value;
-                    }}
-                    helperText={error?.message?.toString() ?? step.description}
-                    error={!!error}
-                />
-            </MaterialInputContainer>
-            {mapNestedOption()}
-        </StepFillerContainer>
-    );
-}
-
-export default ClassifierSelectorStep;

package/src/FormSteps/CollapsibleStep/CollapsibleStep.tsx

@@ -1,24 +0,0 @@
-import { useAppSelector } from '../../hooks';
-import { Collapsible } from '../../@Types/FormStep';
-import { FormStyleTypes } from '../../constants/FormStepTypes';
-import { StepProps } from '../Step';
-import MaterialCollapsibleStep from './MaterialTitleStep/MaterialCollapsibleStep';
-export interface CollapsibleStepProps extends StepProps {
-    /** The CollapsibleStep to display */
-    step: Collapsible;
-}
-function CollapsibleStep({
-    step,
-    ...others
-}: CollapsibleStepProps): JSX.Element {
-    const { formStyle } = useAppSelector((state) => state.global);
-
-    if (step.steps.length === 0) return <></>;
-    switch (formStyle.type) {
-        case FormStyleTypes.MATERIAL:
-        default: {
-            return <MaterialCollapsibleStep step={step} {...others} />;
-        }
-    }
-}
-export default CollapsibleStep;