@redneckz/wildless-cms-uni-blocks 0.14.231 → 0.14.233

package/mobile/src/components/Calculator/CreditCalculatorForm.tsx

@@ -1,9 +1,11 @@
 /* eslint-disable max-lines, max-lines-per-function */
 import { JSX } from '@redneckz/uni-jsx';
+import { useEffect } from '@redneckz/uni-jsx/lib/hooks';
 import { type JSONRefObject } from '../../data/JSONRefObject';
 import { useForm, type FormFieldRegisterer } from '../../hooks/useForm';
 import { Checkbox } from '../../ui-kit/Checkbox/Checkbox';
 import { renderButtonsSection } from '../../ui-kit/LinkButton/renderButtonsSection';
+import { clamp } from '../../utils/clamp';
 import {
   type CreditCalculatorParamsViewSettings,
   type CreditCalculatorProps,
@@ -53,6 +55,27 @@ export const CreditCalculatorForm = JSX<CreditCalculatorProp>(
       ...field('isAnnuity'),
     });
 
+    const { onChange: setMoneyValue } = field('moneyValue');
+    const { onChange: setMonthsValue } = field('monthsValue');
+
+    useEffect(() => {
+      setMoneyValue &&
+        setMoneyValue(
+          clamp(userInputParams.moneyValue, calculatorParams.minSum, calculatorParams.maxSum),
+        );
+    }, [calculatorParams.minSum, calculatorParams.maxSum]);
+
+    useEffect(() => {
+      setMonthsValue &&
+        setMonthsValue(
+          clamp(
+            userInputParams.monthsValue,
+            calculatorParams.minMonths,
+            calculatorParams.maxMonths,
+          ),
+        );
+    }, [calculatorParams.minMonths, calculatorParams.maxMonths]);
+
     return (
       <CalculatorFormLayout
         className={className}

package/mobile/src/components/ExchangeRateTile/useFetchExchangeRateData.ts

@@ -1,6 +1,6 @@
 import { useAsyncData } from '@redneckz/uni-jsx/lib/hooks/useAsyncData';
 import { type ExchangeCurrencyItem } from '../../components/ExchangeRateTile/ExchangeCurrencyCalculator';
-import { type RegionData } from '../../hooks/useLocation';
+import { type Region } from '../../hooks/useRegions';
 import { fetchJSONUnsafe, type FetchJSONUnsafeType } from '../../utils/fetchJSON';
 
 export interface ExchangeData {
@@ -12,7 +12,7 @@ export interface ExchangeData {
 
 const EXCHANGE_RATES_URL = '/api/v1/exchangerates';
 
-export function useFetchExchangeRateData(currentRegion: RegionData) {
+export function useFetchExchangeRateData(currentRegion: Region) {
   const regionCode = currentRegion?.code || '000';
 
   const { data } = useAsyncData(

package/mobile/src/components/StickyBottomMenu/BurgerMenuDialog.tsx

@@ -3,7 +3,8 @@ import { useCallback, useEffect, useMemo, useState } from '@redneckz/uni-jsx/lib
 import { type RefObject } from 'react';
 import { type SitemapData } from '../../data/SitemapData';
 import { useActiveRoute } from '../../hooks/useActiveRoute';
-import { useLocation, type RegionData } from '../../hooks/useLocation';
+import { useLocation } from '../../hooks/useLocation';
+import { type Region } from '../../hooks/useRegions';
 import { type LinkProps } from '../../model/LinkProps';
 import { Dialog } from '../../ui-kit/DialogManager/Dialog';
 import { Heading } from '../../ui-kit/Heading/Heading';
@@ -110,7 +111,7 @@ const renderOfficeLink = (officesLink?: string) =>
     </a>
   ) : null;
 
-const renderLocation = (location: RegionData, onClick?: () => void) => (
+const renderLocation = (location: Region, onClick?: () => void) => (
   <div className="flex items-center text-s cursor-pointer" onClick={onClick}>
     <Img
       image={{ icon: 'GeolocationIcon', iconVersion: 'black' }}

package/mobile/src/hooks/useLocation.ts

@@ -3,33 +3,26 @@ import { useAsyncData } from '@redneckz/uni-jsx/lib/hooks/useAsyncData';
 import { defaultEventBus } from '../EventBus/defaultEventBus';
 import { useLatestEvent } from '../EventBus/useLatestEvent';
 import { fetchJSONUnsafe, type FetchJSONUnsafeType } from '../utils/fetchJSON';
+import { type Region } from './useRegions';
 
 const REGION_URL = '/api/v1/region';
-
-export interface RegionData {
-  id?: number;
-  code?: string;
-  name?: string;
-  slug?: string;
-}
-
 const LOCATION_STORAGE_KEY = 'location';
 
-export function useLocation(defaultLocation = 'Москва'): [RegionData, (_: RegionData) => void] {
+export function useLocation(defaultLocation = 'Москва'): [Region, (_: Region) => void] {
   const [currentLocation, fireCurrentLocation] = useLatestEvent(
     defaultEventBus,
     'location',
     restoreLocation() ?? { name: defaultLocation },
   );
 
-  const selectCurrentLocation = useCallback((_: RegionData) => {
+  const selectCurrentLocation = useCallback((_: Region) => {
     storeLocation(_);
     fireCurrentLocation(_);
   }, []);
 
   const { data } = useAsyncData(
     hasStoredLocation() ? null : REGION_URL,
-    fetchJSONUnsafe as FetchJSONUnsafeType<RegionData>,
+    fetchJSONUnsafe as FetchJSONUnsafeType<Region>,
   );
   useEffect(() => {
     if (data && !hasStoredLocation()) {
@@ -42,7 +35,7 @@ export function useLocation(defaultLocation = 'Москва'): [RegionData, (_:
 
 const hasStoredLocation = () => Boolean(globalThis.localStorage?.getItem(LOCATION_STORAGE_KEY));
 
-const restoreLocation = (): RegionData | null => {
+const restoreLocation = (): Region | null => {
   try {
     const data = globalThis.localStorage?.getItem(LOCATION_STORAGE_KEY);
 
@@ -52,7 +45,7 @@ const restoreLocation = (): RegionData | null => {
   }
 };
 
-const storeLocation = (_: RegionData) => {
+const storeLocation = (_: Region) => {
   try {
     globalThis.localStorage?.setItem(LOCATION_STORAGE_KEY, JSON.stringify(_));
   } catch (ex) {

package/mobile/src/hooks/useRegions.ts

@@ -7,6 +7,7 @@ export interface Region {
   id?: number;
   code?: string;
   name?: string;
+  slug?: string;
 }
 
 export function useRegions(): Region[] {

package/mobile/src/ui-kit/LinkWrapper/LinkWrapper.tsx

@@ -8,12 +8,13 @@ interface LinkWrapperProps {
   href?: string;
   target?: Target;
   isRemote?: boolean;
+  onClick?: () => void;
 }
 
 export const LinkWrapper = JSX<LinkWrapperProps>(
-  ({ className = '', href, target, isRemote = false, children }) => {
+  ({ className = '', href, target, isRemote = false, onClick, children }) => {
     const link = useLink({ isRemote });
-    const linkProps = link({ href, target });
+    const linkProps = link({ href, target, onClick });
     const Tag = href ? 'a' : 'div';
 
     return (

package/mobile/src/ui-kit/LocationDialog/LocationDialog.tsx

@@ -4,11 +4,12 @@ import { type ForeignOfficeProps } from '../../data/SitemapData';
 import { useLink } from '../../hooks/useLink';
 import { useLocation } from '../../hooks/useLocation';
 import { useRegions, type Region } from '../../hooks/useRegions';
-import { LinkButton } from '../../ui-kit/LinkButton/LinkButton';
 import { groupBy } from '../../utils/groupBy';
 import { jaroWinklerDistance } from '../../utils/jaroWinklerDistance';
 import { Dialog } from '../DialogManager/Dialog';
 import { useDialogManager } from '../DialogManager/useDialogManager';
+import { LinkWrapper } from '../LinkWrapper/LinkWrapper';
+import { Paragraph } from '../Paragraph/Paragraph';
 import { Text } from '../Text/Text';
 import { renderForeignOffices } from './renderForeignOffices';
 import { renderRegion } from './renderRegion';
@@ -25,7 +26,7 @@ export interface LocationDialogProps {
 export const LocationDialog = JSX<LocationDialogProps>(({ foreignOffices, defaultLocation }) => {
   const [currentLocation, selectCurrentLocation] = useLocation(defaultLocation);
 
-  const link = useLink({ isRemote: true, basePath: '/' });
+  const link = useLink({ isRemote: true });
   const { href } = link({ href: `/branches/${currentLocation.slug}` });
 
   const [query, setQuery] = useState('');
@@ -52,12 +53,12 @@ export const LocationDialog = JSX<LocationDialogProps>(({ foreignOffices, defaul
           </Text>
           {currentLocation ? (
             <div className="mb-s">
-              <Text size="text-l" font="font-light">
-                Сейчас выбран:&nbsp;
-              </Text>
-              <LinkButton href={href} onClick={() => selectCurrentLocation(currentLocation)}>
-                <Text color="text-primary-main">{currentLocation.name}</Text>
-              </LinkButton>
+              <Paragraph size="text-l" color="text-primary-text">
+                Сейчас выбран:
+                <LinkWrapper isRemote href={href} className="inline mx-2xs text-primary-main">
+                  {currentLocation.name}
+                </LinkWrapper>
+              </Paragraph>
             </div>
           ) : null}
           <SearchBar onSearch={setQuery} searchTerm={query} />

package/mobile/src/ui-kit/LocationDialog/renderRegion.tsx

@@ -1,19 +1,20 @@
 import { type Region } from '../../hooks/useRegions';
+import { LinkWrapper } from '../LinkWrapper/LinkWrapper';
 import { Text } from '../Text/Text';
 
 export const renderRegion = (onChangeLocation?: (region: Region) => void) => (region: Region) =>
-  (
-    <div key={region.id} className="mb-xs sm:mb-2xs">
-      <button
-        className="cursor-pointer hover:text-primary-hover"
-        onClick={() => {
-          onChangeLocation && onChangeLocation(region);
-        }}
-        type="button"
-      >
-        <Text size="text-l" font="font-light">
-          {region.name || ''}
-        </Text>
-      </button>
-    </div>
-  );
+  region.name ? (
+    <LinkWrapper
+      key={String(region.id)}
+      isRemote
+      href={`/branches/${region.slug}`}
+      className="mb-xs sm:mb-2xs hover:text-primary-hover"
+      onClick={() => {
+        onChangeLocation && onChangeLocation(region);
+      }}
+    >
+      <Text size="text-l" font="font-light">
+        {region.name}
+      </Text>
+    </LinkWrapper>
+  ) : null;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@redneckz/wildless-cms-uni-blocks",
-  "version": "0.14.231",
+  "version": "0.14.233",
   "private": false,
   "license": "MIT",
   "author": "ЦК",

package/src/EventBus/defaultEventBus.ts

@@ -1,11 +1,11 @@
 import { type TabActivationEvent } from '../components/Tabs/TabActivationEvent';
-import { type RegionData } from '../hooks/useLocation';
+import { type Region } from '../hooks/useRegions';
 import { type DialogAction } from '../ui-kit/DialogManager/DialogAction';
 import { type PopupAction } from '../ui-kit/PopupManager/PopupAction';
 import { EventBus } from './EventBus';
 
 interface GlobalEventMap {
-  location: RegionData;
+  location: Region;
   dialog: DialogAction;
   popup: PopupAction;
   tab: TabActivationEvent;

package/src/components/Calculator/CreditCalculatorForm.tsx

@@ -1,9 +1,11 @@
 /* eslint-disable max-lines, max-lines-per-function */
 import { JSX } from '@redneckz/uni-jsx';
+import { useEffect } from '@redneckz/uni-jsx/lib/hooks';
 import { type JSONRefObject } from '../../data/JSONRefObject';
 import { useForm, type FormFieldRegisterer } from '../../hooks/useForm';
 import { Checkbox } from '../../ui-kit/Checkbox/Checkbox';
 import { renderButtonsSection } from '../../ui-kit/LinkButton/renderButtonsSection';
+import { clamp } from '../../utils/clamp';
 import {
   type CreditCalculatorParamsViewSettings,
   type CreditCalculatorProps,
@@ -53,6 +55,27 @@ export const CreditCalculatorForm = JSX<CreditCalculatorProp>(
       ...field('isAnnuity'),
     });
 
+    const { onChange: setMoneyValue } = field('moneyValue');
+    const { onChange: setMonthsValue } = field('monthsValue');
+
+    useEffect(() => {
+      setMoneyValue &&
+        setMoneyValue(
+          clamp(userInputParams.moneyValue, calculatorParams.minSum, calculatorParams.maxSum),
+        );
+    }, [calculatorParams.minSum, calculatorParams.maxSum]);
+
+    useEffect(() => {
+      setMonthsValue &&
+        setMonthsValue(
+          clamp(
+            userInputParams.monthsValue,
+            calculatorParams.minMonths,
+            calculatorParams.maxMonths,
+          ),
+        );
+    }, [calculatorParams.minMonths, calculatorParams.maxMonths]);
+
     return (
       <CalculatorFormLayout
         className={className}

package/src/components/ExchangeRateTile/useFetchExchangeRateData.ts

@@ -1,6 +1,6 @@
 import { useAsyncData } from '@redneckz/uni-jsx/lib/hooks/useAsyncData';
 import { type ExchangeCurrencyItem } from '../../components/ExchangeRateTile/ExchangeCurrencyCalculator';
-import { type RegionData } from '../../hooks/useLocation';
+import { type Region } from '../../hooks/useRegions';
 import { fetchJSONUnsafe, type FetchJSONUnsafeType } from '../../utils/fetchJSON';
 
 export interface ExchangeData {
@@ -12,7 +12,7 @@ export interface ExchangeData {
 
 const EXCHANGE_RATES_URL = '/api/v1/exchangerates';
 
-export function useFetchExchangeRateData(currentRegion: RegionData) {
+export function useFetchExchangeRateData(currentRegion: Region) {
   const regionCode = currentRegion?.code || '000';
 
   const { data } = useAsyncData(

package/src/components/StickyBottomMenu/BurgerMenuDialog.tsx

@@ -3,7 +3,8 @@ import { useCallback, useEffect, useMemo, useState } from '@redneckz/uni-jsx/lib
 import { type RefObject } from 'react';
 import { type SitemapData } from '../../data/SitemapData';
 import { useActiveRoute } from '../../hooks/useActiveRoute';
-import { useLocation, type RegionData } from '../../hooks/useLocation';
+import { useLocation } from '../../hooks/useLocation';
+import { type Region } from '../../hooks/useRegions';
 import { type LinkProps } from '../../model/LinkProps';
 import { Dialog } from '../../ui-kit/DialogManager/Dialog';
 import { Heading } from '../../ui-kit/Heading/Heading';
@@ -110,7 +111,7 @@ const renderOfficeLink = (officesLink?: string) =>
     </a>
   ) : null;
 
-const renderLocation = (location: RegionData, onClick?: () => void) => (
+const renderLocation = (location: Region, onClick?: () => void) => (
   <div className="flex items-center text-s cursor-pointer" onClick={onClick}>
     <Img
       image={{ icon: 'GeolocationIcon', iconVersion: 'black' }}

package/src/hooks/useLocation.ts

@@ -3,33 +3,26 @@ import { useAsyncData } from '@redneckz/uni-jsx/lib/hooks/useAsyncData';
 import { defaultEventBus } from '../EventBus/defaultEventBus';
 import { useLatestEvent } from '../EventBus/useLatestEvent';
 import { fetchJSONUnsafe, type FetchJSONUnsafeType } from '../utils/fetchJSON';
+import { type Region } from './useRegions';
 
 const REGION_URL = '/api/v1/region';
-
-export interface RegionData {
-  id?: number;
-  code?: string;
-  name?: string;
-  slug?: string;
-}
-
 const LOCATION_STORAGE_KEY = 'location';
 
-export function useLocation(defaultLocation = 'Москва'): [RegionData, (_: RegionData) => void] {
+export function useLocation(defaultLocation = 'Москва'): [Region, (_: Region) => void] {
   const [currentLocation, fireCurrentLocation] = useLatestEvent(
     defaultEventBus,
     'location',
     restoreLocation() ?? { name: defaultLocation },
   );
 
-  const selectCurrentLocation = useCallback((_: RegionData) => {
+  const selectCurrentLocation = useCallback((_: Region) => {
     storeLocation(_);
     fireCurrentLocation(_);
   }, []);
 
   const { data } = useAsyncData(
     hasStoredLocation() ? null : REGION_URL,
-    fetchJSONUnsafe as FetchJSONUnsafeType<RegionData>,
+    fetchJSONUnsafe as FetchJSONUnsafeType<Region>,
   );
   useEffect(() => {
     if (data && !hasStoredLocation()) {
@@ -42,7 +35,7 @@ export function useLocation(defaultLocation = 'Москва'): [RegionData, (_:
 
 const hasStoredLocation = () => Boolean(globalThis.localStorage?.getItem(LOCATION_STORAGE_KEY));
 
-const restoreLocation = (): RegionData | null => {
+const restoreLocation = (): Region | null => {
   try {
     const data = globalThis.localStorage?.getItem(LOCATION_STORAGE_KEY);
 
@@ -52,7 +45,7 @@ const restoreLocation = (): RegionData | null => {
   }
 };
 
-const storeLocation = (_: RegionData) => {
+const storeLocation = (_: Region) => {
   try {
     globalThis.localStorage?.setItem(LOCATION_STORAGE_KEY, JSON.stringify(_));
   } catch (ex) {

package/src/hooks/useRegions.ts

@@ -7,6 +7,7 @@ export interface Region {
   id?: number;
   code?: string;
   name?: string;
+  slug?: string;
 }
 
 export function useRegions(): Region[] {

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

@@ -8,12 +8,13 @@ interface LinkWrapperProps {
   href?: string;
   target?: Target;
   isRemote?: boolean;
+  onClick?: () => void;
 }
 
 export const LinkWrapper = JSX<LinkWrapperProps>(
-  ({ className = '', href, target, isRemote = false, children }) => {
+  ({ className = '', href, target, isRemote = false, onClick, children }) => {
     const link = useLink({ isRemote });
-    const linkProps = link({ href, target });
+    const linkProps = link({ href, target, onClick });
     const Tag = href ? 'a' : 'div';
 
     return (

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

@@ -4,11 +4,12 @@ import { type ForeignOfficeProps } from '../../data/SitemapData';
 import { useLink } from '../../hooks/useLink';
 import { useLocation } from '../../hooks/useLocation';
 import { useRegions, type Region } from '../../hooks/useRegions';
-import { LinkButton } from '../../ui-kit/LinkButton/LinkButton';
 import { groupBy } from '../../utils/groupBy';
 import { jaroWinklerDistance } from '../../utils/jaroWinklerDistance';
 import { Dialog } from '../DialogManager/Dialog';
 import { useDialogManager } from '../DialogManager/useDialogManager';
+import { LinkWrapper } from '../LinkWrapper/LinkWrapper';
+import { Paragraph } from '../Paragraph/Paragraph';
 import { Text } from '../Text/Text';
 import { renderForeignOffices } from './renderForeignOffices';
 import { renderRegion } from './renderRegion';
@@ -25,7 +26,7 @@ export interface LocationDialogProps {
 export const LocationDialog = JSX<LocationDialogProps>(({ foreignOffices, defaultLocation }) => {
   const [currentLocation, selectCurrentLocation] = useLocation(defaultLocation);
 
-  const link = useLink({ isRemote: true, basePath: '/' });
+  const link = useLink({ isRemote: true });
   const { href } = link({ href: `/branches/${currentLocation.slug}` });
 
   const [query, setQuery] = useState('');
@@ -52,12 +53,12 @@ export const LocationDialog = JSX<LocationDialogProps>(({ foreignOffices, defaul
           </Text>
           {currentLocation ? (
             <div className="mb-s">
-              <Text size="text-l" font="font-light">
-                Сейчас выбран:&nbsp;
-              </Text>
-              <LinkButton href={href} onClick={() => selectCurrentLocation(currentLocation)}>
-                <Text color="text-primary-main">{currentLocation.name}</Text>
-              </LinkButton>
+              <Paragraph size="text-l" color="text-primary-text">
+                Сейчас выбран:
+                <LinkWrapper isRemote href={href} className="inline mx-2xs text-primary-main">
+                  {currentLocation.name}
+                </LinkWrapper>
+              </Paragraph>
             </div>
           ) : null}
           <SearchBar onSearch={setQuery} searchTerm={query} />

package/src/ui-kit/LocationDialog/renderRegion.tsx

@@ -1,19 +1,20 @@
 import { type Region } from '../../hooks/useRegions';
+import { LinkWrapper } from '../LinkWrapper/LinkWrapper';
 import { Text } from '../Text/Text';
 
 export const renderRegion = (onChangeLocation?: (region: Region) => void) => (region: Region) =>
-  (
-    <div key={region.id} className="mb-xs sm:mb-2xs">
-      <button
-        className="cursor-pointer hover:text-primary-hover"
-        onClick={() => {
-          onChangeLocation && onChangeLocation(region);
-        }}
-        type="button"
-      >
-        <Text size="text-l" font="font-light">
-          {region.name || ''}
-        </Text>
-      </button>
-    </div>
-  );
+  region.name ? (
+    <LinkWrapper
+      key={String(region.id)}
+      isRemote
+      href={`/branches/${region.slug}`}
+      className="mb-xs sm:mb-2xs hover:text-primary-hover"
+      onClick={() => {
+        onChangeLocation && onChangeLocation(region);
+      }}
+    >
+      <Text size="text-l" font="font-light">
+        {region.name}
+      </Text>
+    </LinkWrapper>
+  ) : null;