@redneckz/wildless-cms-uni-blocks 0.14.660 → 0.14.661

package/src/components/CreditForm/CreditForm.fixture.tsx

@@ -3,12 +3,16 @@ import { DialogManager } from '../../ui-kit/DialogManager/DialogManager';
 import { PopupManager } from '../../ui-kit/PopupManager/PopupManager';
 import { CreditForm } from './CreditForm';
 
-const MOCK_TOKEN = 'mockKEY';
+const MOCK_TOKEN = 'mock-key';
 const MOCK_TASK_ID = '111111';
 
-globalThis.sessionStorage?.setItem('refreshToken', MOCK_TOKEN);
-globalThis.sessionStorage?.setItem('accessToken', MOCK_TOKEN);
-globalThis.localStorage.setItem('taskId', MOCK_TASK_ID);
+const refreshToken = globalThis.sessionStorage?.getItem('refreshToken');
+const accessToken = globalThis.sessionStorage?.getItem('accessToken');
+const taskId = globalThis.localStorage.getItem('taskId');
+
+!refreshToken && globalThis.sessionStorage?.setItem('refreshToken', MOCK_TOKEN);
+!accessToken && globalThis.sessionStorage?.setItem('accessToken', MOCK_TOKEN);
+!taskId && globalThis.localStorage.setItem('taskId', MOCK_TASK_ID);
 
 export default {
   default: (

package/src/components/CreditForm/CreditFormStatus.tsx

@@ -15,6 +15,7 @@ type CreditFormStatusProps = UniBlockProps & {
   title?: string;
   description?: string;
   interval?: number;
+  intervalExpireAction?: () => void;
   sectionInfoTitle?: string;
   sectionInfo?: (LabelProps & DescriptionProps)[];
   sectionAdditionalTitle?: string;
@@ -34,36 +35,48 @@ export const CreditFormStatus = JSX<CreditFormStatusProps>(
     sectionInfoAdditional,
     buttonText,
     interval,
+    intervalExpireAction = () => {
+      return;
+    },
     ...props
-  }) => (
-    <BlockWrapper {...props}>
-      <div className="flex flex-col md:flex-row items-center">
-        <Headline
-          headlineVersion="M"
-          title={title}
-          description={dsc}
-          align="text-left"
-          padding="p-xl"
-          className="w-full"
-        />
-        {interval ? <TimerCircle interval={interval} /> : null}
-      </div>
-      <SectionInfo title={sectionInfoTitle} items={sectionInfo} />
-      <SectionInfo title={sectionAdditionalTitle} items={sectionInfoAdditional} countColumns />
-      {infoCard?.__html ? (
-        <InfoCard
-          __html={infoCard?.__html}
-          icon={infoCard?.icon}
-          link={{
-            text: infoCard?.link?.text,
-          }}
-        />
-      ) : null}
-      {buttonText ? (
-        <LinkButton href="/natural" text={buttonText} version="primary" className="w-full mt-lg" />
-      ) : null}
-    </BlockWrapper>
-  ),
+  }) => {
+    return (
+      <BlockWrapper {...props}>
+        <div className="flex flex-col md:flex-row items-center">
+          <Headline
+            headlineVersion="M"
+            title={title}
+            description={dsc}
+            align="text-left"
+            padding="p-xl"
+            className="w-full"
+          />
+          {interval ? (
+            <TimerCircle interval={interval} intervalExpireAction={intervalExpireAction} />
+          ) : null}
+        </div>
+        <SectionInfo title={sectionInfoTitle} items={sectionInfo} />
+        <SectionInfo title={sectionAdditionalTitle} items={sectionInfoAdditional} countColumns />
+        {infoCard?.__html ? (
+          <InfoCard
+            __html={infoCard?.__html}
+            icon={infoCard?.icon}
+            link={{
+              text: infoCard?.link?.text,
+            }}
+          />
+        ) : null}
+        {buttonText ? (
+          <LinkButton
+            href="/natural"
+            text={buttonText}
+            version="primary"
+            className="w-full mt-lg"
+          />
+        ) : null}
+      </BlockWrapper>
+    );
+  },
 );
 
 const SectionInfo = ({

package/src/components/CreditForm/CreditFormStatusTracker.tsx

@@ -36,15 +36,17 @@ export const CreditFormStatusTracker = JSX(() => {
     return () => clearInterval(pullingInterval);
   }, []);
 
-  return renderStatus(status);
+  const handleExpire = () => setStatus(STATUS_TYPE.rework);
+
+  return renderStatus(status, handleExpire);
 });
 
