@redneckz/wildless-cms-uni-blocks 0.14.657 → 0.14.659

package/src/components/CreditCardForm/formStateMap.tsx

@@ -1,88 +1,13 @@
-/* eslint-disable max-lines */
 import { PAYMENT_SYSTEM_TYPES } from '../../ui-kit/FormField/Fields/PaymentSystemField';
-import type { Option } from '../../ui-kit/Select/Option';
-import { type Address } from '../ApplicationLeadForm/getInitialFormState';
+import { type FormState } from '../ApplicationLeadForm/getInitialFormState';
 
-export type FormStateDeliveryType = {
-  regionRetail?: string;
-  bankEmployeeCode?: string;
-  methodObtain?: 'office' | 'courier';
-  deliveryDate?: Date;
-  addressRetail?: Address;
-  addressCourier?: Address;
-};
-
-export interface FormStateMap {
-  0: {
-    currency?: string;
-    paymentSystem?: string;
-    cardCategory?: Option;
-    codeWord?: string;
-  };
-  1: {
-    surname?: string;
-    name?: string;
-    middleName?: string;
-    sex?: string;
-    birthday?: Date;
-    birthPlace?: string;
-    phone?: string;
-    email?: string;
-    dulSerie?: number;
-    dulNumber?: number;
-    dulIssueDateField?: Date;
-    dulSubdivisionCode?: string;
-    dulIssuedBy?: string;
-    addressRegistration?: Address;
-    participantDateRegistration?: Date;
-    addressFact?: Address;
-    housing?: string;
-  };
-  2: {
-    amountWorkers?: Option;
-    beginDate?: Date;
-    employerActivities?: Option;
-    employerOrganization?: Option;
-    employment?: Option;
-    experience5Years?: string;
-    inn?: number;
-    jobsNumber?: string;
-    lastJobExperience?: string;
-    legalForm?: string;
-    organization?: Option;
-    organizationAddress?: Address;
-    organizationName?: string;
-    organizationPhone?: string;
-    partInBusiness?: number;
-    positionOrganization?: Option;
-  };
-  3: {
-    familyStatus?: Option;
-    dependents?: number;
-    familyMembers?: number;
-    confirmationIncome?: Option;
-    mandatoryIncome?: number;
-    otherPayments?: number;
-    snils?: string;
-    armyIdFlg?: boolean;
-  };
-  4: {
-    disablePeopleFlg?: boolean;
-    bankruptcyFlg?: boolean;
-    shareholderFlg?: boolean;
-    legalEntityName?: string;
-    creditInRshbCd?: Option;
-  };
-  5: FormStateDeliveryType;
-}
-
-export const formStateMap: FormStateMap = {
-  0: {
+export const formStateMap: Partial<FormState>[] = [
+  {
     paymentSystem: PAYMENT_SYSTEM_TYPES[0].id,
     currency: 'rub',
     codeWord: '',
   },
-  1: {
+  {
     surname: '',
     name: '',
     middleName: '',
@@ -105,18 +30,23 @@ export const formStateMap: FormStateMap = {
       fullAddress: '',
       fiasCode: '',
     },
-    housing: '',
+    housing: undefined,
+    methodObtain: 'office',
+    addressCourier: {
+      fullAddress: '',
+      fiasCode: '',
+    },
   },
-  2: {
+  {
     amountWorkers: { key: '', text: '' },
     beginDate: undefined,
     employerActivities: { key: '', text: '' },
     employerOrganization: { key: '', text: '' },
     employment: { key: '', text: '' },
-    experience5Years: '',
+    experience5Years: undefined,
     inn: undefined,
-    jobsNumber: '',
-    lastJobExperience: '',
+    jobsNumber: undefined,
+    lastJobExperience: undefined,
     legalForm: '',
     organization: { key: '', text: '' },
     organizationAddress: {
@@ -128,7 +58,7 @@ export const formStateMap: FormStateMap = {
     partInBusiness: undefined,
     positionOrganization: { key: '', text: '' },
   },
-  3: {
+  {
     familyStatus: { key: '', text: '' },
     dependents: undefined,
     familyMembers: undefined,
@@ -138,25 +68,25 @@ export const formStateMap: FormStateMap = {
     snils: '',
     armyIdFlg: false,
   },
-  4: {
+  {
     disablePeopleFlg: false,
     bankruptcyFlg: false,
     shareholderFlg: false,
     legalEntityName: '',
     creditInRshbCd: undefined,
   },
-  5: {
+  {
     regionRetail: '',
     addressRetail: {
       fullAddress: '',
       fiasCode: '',
     },
+    bankEmployeeCode: undefined,
     addressCourier: {
       fullAddress: '',
       fiasCode: '',
     },
-    bankEmployeeCode: '',
     methodObtain: 'office',
     deliveryDate: undefined,
   },
-};
+];

package/src/components/CreditCardForm/getCreditCardFormTaskData.ts

@@ -27,7 +27,9 @@ export const getCreditCardFormTaskData = ({
     task: {
       taskSource: globalThis.location.origin,
       id: taskId,
-      //TODO: Добавить id офиса
+      office: {
+        id: '650', // TODO: Remove hardcode
+      },
       authorizedAgentId: formData?.bankEmployeeCode,
       participants: [
         {

package/src/components/CreditCardForm/getInitialFormState.tsx

@@ -1,31 +1,29 @@
-import { formStateMap, type FormStateMap } from './formStateMap';
+import { type FormState } from '../ApplicationLeadForm/getInitialFormState';
+import { formStateMap } from './formStateMap';
 
-export const getInitialFormState = <Step extends keyof FormStateMap>(
-  step: Step,
+export const getInitialFormState = (
+  step: number,
   localStorageData: Record<string, any> | null,
-): FormStateMap[Step] => {
-  if (localStorageData) {
-    // TODO: Fill in for other fields with type Date
-    // TODO: Take it out to the helper
-    localStorageData.birthday = localStorageData.birthday
-      ? new Date(localStorageData.birthday as string)
-      : undefined;
-    localStorageData.dulIssueDateField = localStorageData.dulIssueDateField
-      ? new Date(localStorageData.dulIssueDateField as string)
-      : undefined;
-    localStorageData.participantDateRegistration = localStorageData.participantDateRegistration
-      ? new Date(localStorageData.participantDateRegistration as string)
-      : undefined;
-    localStorageData.beginDate = localStorageData?.beginDate
-      ? new Date(localStorageData.beginDate as string)
-      : undefined;
-    localStorageData.deliveryDate = localStorageData?.deliveryDate
-      ? new Date(localStorageData.deliveryDate as string)
-      : undefined;
+): FormState => ({
+  ...formStateMap[step],
+  ...localStorageData,
+  birthday: transformStringToData(localStorageData?.birthday as string),
+  dulIssueDateField: transformStringToData(localStorageData?.dulIssueDateField as string),
+  participantDateRegistration: transformStringToData(
+    localStorageData?.participantDateRegistration as string,
+  ),
+  beginDate: transformStringToData(localStorageData?.beginDate as string),
+  deliveryDate: transformStringToData(localStorageData?.deliveryDate as string),
+});
+
+const transformStringToData = (text?: string) => {
+  if (!text) {
+    return undefined;
   }
 
-  return {
-    ...formStateMap[step],
-    ...localStorageData,
-  };
+  try {
+    return new Date(text);
+  } catch (_) {
+    return undefined;
+  }
 };

package/src/components/CreditCardForm/getThirdStepData.tsx

@@ -35,6 +35,7 @@ export const getThirdStepData = (formData: FormState): Partial<Participant> => {
     generalSeniority: experience5Years,
     jobsNumber,
     lastWorkDuration: lastJobExperience,
+    payrollCardRshbFlg: true, // TODO: Remove hardcode
     positionCd: positionOrganization,
     participantContacts: getParticipantContacts({
       organizationPhone: organizationPhone && formatPhone(organizationPhone),

package/src/components/CreditCardForm/renderInfo.tsx

@@ -1,16 +1,10 @@
 import { InfoCard } from '../../ui-kit/InfoCard/InfoCard';
 import { type FieldDef } from '../ApplicationLeadForm/ApplicationLeadFormContent';
-import { type FormStateDeliveryType } from './formStateMap';
-import { getFilteredInputs } from './getFilteredInputs';
 
-export const renderInfo = (state?: FormStateDeliveryType, inputs: FieldDef[] = []) => {
+export const renderInfo = (inputs: FieldDef[] = []) => {
   const infoInputs = inputs.filter((_) => _.fieldType === 'info');
-  const filteredInputs = getFilteredInputs(
-    infoInputs,
-    state as FormStateDeliveryType,
-  ) as FieldDef[];
 
-  return filteredInputs.length
-    ? filteredInputs.map(({ text, name }, i) => <InfoCard key={`${name}_${i}`} __html={text} />)
+  return infoInputs.length
+    ? infoInputs.map(({ text, name }, i) => <InfoCard key={`${name}_${i}`} __html={text} />)
     : null;
 };

package/src/components/CreditCardForm/renderInputs.tsx

@@ -1,5 +1,12 @@
+import { type FormFieldRegisterer } from '../../hooks/useForm';
 import { getField } from '../../ui-kit/FormField/getField';
-import { type RenderInputsProps } from './CreditCardFormContent';
+import { type FieldDef } from '../ApplicationLeadForm/ApplicationLeadFormContent';
+import { type FormState } from '../ApplicationLeadForm/getInitialFormState';
+
+export interface RenderInputsProps {
+  inputs: FieldDef[];
+  field: FormFieldRegisterer<FormState>;
+}
 
 export const renderInputs = ({ field, inputs }: RenderInputsProps) =>
-  (inputs || [])?.map(getField(field, ''));
+  inputs.map(getField(field, ''));

package/src/components/CreditCardForm/renderStep.tsx

@@ -2,25 +2,37 @@ import { type FormFieldRegisterer, type FormOperatorProps } from '../../hooks/us
 import { inputColumnStyles } from '../../ui-kit/FormField/inputColumnStyle';
 import { renderTitle } from '../../ui-kit/FormField/renderTitle';
 import { style } from '../../utils/style';
+import { type FormState } from '../ApplicationLeadForm/getInitialFormState';
+import { calculateInputs, checkCondition, type GetValue } from './calculateInputs';
 import { type CreditCardSectionsProps } from './CreditCardFormContent';
-import { type FormStateDeliveryType, type FormStateMap } from './formStateMap';
 import { renderInfo } from './renderInfo';
 import { renderInputs } from './renderInputs';
 
-export type CustomSubmit = FormOperatorProps<FormStateMap[keyof FormStateMap]>['onSubmit'];
+export type CustomSubmit = FormOperatorProps<FormState>['onSubmit'];
 
 export interface StepProps {
   sections?: CreditCardSectionsProps[];
-  field: FormFieldRegisterer<FormStateMap[keyof FormStateMap]>;
+  field: FormFieldRegisterer<FormState>;
   registerSubmit?: (submit: CustomSubmit) => void;
-  userInputParams?: FormStateDeliveryType;
+  step: number;
 }
 
-export const renderStep = ({ sections, field, userInputParams }: StepProps) =>
-  sections?.map(({ inputs, columns, title }, i) => (
-    <div key={`section-${i}`} className={style(inputColumnStyles(columns), 'grid gap-x-m')}>
-      {renderInfo(userInputParams, inputs)}
-      {renderTitle(title)}
-      {renderInputs({ field, inputs })}
-    </div>
-  ));
+export const renderStep = ({ sections, field, step }: StepProps) =>
+  sections?.map(({ inputs: origInputs = [], columns, title }, i) => {
+    const inputs = calculateInputs(getValue(field))(origInputs, step);
+
+    const filteredInputs = inputs.filter((_) => !checkCondition(_, getValue(field)));
+
+    return (
+      <div key={`section-${i}`} className={style(inputColumnStyles(columns), 'grid gap-x-m')}>
+        {renderInfo(filteredInputs)}
+        {renderTitle(title)}
+        {renderInputs({ field, inputs })}
+      </div>
+    );
+  });
+
+const getValue =
+  (field: FormFieldRegisterer<FormState>): GetValue =>
+  (name) =>
+    field(name)?.value;

package/src/components/CreditCardForm/useCreditCardFormAPI.tsx

@@ -5,9 +5,9 @@ import { getObjectValidator } from '../../ui-kit/FormField/getObjectValidator';
 import { objectValidator } from '../../validation/objectValidator';
 import { isValidationSuccess } from '../../validation/validator';
 import { type FieldDef } from '../ApplicationLeadForm/ApplicationLeadFormContent';
-import { type FormStateMap } from './formStateMap';
+import { type FormState } from '../ApplicationLeadForm/getInitialFormState';
+import { calculateInputs, type GetValue } from './calculateInputs';
 import { getCreditCardFormTaskData } from './getCreditCardFormTaskData';
-import { getFilteredInputs } from './getFilteredInputs';
 
 type CreditCardFormApiProps = {
   step: number;
@@ -28,11 +28,11 @@ export const useCreditCardFormAPI = ({
   const [profileId] = useLocalStorage<number>('profileId');
   const [participantId] = useLocalStorage<number>('participantId');
 
-  const handleSubmit = useCallback(async (formData: FormStateMap[keyof FormStateMap]) => {
-    const inputsFiltered = getFilteredInputs(inputs, formData);
+  const handleSubmit = useCallback(async (formData: FormState) => {
     const feedbackValidator = objectValidator(
-      getObjectValidator(calculateInputs(formData, inputsFiltered, step)),
+      getObjectValidator(calculateInputs(getValue(formData))(inputs, step)),
     );
+    console.log(getObjectValidator(calculateInputs(getValue(formData))(inputs, step)));
     if (!isValidationSuccess(feedbackValidator(formData))) {
       return console.warn('validation fail');
     }
@@ -69,9 +69,7 @@ export const useCreditCardFormAPI = ({
   };
 };
 
-const calculateInputs = (
-  formData: FormStateMap[keyof FormStateMap],
-  inputs: FieldDef[],
-  step: number,
-) =>
-  step === 2 && 'employment' in formData && formData?.employment?.key === 'RETIREE' ? [] : inputs;
+const getValue =
+  (formData: FormState): GetValue =>
+  (name) =>
+    formData[name];

package/src/components/CreditForm/CreditForm.tsx

@@ -1,11 +1,9 @@
 import { JSX } from '@redneckz/uni-jsx';
 import { useCallback, useEffect, useMemo, useState } from '@redneckz/uni-jsx/lib/hooks';
 import { updateRefreshToken } from '../../api/RetailAPI/updateRefreshToken';
-import { type SectionsProps } from '../../model/InputSectionsType';
 import { BlockWrapper } from '../../ui-kit/BlockWrapper';
 import { type UniBlockProps } from '../../UniBlock/UniBlockProps';
 import { style } from '../../utils/style';
-import { type FieldDef } from '../ApplicationLeadForm/ApplicationLeadFormContent';
 import { CalculatorCredit } from '../CalculatorCredit/CalculatorCredit';
 import { type CreditFormContent } from './CreditFormContent';
 import { CreditFormProgress } from './CreditFormProgress';
@@ -41,8 +39,6 @@ export const CreditForm = JSX<CreditFormWizardProps>(({ className, ...rest }) =>
 
   const sections = useMemo(() => stepsSectionsMap[step], [step]);
 
-  const inputs = (sections?.flatMap((_: SectionsProps) => _?.inputs) || []) as FieldDef[];
-
   const isStartStep = step === 0;
   const [isFormFinished, setIsFormFinished] = useState(false);
 
@@ -56,7 +52,6 @@ export const CreditForm = JSX<CreditFormWizardProps>(({ className, ...rest }) =>
           <CreditFormStep
             key={String(step)}
             step={step}
-            inputs={inputs}
             sections={sections}
             onNextStep={handleNextStep}
             onPrevStep={handlePrevStep}
@@ -67,11 +62,10 @@ export const CreditForm = JSX<CreditFormWizardProps>(({ className, ...rest }) =>
                 ? ({ registerSubmit, field }) => (
                     <CalculatorCredit
                       {...{
-                        // TODO: Remove "as never"
                         defaultParams: {
-                          sum: field('moneyValue' as never).value,
-                          period: field('monthsValue' as never).value,
-                          isAnnuity: field('isAnnuity' as never).value,
+                          sum: field('moneyValue').value,
+                          period: field('monthsValue').value,
+                          isAnnuity: field('isAnnuity').value,
                         },
                         title: 'Калькулятор кредита',
                         footnote:

package/src/components/CreditForm/CreditFormContent.ts

@@ -1,9 +1,6 @@
-import { type FormFieldRegisterer } from '../../hooks/useForm';
 import { type TitleProps } from '../../model/HeadlineType';
 import { type InputSectionsType } from '../../model/InputSectionsType';
 import { type UniBlockContent } from '../../UniBlock/UniBlockProps';
-import { type FieldDef } from '../ApplicationLeadForm/ApplicationLeadFormContent';
-import { type FormStateMap } from './formStateMap';
 
 /**
  * @title Форма заявки на потребительский кредит настраиваемая
@@ -14,9 +11,3 @@ export type CreditFormContent = UniBlockContent &
     /** @title Номер кредитной программы */
     programId?: string;
   };
-
-/** @hidden */
-export interface RenderInputsProps {
-  inputs?: FieldDef[];
-  field: FormFieldRegisterer<FormStateMap[keyof FormStateMap]>;
-}

package/src/components/CreditForm/CreditFormStep.tsx

@@ -4,8 +4,8 @@ import { useForm } from '../../hooks/useForm';
 import { useLocalStorage } from '../../hooks/useLocalStorage';
 import { type SectionsProps } from '../../model/InputSectionsType';
 import { type FieldDef } from '../ApplicationLeadForm/ApplicationLeadFormContent';
+import { type FormState } from '../ApplicationLeadForm/getInitialFormState';
 import { CreditFormStatusTracker } from './CreditFormStatusTracker';
-import { type FormStateMap } from './formStateMap';
 import { getInitialFormState } from './getInitialFormState';
 import { renderStep as defaultRenderStep, type CustomSubmit, type StepProps } from './renderStep';
 import { StepsNavigationButtons } from './StepsNavigationButtons';
@@ -14,7 +14,6 @@ import { useCreditFormAPI } from './useCreditFormAPI';
 export interface CreditFormStepProps {
   step: number;
   sections: SectionsProps[];
-  inputs: FieldDef[];
   onNextStep: () => void;
   onPrevStep: () => void;
   renderStep?: (props: StepProps) => JSX.Element | JSX.Element[] | undefined;
@@ -28,16 +27,17 @@ export const CreditFormStep = JSX<CreditFormStepProps>(
     sections,
     onPrevStep,
     onNextStep,
-    inputs,
     renderStep = defaultRenderStep,
     isFormFinished,
     finishForm,
   }) => {
     const [localStorageData, saveStep] = useLocalStorage<Record<string, any>>('leadForm');
-    const initialState = getInitialFormState(step as keyof FormStateMap, localStorageData);
+    const initialState = getInitialFormState(step, localStorageData);
 
     const customSubmit = useRef<CustomSubmit | undefined>(undefined);
 
+    const inputs = (sections?.flatMap((_: SectionsProps) => _?.inputs) || []) as FieldDef[];
+
     const registerSubmit = useCallback((submit?: CustomSubmit) => {
       customSubmit.current = submit;
     }, []);
@@ -52,7 +52,7 @@ export const CreditFormStep = JSX<CreditFormStepProps>(
 
     const [, { field, onSubmit }] = useForm(initialState, {
       onSubmit: (formData, ev) => {
-        handleSubmit({ ...formData, ...customSubmit.current?.(ev) });
+        handleSubmit({ ...formData, ...customSubmit.current?.(ev) } as FormState);
       },
     });
 
@@ -60,7 +60,7 @@ export const CreditFormStep = JSX<CreditFormStepProps>(
       <CreditFormStatusTracker />
     ) : (
       <form onSubmit={onSubmit} className="space-y-m">
-        {renderStep({ sections, field, registerSubmit })}
+        {renderStep({ sections, field, step, registerSubmit })}
         <StepsNavigationButtons step={step} onPrevStep={onPrevStep} />
       </form>
     );

package/src/components/CreditForm/calculateInputs.ts

@@ -0,0 +1,44 @@
+import { type Option } from '../../ui-kit/Select/Option';
+import { type FieldDef } from '../ApplicationForm/ApplicationFormContent';
+import { type FormState } from '../ApplicationLeadForm/getInitialFormState';
+
+export type GetValue = <K extends keyof FormState>(name: K) => FormState[K];
+
+export const calculateInputs = (getValue: GetValue) => (inputs: FieldDef[], step: number) =>
+  inputs
+    .filter((_) => _)
+    .map((_) => {
+      if (
+        [
+          checkIsRetiree(step, getValue),
+          checkBusinessOwner(_, getValue),
+          checkConsentPfrFlg(_, getValue),
+          checkAddressFillFromESIA(_, getValue),
+          checkCondition(_, getValue),
+        ].some(Boolean)
+      ) {
+        return { ..._, required: false };
+      }
+
+      return _;
+    });
+
+const checkIsRetiree = (step: number, getValue: GetValue) =>
+  step === 2 && getValue('employment')?.key === 'RETIREE';
+
+const checkBusinessOwner = ({ name }: FieldDef, getValue: GetValue) =>
+  name === 'partInBusiness' && getValue('positionOrganization')?.key !== 'BUSINESS_OWNER';
+
+const checkConsentPfrFlg = ({ name }: FieldDef, getValue: GetValue) =>
+  name === 'snils' && !getValue('consentPfrFlg');
+
+const checkAddressFillFromESIA = ({ name, filledByEsia }: FieldDef, getValue: GetValue) =>
+  name?.startsWith('address') && getValue('esiaAccountTypeCd')?.key && filledByEsia;
+
+export const checkCondition = ({ condition }: FieldDef, getValue: GetValue) =>
+  condition?.name &&
+  condition?.values?.some((_) => {
+    const dataValue = getValue(condition?.name);
+
+    return _ !== ((dataValue as Option)?.key ?? dataValue);
+  });

package/src/components/CreditForm/creditFormStepsData.tsx

@@ -23,8 +23,8 @@ export const stepsSectionsMap: SectionsProps[][] = [
         { fieldType: 'common', name: 'middleName', dadata: true, filledByEsia: true },
         { fieldType: 'common', name: 'sex', required: true },
         { fieldType: 'common', name: 'birthday', required: true, filledByEsia: true },
-        { fieldType: 'common', name: 'birthPlace', required: true },
-        { fieldType: 'common', name: 'phone', required: true },
+        { fieldType: 'common', name: 'birthPlace', required: true, filledByEsia: true },
+        { fieldType: 'common', name: 'phone', required: true, filledByEsia: true },
         { fieldType: 'common', name: 'email', required: true, dadata: true },
       ],
     },