@redneckz/wildless-cms-uni-blocks 0.12.13 → 0.13.0

package/mobile/src/components/CarouselCatalogCard/CarouselCatalogCardContent.ts

@@ -1,18 +1,18 @@
-import type { ButtonCommonIconProps } from '../../model/Button';
 import type { HeadlineCommonProps } from '../../model/HeadlineType';
 import type { UniBlockContent } from '../../model/JSXBlock';
 import type { ProductColorVersion } from '../../model/ProductColorVersion';
 import type { ImageContent } from '../../ui-kit/Img/ImgProps';
+import type { ButtonContent } from '../../ui-kit/Button/ButtonContent';
 
 /**
  * @title Карточка каталога
  */
 export type CarouselCatalogCardContent = UniBlockContent &
   HeadlineCommonProps &
-  ImageContent &
-  ButtonCommonIconProps & {
+  ImageContent & {
     /** @title Цена в рублях */
     price?: number;
     /** @title Доступные цвета */
     colors?: ProductColorVersion[];
+    button?: ButtonContent;
   };

package/mobile/src/components/CarouselCatalogCard/CatalogCard.ts

@@ -1,9 +1,9 @@
 import type { ProductColorVersion } from '../../model/ProductColorVersion';
-import type { ButtonWithIconProps } from '../../ui-kit/Button/ButtonProps';
+import type { ButtonContent } from '../../ui-kit/Button/ButtonContent';
 
 const colors: ProductColorVersion[] = ['black', 'white'];
 
-const buttonPrimary: ButtonWithIconProps = {
+const buttonPrimary: ButtonContent = {
   href: '/credit-cards',
   text: 'Подробнее',
   target: '_blank',

package/mobile/src/components/CarouselProductCard/CarouselProductCardContent.ts

@@ -1,10 +1,10 @@
 import type { BulletsProps } from '../../model/Bullets';
-import type { ButtonCommonIconProps } from '../../model/Button';
 import type { AdditionalDescriptionProps, HeadlineSmallProps } from '../../model/HeadlineType';
 import type { UniBlockContent } from '../../model/JSXBlock';
 import type { IconProps } from '../../model/Picture';
 import type { LinkCommonProps } from '../../model/LinkProps';
 import type { TextAlign } from '../../ui-kit/Text/TextProps';
+import type { ButtonContent } from '../../ui-kit/Button/ButtonContent';
 
 /**
  * @title Элемент списка
@@ -21,7 +21,6 @@ export type CarouselProductCardContent = UniBlockContent &
   HeadlineSmallProps &
   AdditionalDescriptionProps &
   IconProps &
-  ButtonCommonIconProps &
   BulletsProps &
   LinkCommonProps & {
     /** @title Список */
@@ -33,4 +32,5 @@ export type CarouselProductCardContent = UniBlockContent &
     isTopPosition?: boolean;
     /** @title Кнопка по всей ширине */
     isButtonFullWidth?: boolean;
+    button?: ButtonContent;
   };

package/mobile/src/components/CarouselProgramsCard/CarouselProgramsCard.tsx

@@ -1,46 +1,28 @@
 import { JSX } from '@redneckz/uni-jsx';
-import type { HeadlineCommonProps } from '../../model/HeadlineType';
 import type { UniBlockProps } from '../../model/JSXBlock';
+import { BaseProductTile } from '../../ui-kit/BaseProductTile/BaseProductTile';
 import { BlockWrapper } from '../../ui-kit/BlockWrapper';
-import { Heading } from '../../ui-kit/Heading/Heading';
-import { Img } from '../../ui-kit/Img/Img';
 import { LinkWrapper } from '../../ui-kit/LinkWrapper/LinkWrapper';
-import { Paragraph } from '../../ui-kit/Paragraph/Paragraph';
-import { Text } from '../../ui-kit/Text/Text';
 import type { CarouselProgramsCardContent } from './CarouselProgramsCardContent';
-import { cardDescriptionColor, cardTitleFont } from './programCardStyles';
 
 export interface CarouselTariffsCardProps extends CarouselProgramsCardContent, UniBlockProps {}
 
 export const CarouselProgramsCard = JSX<CarouselTariffsCardProps>(
-  ({ className, title, icon, list = [], href, target, ...rest }) => (
-    <BlockWrapper className={className} defaultPadding="p-3xl sm:p-0" {...rest}>
-      <LinkWrapper className="sm:flex sm:items-center" href={href} target={target}>
-        <div className="flex justify-center px-xl">
-          {icon?.src || icon?.icon ? <Img image={icon} /> : null}
-        </div>
-        <div className="sm:px-s p-5xl">
-          {title ? <Heading className="mb-xs sm:mb-m" headingType="h6" title={title} /> : null}
-          {list.length ? (
-            <div className="flex flex-col gap-xs sm:gap-s">{list?.map(renderList)}</div>
-          ) : null}
-        </div>
+  ({ className, title, icon, list, href, target, ...rest }) => (
+    <BlockWrapper className={className} defaultPadding="p-3xl" {...rest}>
+      <LinkWrapper className="flex items-center h-full" href={href} target={target}>
+        <BaseProductTile
+          title={title}
+          headlineVersion="XS"
+          image={icon}
+          imageOptions={{ directionRight: false, imageAlign: 'center' }}
+          benefits={list?.map((_) => ({
+            type: 'default',
+            label: _.title,
+            description: _.description,
+          }))}
+        />
       </LinkWrapper>
     </BlockWrapper>
   ),
 );
-
-const renderList = (_: HeadlineCommonProps, i: number) => (
-  <div key={String(i)} className="flex flex-row-reverse justify-between gap-y-2xs sm:flex-col">
-    {_.title ? (
-      <Text size="text-l" font={cardTitleFont}>
-        {_.title}
-      </Text>
-    ) : null}
-    {_.description ? (
-      <Paragraph size="text-l" font="font-light" color={cardDescriptionColor}>
-        {_.description}
-      </Paragraph>
-    ) : null}
-  </div>
-);

package/mobile/src/components/CarouselRecommendationCard/CarouselRecommendationCardContent.ts

@@ -2,11 +2,11 @@ import type { HeadlineCommonProps } from '../../model/HeadlineType';
 import type { UniBlockContent } from '../../model/JSXBlock';
 import type { LinkCommonProps } from '../../model/LinkProps';
 import type { IconProps } from '../../model/Picture';
-import type { ButtonProps } from '../../ui-kit/Button/ButtonProps';
 import type { ListContent } from '../../ui-kit/List/ListContent';
 import type { TextAlign } from '../../ui-kit/Text/TextProps';
+import type { ButtonContent } from '../../ui-kit/Button/ButtonContent';
 
-export type RecommendationSocialMedia = LinkCommonProps & IconProps & ButtonProps;
+export type RecommendationSocialMedia = LinkCommonProps & IconProps & ButtonContent;
 
 /**
  * @title Карточка рекомендаций

package/mobile/src/components/CarouselTariffsCard/CarouselTariffsCardContent.ts

@@ -1,15 +1,10 @@
-import type { HeadlineCommonProps, TitleProps } from '../../model/HeadlineType';
-import { AlignProps } from '../../model/HeadlineType';
+import type { AlignProps, HeadlineCommonProps, TitleProps } from '../../model/HeadlineType';
 import type { UniBlockContent } from '../../model/JSXBlock';
 import type { IconProps } from '../../model/Picture';
-import type { ButtonProps, ButtonWithIconProps } from '../../ui-kit/Button/ButtonProps';
+import type { ButtonContent } from '../../ui-kit/Button/ButtonContent';
 
 export type TariffsCardCellProps = HeadlineCommonProps & {
-  /**
-   * @title Кнопка
-   * @maxItems 1
-   */
-  buttons?: ButtonWithIconProps[];
+  buttons?: ButtonContent[];
 };
 
 /**
@@ -22,7 +17,7 @@ export type CarouselTariffsCardContent = UniBlockContent &
     /** @title Выделить карточку */
     isHighlighting?: boolean;
     /** @title Кнопка */
-    button?: ButtonProps;
+    button?: ButtonContent;
     /** @title Ячейка */
     cardCells?: TariffsCardCellProps[];
   };

package/mobile/src/components/ContactsBlock/ContactsBlockContent.ts

@@ -1,6 +1,6 @@
 import type { AdditionalDescriptionProps, HeadlineCommonProps } from '../../model/HeadlineType';
 import type { UniBlockContent } from '../../model/JSXBlock';
-import type { ButtonProps } from '../../ui-kit/Button/ButtonProps';
+import type { ButtonContent } from '../../ui-kit/Button/ButtonContent';
 
 /**
  * @title Элемент плитки
@@ -8,7 +8,7 @@ import type { ButtonProps } from '../../ui-kit/Button/ButtonProps';
 export type ContactBlockProps = HeadlineCommonProps &
   AdditionalDescriptionProps & {
     /** @title Кнопка */
-    button?: ButtonProps;
+    button?: ButtonContent;
   };
 
 /**

package/mobile/src/components/ContentPage/ContentPage.tsx

@@ -2,20 +2,13 @@ import { JSX } from '@redneckz/uni-jsx';
 import type { BlockRendererOptions } from '../../BlockRenderer/BlockRendererOptions';
 import { renderBlocksList } from '../../BlockRenderer/renderBlockList';
 import { renderChildren } from '../../BlockRenderer/renderChildren';
-import { useBool } from '../../hooks/useBool';
-import { useLocation } from '../../hooks/useLocation';
-import { useSWRResource } from '../../hooks/useSWRResource';
 import type { BlockDecorator } from '../../model/BlockDecorator';
 import type { BlocksRegistry } from '../../model/BlocksRegistry';
 import type { ContentPageDef } from '../../model/ContentPageDef';
 import type { JSXBlock, UniBlockProps } from '../../model/JSXBlock';
-import { projectSettings } from '../../ProjectSettings';
 import { useBlockRouterProvider } from '../../services/BlockRouter/useBlockRouterProvider';
-import type { SitemapData } from '../../services/sitemap/SitemapData';
 import { CookiePopup } from '../../ui-kit/CookiePopup/CookiePopup';
-import { useDialogHandlers } from '../../ui-kit/Dialog/useDialogHandlers';
-import { LocationDialog } from '../../ui-kit/LocationDialog/LocationDialog';
-import { SearchDialog } from '../../ui-kit/SearchDialog/SearchDialog';
+import { DialogManager } from '../../ui-kit/DialogManager/DialogManager';
 import { style } from '../../utils/style';
 import { LikeControl } from '../LikeControl/LikeControl';
 
@@ -37,60 +30,31 @@ export const ContentPage: JSXBlock<ContentPageProps> = JSX<ContentPageProps>(
       parent: data,
     };
 
-    const sitemap = useSWRResource<SitemapData>(
-      projectSettings.SITEMAP || 'sitemap',
-      data?.fallback,
-    );
-    const [location, onChangeLocation] = useLocation(sitemap?.defaultLocation);
-
     useBlockRouterProvider();
-    const [isSomeDialogOpened, { setTrue: setSomeDialogOpened, setFalse: resetSomeDialogOpened }] =
-      useBool();
-
-    useDialogHandlers({
-      onOpen: setSomeDialogOpened,
-      onClose: resetSomeDialogOpened,
-    });
 
     return (
-      <section
-        className={style(
-          'relative @container',
-          pageStyle,
-          className,
-          isSomeDialogOpened ? 'overflow-hidden h-screen' : '',
-        )}
-        data-theme={colorPalette}
-      >
-        {slots?.header ? (
-          <div className="relative z-10 mb-5 shadow-[0_8px_32px_0px_#00000014]">
-            {renderBlocksList(slots?.header, {
-              ...options,
-              slotName: 'header',
-              extraProps: { sitemap, location },
-            })}
+      <div>
+        <section
+          className={style('relative @container', pageStyle, className)}
+          data-theme={colorPalette}
+        >
+          {slots?.header ? (
+            <div className="relative z-10 mb-5 shadow-[0_8px_32px_0px_#00000014]">
+              {renderBlocksList(slots?.header, { ...options, slotName: 'header' })}
+            </div>
+          ) : null}
+          <div className="container @lg:grid @lg:grid-cols-12 @lg:gap-1">
+            {renderChildren({ block: data, options, extraProps: { className: 'scroll-mt-12' } })}
+            {renderBlocksList(slots?.footer, { ...options, slotName: 'footer' })}
           </div>
-        ) : null}
-        <div className="container @lg:grid @lg:grid-cols-12 @lg:gap-1">
-          {renderChildren({ block: data, options, extraProps: { className: 'scroll-mt-12' } })}
-          {renderBlocksList(slots?.footer, {
-            ...options,
-            slotName: 'footer',
-            extraProps: { sitemap, location },
-          })}
-        </div>
-        {likeControl ? renderLikeControl() : null}
+          {likeControl ? renderLikeControl() : null}
+        </section>
+        <DialogManager />
         <CookiePopup
           termLink={{ href: '/pd-policy#cookie', target: '_blank' }}
           personalDataPolicyLink={{ href: '/pd-policy', target: '_blank' }}
         />
-        <SearchDialog topItems={sitemap?.topItems} />
-        <LocationDialog
-          currentLocation={location}
-          foreignOffices={sitemap?.foreignOffices}
-          onChangeLocation={onChangeLocation}
-        />
-      </section>
+      </div>
     );
   },
 );

package/mobile/src/components/ContentPage/computeAPIFallback.ts

@@ -8,26 +8,18 @@ interface FallbackData {
 
 export const computeAPIFallback = async (blocksRegistry: BlocksRegistry): Promise<Fallback> => {
   const blocksFallbackMap = await Promise.all(Object.keys(blocksRegistry).map(loadBlockFallback));
+
   const pageFallbackMap = getPageFallbackMap(blocksFallbackMap);
   const fallbackData = await Promise.allSettled(
-    Object.entries(pageFallbackMap).map(async ([key, fetcher]) => {
-      const data = await fetcher();
-
-      return { key, data };
-    }),
+    Object.entries(pageFallbackMap).map(async ([key, fetcher]) => ({ key, data: await fetcher() })),
   );
 
   return fallbackData
-    .filter((d): d is PromiseFulfilledResult<FallbackData> => d.status === 'fulfilled')
-    .reduce((res, item) => {
-      return {
-        ...res,
-        [item.value.key]: item.value.data,
-      };
-    }, {});
+    .filter((_): _ is PromiseFulfilledResult<FallbackData> => _.status === 'fulfilled')
+    .reduce((result, { value }) => ({ ...result, [value.key]: value.data }), {});
 };
 
-export async function loadBlockFallback(blockName: string): Promise<FallbackMap | undefined> {
+export const loadBlockFallback = async (blockName: string): Promise<FallbackMap | undefined> => {
   try {
     const blockFallback = await import(`../${blockName}/${blockName}.fallback`);
 
@@ -37,18 +29,9 @@ export async function loadBlockFallback(blockName: string): Promise<FallbackMap
   } catch (error) {
     return undefined;
   }
-}
-
-export function getPageFallbackMap(blocksFallbackMap: Array<FallbackMap | undefined>): FallbackMap {
-  return blocksFallbackMap
-    .filter((m): m is FallbackMap => Boolean(m))
-    .reduce((result, fallbackMap) => {
-      for (const [key, fetcher] of Object.entries(fallbackMap)) {
-        if (!result[key]) {
-          result[key] = fetcher;
-        }
-      }
+};
 
-      return result;
-    }, {});
-}
+export const getPageFallbackMap = (fallbackMap: Array<FallbackMap | undefined>): FallbackMap =>
+  fallbackMap
+    .filter((_): _ is FallbackMap => Boolean(_))
+    .reduce((result, _) => ({ ...result, ..._ }), {});

package/mobile/src/components/ErrorBlock/ErrorBlockContent.ts

@@ -1,7 +1,7 @@
 import type { SubtitleProps, TitleProps } from '../../model/HeadlineType';
 import type { UniBlockContent } from '../../model/JSXBlock';
-import type { ButtonProps } from '../../ui-kit/Button/ButtonProps';
 import type { ImageContent } from '../../ui-kit/Img/ImgProps';
+import type { ButtonContent } from '../../ui-kit/Button/ButtonContent';
 
 /**
  * @title Изображение
@@ -45,5 +45,5 @@ export type ErrorBlockContent = UniBlockContent &
   SubtitleProps & {
     error?: ErrorContentDef;
     /** @title Кнопка */