-const renderStatus = (status: STATUS_TYPE) => {
+const renderStatus = (status: STATUS_TYPE, handleExpire: () => void) => {
   const statusesMap: Record<STATUS_TYPE, JSX.Element> = {
-    IN_PROCESS: <PendingStatusContent />,
-    FAILED: <FailedStatusContent />,
-    OK: <SuccessStatusContent />,
-    REWORK: <ReworkStatusContent />,
+    IN_PROCESS: <PendingStatusContent handleExpireTimer={handleExpire} />,
+    CANCELLED: <FailedStatusContent />,
+    APPROVED: <SuccessStatusContent />,
+    REVISION: <ReworkStatusContent />,
   };
 
   return statusesMap[status] || null;

package/src/components/CreditForm/PendingStatusContent.tsx

@@ -2,37 +2,40 @@ import { JSX } from '@redneckz/uni-jsx';
 import { useLocalStorage } from '../../hooks/useLocalStorage';
 import { CreditFormStatus } from './CreditFormStatus';
 
-export const PendingStatusContent = JSX(() => {
-  const [leadForm] = useLocalStorage<Record<string, any>>('leadForm');
+export const PendingStatusContent = JSX(
+  ({ handleExpireTimer }: { handleExpireTimer: () => void }) => {
+    const [leadForm] = useLocalStorage<Record<string, any>>('leadForm');
 
-  return (
-    <CreditFormStatus
-      interval={300}
-      title="Заявка успешно отправлена"
-      description="Не закрывайте окно, скоро сообщим результат"
-      sectionInfoTitle="Заявленные условия по кредиту"
-      sectionInfo={[
-        {
-          label: 'Название продукта',
-          description: 'Кредит на любые цели',
-        },
-        {
-          label: 'Цель кредита',
-          description: 'На любые цели',
-        },
-        {
-          label: 'Сумма',
-          description: leadForm?.moneyValue?.toLocaleString() + ' ₽',
-        },
-        {
-          label: 'Срок кредита',
-          description: leadForm?.monthsValue + ' мес',
-        },
-        {
-          label: 'Тип платежа',
-          description: leadForm?.isAnnuity ? 'Аннуитетный' : 'Дифференцированный',
-        },
-      ]}
-    />
-  );
-});
+    return (
+      <CreditFormStatus
+        interval={300}
+        intervalExpireAction={handleExpireTimer}
+        title="Заявка успешно отправлена"
+        description="Не закрывайте окно, скоро сообщим результат"
+        sectionInfoTitle="Заявленные условия по кредиту"
+        sectionInfo={[
+          {
+            label: 'Название продукта',
+            description: 'Кредит на любые цели',
+          },
+          {
+            label: 'Цель кредита',
+            description: 'На любые цели',
+          },
+          {
+            label: 'Сумма',
+            description: leadForm?.moneyValue?.toLocaleString() + ' ₽',
+          },
+          {
+            label: 'Срок кредита',
+            description: leadForm?.monthsValue + ' мес',
+          },
+          {
+            label: 'Тип платежа',
+            description: leadForm?.isAnnuity ? 'Аннуитетный' : 'Дифференцированный',
+          },
+        ]}
+      />
+    );
+  },
+);

package/src/components/CreditForm/calculateInputs.ts

@@ -14,6 +14,7 @@ export const calculateInputs = (getValue: GetValue) => (inputs: FieldDef[], step
           checkBusinessOwner(_, getValue),
           checkConsentPfrFlg(_, getValue),
           checkAddressFillFromESIA(_, getValue),
+          checkAddressFact(_, getValue),
           checkCondition(_, getValue),
         ].some(Boolean)
       ) {
@@ -35,6 +36,9 @@ const checkConsentPfrFlg = ({ name }: FieldDef, getValue: GetValue) =>
 const checkAddressFillFromESIA = ({ name, filledByEsia }: FieldDef, getValue: GetValue) =>
   name?.startsWith('address') && getValue('esiaAccountTypeCd')?.key && filledByEsia;
 
+const checkAddressFact = ({ name }: FieldDef, getValue: GetValue) =>
+  name === 'addressFact' && getValue('addressMatch');
+
 export const checkCondition = ({ condition }: FieldDef, getValue: GetValue) =>
   condition?.name &&
   condition?.values?.some((_) => {

package/src/ui-kit/FormField/getObjectValidator.tsx

@@ -3,6 +3,7 @@ import { type Validator } from '../../validation/validator';
 import { getNamesFromInput } from './getNamesFromInput';
 import {
   addressDaDataValidator,
+  addressOrganizationValidator,
   agreementValidator,
   codeWordValidator,
   defaultSelectValidator,
@@ -83,7 +84,7 @@ export const validatorObj: Record<string, Validator> = {
   armyIdFlg: agreementValidator,
   sex: defaultValidator('Укажите свой пол'),
   addressRegistration: addressDaDataValidator(),
-  organizationAddress: addressDaDataValidator(),
+  organizationAddress: addressOrganizationValidator(),
   participantDateRegistration: defaultValidator('Укажите дату регистрации'),
   retirementIncome: defaultValidator(),
   otherIncome: defaultValidator(),

package/src/ui-kit/FormField/validators.ts

@@ -71,6 +71,12 @@ const addressDaDataValidate = (address: Address) =>
 
 export const addressDaDataValidator = () =>
   validator(addressDaDataValidate)('Укажите регион, город/населенный пункт, улицу, дом, квартиру');
+
+export const addressOrganizationValidator = () =>
+  validator((address: Address) => Boolean(address.fiasCode && address.city && address.house))(
+    'Укажите регион, город/населенный пункт, улицу, дом',
+  );
+
 export const codeWordValidator = (errorMsg?: string) =>
   validator(
     (_) =>

package/src/ui-kit/TimerCircle/Timer.tsx

@@ -3,7 +3,7 @@ import { useEffect } from '@redneckz/uni-jsx/lib/hooks';
 
 interface TimerProps {
   time: number;
-  setTime: React.Dispatch<React.SetStateAction<number>>;
+  setTime: (value: number) => void;
   interval?: number;
   className?: string;
 }

package/src/ui-kit/TimerCircle/TimerCircle.tsx

@@ -7,36 +7,46 @@ import { Timer } from './Timer';
 
 interface TimerCircleProps {
   interval?: number;
+  intervalExpireAction?: () => void | null;
   title?: string;
   __html?: string;
 }
 
-export const TimerCircle = JSX<TimerCircleProps>(({ interval = 0, title, __html }) => {
-  const [time, setTime] = useState(interval);
+export const TimerCircle = JSX<TimerCircleProps>(
+  ({ interval = 0, intervalExpireAction = () => null, title, __html }) => {
+    const [time, setTime] = useState(interval);
 
-  const gradientPercentage = 100 - ((interval - time) / interval) * 100;
+    const setTimeWithHandleExpire = (value: number) => {
+      if (value === 0) {
+        intervalExpireAction();
+      }
+      setTime(value);
+    };
 
-  return (
-    <div>
-      {title ? <Headline title={title} headlineVersion="S" /> : null}
-      <div className="flex justify-center items-center flex-col">
-        <div
-          className={style(
-            `relative flex items-center justify-center w-24 h-24 rounded-full bg-gray text-transparent mb-5`,
-          )}
-        >
+    const gradientPercentage = 100 - ((interval - time) / interval) * 100;
+
+    return (
+      <div>
+        {title ? <Headline title={title} headlineVersion="S" /> : null}
+        <div className="flex justify-center items-center flex-col">
           <div
-            className="absolute inset-0 rounded-full"
-            style={{
-              background: `conic-gradient(rgb(66, 171, 68) ${gradientPercentage}%, rgb(125, 126, 127) 0deg)`,
-            }}
-          />
-          <div className="z-10 flex items-center justify-center px-4 py-2 rounded-full w-20 h-20 bg-white text-primary-text text-m">
-            <Timer interval={interval} time={time} setTime={setTime} />
+            className={style(
+              `relative flex items-center justify-center w-24 h-24 rounded-full bg-gray text-transparent mb-5`,
+            )}
+          >
+            <div
+              className="absolute inset-0 rounded-full"
+              style={{
+                background: `conic-gradient(rgb(66, 171, 68) ${gradientPercentage}%, rgb(125, 126, 127) 0deg)`,
+              }}
+            />
+            <div className="z-10 flex items-center justify-center px-4 py-2 rounded-full w-20 h-20 bg-white text-primary-text text-m">
+              <Timer interval={interval} time={time} setTime={setTimeWithHandleExpire} />
+            </div>
           </div>
+          {__html ? <RichText __html={__html} /> : null}
         </div>
-        {__html ? <RichText __html={__html} /> : null}
       </div>
-    </div>
-  );
-});
+    );
+  },
+);