-    button?: ButtonProps;
+    button?: ButtonContent;
   };

package/mobile/src/components/ExchangeRateTile/ExchangeCurrencyCalculator.tsx

@@ -1,11 +1,11 @@
 import { JSX } from '@redneckz/uni-jsx';
 import { useCallback, useState } from '@redneckz/uni-jsx/lib/hooks';
 import { Button } from '../../ui-kit/Button/Button';
-import type { ButtonProps } from '../../ui-kit/Button/ButtonProps';
 import { calculateResult, formatValue } from './calculateResult';
 import { callbackCurrencySelect } from './callbackCurrencySelect';
 import { Currency } from './CurrencyProps';
 import { renderInput } from './renderInput';
+import type { ButtonCommonContent } from '../../ui-kit/Button/ButtonContent';
 
 export interface ExchangeCurrencyItem {
   currency?: {
@@ -20,7 +20,7 @@ export interface ExchangeCurrencyCalculatorProps {
   className?: string;
   currencyRatesBuy: ExchangeCurrencyItem[];
   currencyRatesSell: ExchangeCurrencyItem[];
-  button?: ButtonProps;
+  button?: ButtonCommonContent;
 }
 export interface CalcState {
   inputSell: string;

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

@@ -1,11 +1,11 @@
 import type { TitleProps } from '../../model/HeadlineType';
 import type { UniBlockContent } from '../../model/JSXBlock';
-import type { ButtonProps } from '../../ui-kit/Button/ButtonProps';
+import type { ButtonContent } from '../../ui-kit/Button/ButtonContent';
 
 /**
  * @title Курсы обмена валют
  */
 export type ExchangeRateTileContent = UniBlockContent &
   TitleProps & {
-    button?: ButtonProps;
+    button?: ButtonContent;
   };

package/mobile/src/components/Footer/Footer.tsx

@@ -1,10 +1,12 @@
 import { JSX } from '@redneckz/uni-jsx';
 import { useSWRResource } from '../../hooks/useSWRResource';
-import { LinkCommonProps } from '../../model/LinkProps';
+import type { LinkCommonProps } from '../../model/LinkProps';
 import { projectSettings } from '../../ProjectSettings';
+import { useSitemap } from '../../services/sitemap/useSitemap';
 import { BlockWrapper } from '../../ui-kit/BlockWrapper';
 import { Button } from '../../ui-kit/Button/Button';
 import { LinkList } from '../../ui-kit/LinkList/LinkList';
+import { Text } from '../../ui-kit/Text/Text';
 import { RollupItem } from '../RollupItem/RollupItem';
 import { Contacts } from './Contacts';
 import { findIconByHref } from './findIconByHref';
@@ -13,9 +15,10 @@ import type { FooterProps } from './FooterProps';
 import { HorizontalNavigation } from './HorizontalNavigation';
 import { SocialMedia } from './SocialMedia';
 import { TextInformation } from './TextInformation';
-import { Text } from '../../ui-kit/Text/Text';
 
-export const Footer = JSX<FooterProps>(({ className, sitemap, ...rest }) => {
+export const Footer = JSX<FooterProps>(({ className, ...rest }) => {
+  const fallback = rest.options?.page?.fallback;
+  const { topItems } = useSitemap(fallback);
   const {
     relatedEnterprises,
     contacts,
@@ -23,15 +26,12 @@ export const Footer = JSX<FooterProps>(({ className, sitemap, ...rest }) => {
     mobileApps,
     horizontalNavigationTitle,
     documents,
-  } = useSWRResource<FooterDataProps>(
-    projectSettings.FOOTER || 'footer',
-    rest.options?.page?.fallback,
-  );
+  } = useSWRResource<FooterDataProps>(projectSettings.FOOTER || 'footer', fallback);
 
   return (
     <BlockWrapper tag="footer" className={className} {...rest}>
       <div className="mb-lg pb-xs border-b border-main-divider">
-        {sitemap?.topItems?.map((item, i) => (
+        {topItems?.map((item, i) => (
           <RollupItem key={String(i)} label={item?.text} labelIcon={item?.icon}>
             <LinkList items={item.items} />
           </RollupItem>

package/mobile/src/components/Footer/FooterProps.ts

@@ -1,7 +1,4 @@
 import type { UniBlockProps } from '../../model/JSXBlock';
-import type { SitemapData } from '../../services/sitemap/SitemapData';
 import type { FooterContent } from './FooterContent';
 
-export interface FooterProps extends FooterContent, UniBlockProps {
-  sitemap?: SitemapData;
-}
+export interface FooterProps extends FooterContent, UniBlockProps {}

package/mobile/src/components/Footer/SocialMedia.tsx

@@ -1,5 +1,5 @@
 import { JSX } from '@redneckz/uni-jsx';
-import type { ButtonWithIconProps } from '../../ui-kit/Button/ButtonProps';
+import type { ButtonContent } from '../../ui-kit/Button/ButtonContent';
 import { Text } from '../../ui-kit/Text/Text';
 import { MediaButton } from './MediaButton';
 import type { ButtonSize } from './MediaButton';
@@ -7,7 +7,7 @@ import { style } from '../../utils/style';
 
 export interface SocialMediaProps {
   className?: string;
-  media?: ButtonWithIconProps[];
+  media?: ButtonContent[];
   buttonSize?: ButtonSize;
 }
 

package/mobile/src/components/Header/Header.tsx

@@ -1,6 +1,7 @@
 import { JSX } from '@redneckz/uni-jsx';
 import type { BgColorVersion } from '../../model/BgColorVersion';
 import type { BlockVersion } from '../../model/BlockVersion';
+import { useSitemap } from '../../services/sitemap/useSitemap';
 import { BlockWrapper } from '../../ui-kit/BlockWrapper';
 import type { HeaderProps } from './HeaderProps';
 import { HeaderTop } from './HeaderTop';
@@ -11,12 +12,12 @@ const BG_COLOR_TO_BLOCK_VERSION: Record<BgColorVersion, BlockVersion> = {
 };
 
 export const Header = JSX<HeaderProps>(
-  ({ bgColor = 'bg-white', version = BG_COLOR_TO_BLOCK_VERSION[bgColor], sitemap, ...rest }) => {
-    const { logo, internetBankUrl } = sitemap || {};
+  ({ bgColor = 'bg-white', version = BG_COLOR_TO_BLOCK_VERSION[bgColor], ...rest }) => {
+    const { logo, internetBankUrl } = useSitemap(rest.options?.page?.fallback);
 
     return (
       <BlockWrapper tag="header" defaultPadding="" version={version} {...rest}>
-        <div className="container px-4 py-2xs box-border">
+        <div className="container px-5 py-2xs box-border">
           <HeaderTop
             bgColor={bgColor}
             logo={logo}

package/mobile/src/components/Header/HeaderProps.ts

@@ -1,9 +1,4 @@
-import { RegionData } from '../../hooks/useLocation';
 import type { UniBlockProps } from '../../model/JSXBlock';
-import type { SitemapData } from '../../services/sitemap/SitemapData';
 import type { HeaderContent } from './HeaderContent';
 
-export interface HeaderProps extends HeaderContent, UniBlockProps {
-  sitemap?: SitemapData;
-  location?: RegionData;
-}
+export interface HeaderProps extends HeaderContent, UniBlockProps {}

package/mobile/src/components/Header/HeaderSecondaryMenu.tsx

@@ -1,18 +1,18 @@
 import { JSX } from '@redneckz/uni-jsx';
 import { useCallback } from '@redneckz/uni-jsx/lib/hooks';
+import { useLocation } from '../../hooks/useLocation';
 import type { BlockVersion } from '../../model/BlockVersion';
 import type { IconVersion } from '../../model/IconVersion';
-import { useDialog } from '../../ui-kit/Dialog/useDialog';
-import { LOCATION_DIALOG_ID } from '../../ui-kit/LocationDialog/LocationDialog';
-import { SEARCH_DIALOG_ID } from '../../ui-kit/SearchDialog/SearchDialog';
+import { useLocationDialog } from '../../ui-kit/LocationDialog/useLocationDialog';
+import { useSearchDialog } from '../../ui-kit/SearchDialog/useSearchDialog';
 import { TopItem } from '../../ui-kit/TopItem/TopItem';
 import { style } from '../../utils/style';
 import { HeaderSecondaryMenuButton } from './HeaderSecondaryMenuButton';
 
 interface HeaderSecondaryMenuContent {
   version?: BlockVersion;
-  locationName?: string;
   officesLink?: string;
+  defaultLocation?: string;
 }
 
 export interface HeaderSecondaryMenuProps extends HeaderSecondaryMenuContent {
@@ -20,23 +20,25 @@ export interface HeaderSecondaryMenuProps extends HeaderSecondaryMenuContent {
 }
 
 export const HeaderSecondaryMenu = JSX<HeaderSecondaryMenuProps>(
-  ({ className, version, locationName: location, officesLink }) => {
+  ({ className, version, officesLink, defaultLocation }) => {
     const iconVersion: IconVersion = version === 'transparent' ? 'white' : 'black';
 
-    const { open: openLocationModal } = useDialog(LOCATION_DIALOG_ID);
-    const handleOpenLocationModal = useCallback(() => openLocationModal(), []);
+    const [currentLocation] = useLocation(defaultLocation);
 
-    const { open: openSearchModal } = useDialog(SEARCH_DIALOG_ID);
-    const handleOpenSearchModal = useCallback(() => openSearchModal(), []);
+    const searchDialog = useSearchDialog();
+    const openSearchDialog = useCallback(() => searchDialog.open(), []);
+
+    const locationDialog = useLocationDialog();
+    const openLocationDialog = useCallback(() => locationDialog.open(), []);
 
     return (
       <div className={style('flex items-center gap-5', className)}>
-        <TopItem flat={true} href="#" text={location} onClick={handleOpenLocationModal} />
+        <TopItem flat={true} href="#" text={currentLocation?.name} onClick={openLocationDialog} />
         {officesLink ? <TopItem flat={true} href={officesLink} text="Офисы и банкоматы" /> : null}
         <HeaderSecondaryMenuButton
           image={{ icon: 'LoupeIcon', iconVersion }}
           ariaLabel="Поиск"
-          onClick={handleOpenSearchModal}
+          onClick={openSearchDialog}
         />
       </div>
     );

package/mobile/src/components/Header/HeaderSubMenu.tsx

@@ -1,7 +1,7 @@
 import { JSX } from '@redneckz/uni-jsx';
 import { useMemo, useRef, useState } from '@redneckz/uni-jsx/lib/hooks';
 import { useRouter } from '../../hooks/useRouter';
-import { findActiveSubItem } from '../../services/sitemap/findActiveSubItem';
+import { findActiveSubItem } from './findActiveSubItem';
 import { style } from '../../utils/style';
 import { DropdownMenu } from './DropdownMenu';
 import { HeaderSubMenuItem } from './HeaderSubMenuItem';

package/mobile/src/components/Header/HeaderTop.tsx

@@ -8,6 +8,8 @@ import type { BlockVersion } from '../../model/BlockVersion';
 import { Img } from '../../ui-kit/Img/Img';
 import { useRouter } from '../../hooks/useRouter';
 import { useCallback } from '@redneckz/uni-jsx/lib/hooks';
+import { projectSettings } from '../../ProjectSettings';
+import type { PreventableEvent } from '../../ui-kit/PreventableEvent';
 
 export interface HeaderTopProps {
   bgColor?: BgColorVersion;
@@ -23,26 +25,18 @@ const BUTTON_STYLE = {
 
 export const HeaderTop = JSX<HeaderTopProps>(({ bgColor, logo, internetBankUrl, version }) => {
   const router = useRouter();
-  const isRootLocation = router.pathname === '/';
-  const onClick = useCallback(() => {
+  const isRootLocation = projectSettings.BASE_PATH?.startsWith(router.pathname);
+  const onClick = useCallback((e) => {
+    e.preventDefault();
     router.back();
   }, []);
 
   return (
     <div className="flex items-center justify-between w-full">
       {isRootLocation ? (
-        <Logo bgColor={bgColor} logo={logo} />
+        <Logo className="mt-2xs" bgColor={bgColor} logo={logo} />
       ) : (
-        <Button className="flex items-center text-l" ariaLabel="Вернуться назад" onClick={onClick}>
-          <Img
-            className="w-6 h-6"
-            image={{
-              icon: 'ChevronLeft',
-              iconVersion: 'black',
-            }}
-          />
-          Вернуться назад
-        </Button>
+        renderBackButton(onClick)
       )}
       {internetBankUrl ? (
         <Button
@@ -50,7 +44,7 @@ export const HeaderTop = JSX<HeaderTopProps>(({ bgColor, logo, internetBankUrl,
           ariaLabel="Войти"
           target="_blank"
           className={style(
-            'p-s my-2xs text-s whitespace-nowrap text-primary-main hover:text-primary-hover',
+            'p-s text-s whitespace-nowrap text-primary-main hover:text-primary-hover',
             BUTTON_STYLE[version === 'transparent' ? 'transparent' : 'default'],
           )}
         >
@@ -60,3 +54,22 @@ export const HeaderTop = JSX<HeaderTopProps>(({ bgColor, logo, internetBankUrl,
     </div>
   );
 });
+
+const renderBackButton = (onClick: (ev?: PreventableEvent) => void) => (
+  <button
+    className="flex items-center text-l mt-2xs"
+    aria-label="Вернуться назад"
+    onClick={onClick}
+  >
+    <Img
+      className="w-6 h-6"
+      image={{
+        icon: 'ChevronLeftIcon',
+        iconVersion: 'black',
+      }}
+      width="24"
+      height="24"
+    />
+    Вернуться назад
+  </button>
+);