@redneckz/wildless-cms-uni-blocks 0.15.338 → 0.15.340

package/src/components/ContentPage/ContentPage.tsx

@@ -69,6 +69,7 @@ export const ContentPage = JSX<ContentPageProps>(
         <PopupManager />
         <CookiePopup
           termLink={{ href: '/pd-policy#cookie', target: '_blank' }}
+          recommendationLink={{ href: '/recommendation', target: '_blank' }}
           personalDataPolicyLink={{ href: '/pd-policy', target: '_blank' }}
         />
       </div>

package/src/components/ContentPage/computeAPIFallback.ts

@@ -1,52 +1,20 @@
 import { collectRef, resolveJPointer, type JSONNode } from '@redneckz/json-ref';
 import { readFile } from 'fs/promises';
-import { type BlocksRegistry } from '../../model/BlocksRegistry';
 import { type ContentPageDef } from '../../model/ContentPageDef';
-import { type Fallback, type FallbackMap } from '../../model/Fallback';
+import { type Fallback } from '../../model/Fallback';
 import { unique } from '../../utils/unique';
 import { joinPath } from '../../utils/url';
-import { loadModuleFallback } from './loadModuleFallback';
 
 type FallbackEntry = [key: string, data: JSONNode];
 
 const BASE_DIR = 'content';
 
-export const computeAPIFallback = async (
-  blocksRegistry: BlocksRegistry,
-  contentPageData: ContentPageDef,
-): Promise<Fallback> => {
+export const computeAPIFallback = async (contentPageData: ContentPageDef): Promise<Fallback> => {
   return Object.fromEntries(
-    (
-      await Promise.all([
-        computeFallbackFromModules(blocksRegistry),
-        computeFallbackFromContentRefs(contentPageData),
-      ])
-    )
-      .flatMap((_) => _)
-      .filter(([key, data]) => key && data),
+    (await computeFallbackFromContentRefs(contentPageData)).filter(([key, data]) => key && data),
   );
 };
 
-const computeFallbackFromModules = async (
-  blocksRegistry: BlocksRegistry,
-): Promise<FallbackEntry[]> => {
-  const fallbackMap: FallbackMap = (
-    await Promise.all(Object.keys(blocksRegistry).map(loadModuleFallback))
-  )
-    .filter((_): _ is FallbackMap => Boolean(_))
-    .reduce((acc, _) => ({ ...acc, ..._ }), {});
-
-  return (
-    await Promise.allSettled(
-      Object.entries(fallbackMap).map(
-        async ([key, fetcher]): Promise<FallbackEntry> => [key, await fetcher()],
-      ),
-    )
-  )
-    .filter((_): _ is PromiseFulfilledResult<FallbackEntry> => _.status === 'fulfilled')
-    .map(({ value }) => value);
-};
-
 const computeFallbackFromContentRefs = async (
   contentPageData: ContentPageDef,
 ): Promise<FallbackEntry[]> => {

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

@@ -1,17 +1,13 @@
-import { useCallback } from '@redneckz/uni-jsx/lib/hooks';
 import { type TopMenuItemProps } from '../../data/SitemapData';
 import { BlockWrapper } from '../../ui-kit/BlockWrapper';
 import { LinkButton } from '../../ui-kit/LinkButton/LinkButton';
 import { UniBlock } from '../../UniBlock/UniBlock';
 import { appendSlash } from '../../utils/appendSlash';
-import { mapCookie } from '../../utils/mapCookie';
 import { style } from '../../utils/style';
 import { RollupItem } from '../RollupItem/RollupItem';
 import { Contacts } from './Contacts';
-import { COOKIE_REPLACE } from './cookieReplaceData';
 import { type FooterProps } from './FooterProps';
 import { HorizontalNavigation } from './HorizontalNavigation';
-import { HorizontalNavigationLink } from './HorizontalNavigationLink';
 import { LinkList } from './LinkList';
 import { SocialMedia } from './SocialMedia';
 import { TextInformation } from './TextInformation';
@@ -30,11 +26,6 @@ export const Footer = UniBlock<FooterProps>(({ className, footer, ...rest }) =>
     license,
   } = footer || {};
 
-  const handleOnClick = useCallback(() => {
-    const [name, oldValue, newValue] = COOKIE_REPLACE;
-    mapCookie(name, (value) => value?.replace(oldValue, newValue));
-  }, []);
-
   return (
     <BlockWrapper
       tag="footer"
@@ -54,13 +45,6 @@ export const Footer = UniBlock<FooterProps>(({ className, footer, ...rest }) =>
         </SocialMedia>
       ))}
       <div className={borderStyle} />
-      <HorizontalNavigationLink
-        text="Вернуться на прежнюю версию сайта"
-        className="flex text-l font-light max-w-[292px]"
-        href="https://old.rshb.ru"
-        onClick={handleOnClick}
-      />
-      <div className={borderStyle} />
       <HorizontalNavigation title={horizontalNavigationTitle} links={relatedEnterprises} />
       <div className={borderStyle} />
       <TextInformation links={documents} license={license} />

package/src/components/Footer/Footer.tsx

@@ -1,14 +1,11 @@
-import { useCallback } from '@redneckz/uni-jsx/lib/hooks';
 import { BlockWrapper } from '../../ui-kit/BlockWrapper';
 import { LinkButton } from '../../ui-kit/LinkButton/LinkButton';
 import { Logo } from '../../ui-kit/Logo/Logo';
 import { SearchBar } from '../../ui-kit/SearchBar/SearchBar';
 import { Sitemap } from '../../ui-kit/Sitemap/Sitemap';
 import { UniBlock } from '../../UniBlock/UniBlock';
-import { mapCookie } from '../../utils/mapCookie';
 import { style } from '../../utils/style';
 import { Contacts } from './Contacts';
-import { COOKIE_REPLACE } from './cookieReplaceData';
 import { type FooterProps } from './FooterProps';
 import { HorizontalNavigation } from './HorizontalNavigation';
 import { SocialMedia } from './SocialMedia';
@@ -26,16 +23,10 @@ export const Footer = UniBlock<FooterProps>(({ className, footer, ...rest }) =>
     contacts,
     mediaLinks = [],
     feedbackButton,
-    isOldVersionButton,
     license,
     otherLinks = [],
   } = footer ?? {};
 
-  const handleOnClick = useCallback(() => {
-    const [name, oldValue, newValue] = COOKIE_REPLACE;
-    mapCookie(name, (value) => value?.replace(oldValue, newValue));
-  }, []);
-
   const linkStyle = '!text-left text-s font-light';
 
   return (
@@ -55,16 +46,6 @@ export const Footer = UniBlock<FooterProps>(({ className, footer, ...rest }) =>
               {_?.title}
             </SocialMedia>
           ))}
-          {isOldVersionButton ? (
-            <LinkButton
-              version="link"
-              href="https://old.rshb.ru"
-              className={linkStyle}
-              onClick={handleOnClick}
-            >
-              Вернуться на прежнюю версию сайта
-            </LinkButton>
-          ) : null}
           {otherLinks.map((_, i) => (
             <LinkButton key={String(i)} className={linkStyle} version="link" {..._}>
               {_?.text}

package/src/components/MobileAppTile/MobileAppTile.tsx

@@ -20,8 +20,8 @@ export const MobileAppTile = UniBlock<MobileAppTileProps>(
     description,
     image,
     items,
-    qr,
     headingType,
+    qr,
     additionalDescription = '',
     title = 'Мобильное приложение',
     version = 'primary',

package/src/components/MobileAppTile/MobileAppTileContent.ts

@@ -1,8 +1,6 @@
 import {
   type AdditionalDescriptionProps,
-  type DescriptionProps,
   type HeadlineCommonProps,
-  type TitleProps,
 } from '../../model/HeadlineType';
 import { type Picture } from '../../model/Picture';
 import { type HeadingType } from '../../ui-kit/Heading/HeadingProps';
@@ -17,8 +15,6 @@ import { type UniBlockContent } from '../../UniBlock/UniBlockProps';
 export type MobileAppTileContent = UniBlockContent &
   AdditionalDescriptionProps &
   HeadlineCommonProps &
-  TitleProps &
-  DescriptionProps &
   ButtonsSectionContent &
   ListContent &
   ImageContent & {

package/src/components/OfficesAtmsMap/OfficesAtmsMapLayout.tsx

@@ -5,13 +5,13 @@ import { type VNode } from '../../model/VNode';
 import { Button } from '../../ui-kit/Button/Button';
 import { ClientOnly } from '../../ui-kit/ClientOnly';
 import { Heading } from '../../ui-kit/Heading/Heading';
-import { Img } from '../../ui-kit/Img/Img';
-import { RichText } from '../../ui-kit/RichText/RichText';
 import { Text } from '../../ui-kit/Text/Text';
 import { YandexMap } from '../../ui-kit/YandexMap/YandexMap';
+import { getVersion } from '../../utils/getVersion';
 import { style } from '../../utils/style';
 import { type AtmsDef } from './OfficesAtmsMapContent';
-import { type Atm, type Branch } from './OfficesAtmsMapProps';
+import { type Atm, type Branch, type RemoteWorkplace } from './OfficesAtmsMapProps';
+import { renderDescriptionBlock } from './renderDescriptionBlock';
 import { renderFiltrationForm } from './renderFiltrationForm';
 import { type BalloonContent } from './YandexMapProps';
 
@@ -23,9 +23,12 @@ export type InitFilterState = Record<string, boolean>;
 export interface OfficesAtmsMapLayoutProps<T> {
   className?: string;
   data?: T[];
+  remoteWorkplaces?: T[];
   renderCard?: (item: T, index: number) => VNode;
+  renderRemoteWorkplaceCard?: (item: T, index: number) => VNode;
   filterItems?: (data: T[], filtrationState: InitFilterState) => T[];
   getBalloon?: (item: T) => BalloonContent;
+  getBalloonRemoteWorkplaces?: (item: T) => BalloonContent;
   initFilterState?: InitFilterState;
   descriptionData?: AtmsDef;
   title?: string;
@@ -34,13 +37,16 @@ export interface OfficesAtmsMapLayoutProps<T> {
 const filtersVisibleStyles = (activeButton: string) =>
   activeButton === 'all' ? 'block' : 'hidden';
 
-export const OfficesAtmsMapLayout = JSX<OfficesAtmsMapLayoutProps<Branch | Atm>>(
+export const OfficesAtmsMapLayout = JSX<OfficesAtmsMapLayoutProps<Branch | Atm | RemoteWorkplace>>(
   ({
     className,
     data = [],
+    remoteWorkplaces = [],
     renderCard = defaultEmptyFunction,
+    renderRemoteWorkplaceCard = defaultEmptyFunction,
     filterItems = defaultFilterItems,
     getBalloon = defaultEmptyFunction,
+    getBalloonRemoteWorkplaces = defaultEmptyFunction,
     initFilterState = {},
     descriptionData,
     title,
@@ -49,18 +55,30 @@ export const OfficesAtmsMapLayout = JSX<OfficesAtmsMapLayoutProps<Branch | Atm>>
 
     const [filtrationState, { field, reset }] = useForm(initFilterState);
 
-    const [filteredItems, points, lengthItems] = useMemo(() => {
+    const [filteredItems, points, filteredRemoteWorkplaces, lengthItems] = useMemo(() => {
       const _filteredItems = filterItems(data, filtrationState);
+      const _filteredRemoteWorkplaces = filterItems(remoteWorkplaces, filtrationState);
 
-      const _points = _filteredItems
-        .map((_) => ({
+      const _points = [
+        ..._filteredItems.map((_) => ({
+          type: 'offices',
           coords: [Number(_.gpsLatitude), Number(_.gpsLongitude)]?.filter(Boolean),
           content: getBalloon(_),
-        }))
-        .filter((_) => _.coords && _.coords.length === 2);
+        })),
+        ..._filteredRemoteWorkplaces.map((_: RemoteWorkplace) => ({
+          type: 'workplaces',
+          coords: [Number(_.gpsLatitude), Number(_.gpsLongitude)]?.filter(Boolean),
+          content: getBalloonRemoteWorkplaces({
+            address: _.address,
+            workScheduleDescription: _.workScheduleDescription,
+          }),
+        })),
+      ].filter((_) => _.coords && _.coords.length === 2);
+
+      const itemsLength = _filteredItems.length + _filteredRemoteWorkplaces?.length;
 
-      return [_filteredItems, _points, _filteredItems.length];
-    }, [data, filtrationState]);
+      return [_filteredItems, _points, _filteredRemoteWorkplaces, itemsLength];
+    }, [data, remoteWorkplaces, filtrationState]);
 
     const [activeButton, setActiveButton] = useState('all');
 
@@ -89,6 +107,7 @@ export const OfficesAtmsMapLayout = JSX<OfficesAtmsMapLayoutProps<Branch | Atm>>
           </div>
         </div>
         {filteredItems.map(renderCard)}
+        {filteredRemoteWorkplaces.map(renderRemoteWorkplaceCard)}
       </div>
     );
   },
@@ -97,13 +116,13 @@ export const OfficesAtmsMapLayout = JSX<OfficesAtmsMapLayoutProps<Branch | Atm>>
 const renderButtonsGroup = (
   data: Branch[],
   activeButton: string,
-  setActiveButton: (item: string) => void,
+  onButtonClick: (item: string) => void,
 ) => {
-  const allButtonVersion = activeButton === 'all' ? 'primary' : 'secondary';
+  const allButtonVersion = getVersion(activeButton === 'all');
 
-  const businessButtonVersion = activeButton === 'business' ? 'primary' : 'secondary';
+  const businessButtonVersion = getVersion(activeButton === 'business');
 
-  const handleOnClick = (e: any, key: string, branches: Branch[]) => {
+  const handleClick = (e: any, key: string, branches: Branch[]) => {
     if (e.currentTarget === e.target && key === 'business') {
       branches.filter(
         (branch) =>
@@ -113,23 +132,19 @@ const renderButtonsGroup = (
       );
     }
 
-    setActiveButton(key);
+    onButtonClick(key);
 
     return branches;
   };
 
   return (
     <div className="flex gap-lg flex-col sm:flex-row pb-lg">
-      <Button
-        data-id="all"
-        onClick={(e) => handleOnClick(e, 'all', data)}
-        version={allButtonVersion}
-      >
+      <Button data-id="all" onClick={(e) => handleClick(e, 'all', data)} version={allButtonVersion}>
         Для физических лиц
       </Button>
       <Button
         data-id="business"
-        onClick={(e) => handleOnClick(e, 'business', data)}
+        onClick={(e) => handleClick(e, 'business', data)}
         version={businessButtonVersion}
       >
         Для юридических лиц
@@ -137,28 +152,3 @@ const renderButtonsGroup = (
     </div>
   );
 };
-
-const renderDescriptionBlock = ({ __html, list }: AtmsDef) =>
-  __html || list?.length ? (
-    <div className="mb-2xl border-b sm:border border-main-divider sm:rounded-md">
-      {__html ? (
-        <div className="mb-2xl">
-          <RichText __html={__html} />
-        </div>
-      ) : null}
-      {list?.length ? (
-        <div className="flex flex-col sm:flex-row gap-2xl sm:flex-wrap pb-2xl sm:pb-xl">
-          {list.map((item, i) => (
-            <div key={String(i)} className="flex gap-xs items-center">
-              {item?.image ? <Img image={item.image} /> : null}
-              {item?.text ? (
-                <Text size="text-m" font="font-light">
-                  {item.text}
-                </Text>
-              ) : null}
-            </div>
-          ))}
-        </div>
-      ) : null}
-    </div>
-  ) : null;

package/src/components/OfficesAtmsMap/OfficesAtmsMapProps.tsx

@@ -82,6 +82,21 @@ export interface Branch {
   transferringDataToBiometricSystem?: false;
 }
 
+export interface RemoteWorkplace {
+  id?: number;
+  region?: {
+    id?: number;
+    code?: string;
+    name?: string;
+    slug?: string;
+  };
+  landmark?: string;
+  workScheduleDescription?: string;
+  description?: string;
+  gpsLatitude?: number;
+  gpsLongitude?: number;
+  address?: string;
+}
 export interface Atm {
   location?: string;
   address?: string;

package/src/components/OfficesAtmsMap/OfficesMap.tsx

@@ -1,14 +1,16 @@
 import { JSX } from '@redneckz/uni-jsx';
 import { useLocation } from '../../hooks/useLocation';
 import { OfficesAtmsMapLayout } from './OfficesAtmsMapLayout';
-import { type Branch } from './OfficesAtmsMapProps';
+import { type Branch, type RemoteWorkplace } from './OfficesAtmsMapProps';
 import { getOfficePoint, renderOfficeCard } from './renderOfficeCard';
+import { getRemoteWorkplacePoint, renderRemoteWorkplaceCard } from './renderRemoteWorkplaceCard';
 import { useOffices } from './useOffices';
 
 const INITIAL_FILTRATION_STATE = {
   workingSaturday: false,
   premiumService: false,
   privateBanking: false,
+  remoteWorkplace: false,
   sellingCoins: false,
   buyingCoins: false,
   bullionOperations: false,
@@ -17,15 +19,23 @@ const INITIAL_FILTRATION_STATE = {
 };
 
 const FILTRATION_PREDICATES = {
-  workingSaturday: (item: Branch) => Boolean(item.workSchedule?.workingSaturday),
-  premiumService: (item: Branch) => Boolean(item.premiumService),
-  privateBanking: (item: Branch) => Boolean(item.privateBanking),
-  sellingCoins: (item: Branch) => Boolean(item.sellingCoins),
-  buyingCoins: (item: Branch) => Boolean(item.buyingCoins),
-  bullionOperations: (item: Branch) => Boolean(item.bullionOperations),
-  preciousMetalsOperations: (item: Branch) => Boolean(item.preciousMetalsOperations),
-  transferringDataToBiometricSystem: (item: Branch) =>
-    Boolean(item.transferringDataToBiometricSystem),
+  workingSaturday: (item: Branch | RemoteWorkplace) =>
+    Boolean('workSchedule' in item && item.workSchedule?.workingSaturday),
+  premiumService: (item: Branch | RemoteWorkplace) =>
+    Boolean('premiumService' in item && item.premiumService),
+  privateBanking: (item: Branch | RemoteWorkplace) =>
+    Boolean('privateBanking' in item && item.privateBanking),
+  remoteWorkplace: (item: Branch | RemoteWorkplace) => Boolean('workScheduleDescription' in item),
+  sellingCoins: (item: Branch | RemoteWorkplace) =>
+    Boolean('sellingCoins' in item && item.sellingCoins),
+  buyingCoins: (item: Branch | RemoteWorkplace) =>
+    Boolean('buyingCoins' in item && item.buyingCoins),
+  bullionOperations: (item: Branch | RemoteWorkplace) =>
+    Boolean('bullionOperations' in item && item.bullionOperations),
+  preciousMetalsOperations: (item: Branch | RemoteWorkplace) =>
+    Boolean('preciousMetalsOperations' in item && item.preciousMetalsOperations),
+  transferringDataToBiometricSystem: (item: Branch | RemoteWorkplace) =>
+    Boolean('transferringDataToBiometricSystem' in item && item.transferringDataToBiometricSystem),
 };
 
 export interface OfficesMapProps {
@@ -43,16 +53,22 @@ export const OfficesMap = JSX<OfficesMapProps>(({ className }) => {
     <OfficesAtmsMapLayout
       className={className}
       filterItems={filterItems}
-      data={officesData}
+      data={officesData[0]?.branches}
+      remoteWorkplaces={officesData[0]?.remoteWorkplaces}
       initFilterState={INITIAL_FILTRATION_STATE}
       renderCard={renderOfficeCard}
+      renderRemoteWorkplaceCard={renderRemoteWorkplaceCard}
       getBalloon={getOfficePoint}
+      getBalloonRemoteWorkplaces={getRemoteWorkplacePoint}
       title={`Офисы филиала ${currentLocation?.name}`}
     />
   );
 });
 
-const filterItems = (data: Branch[], filtrationState: Record<string, boolean>) => {
+const filterItems = (
+  data: (Branch | RemoteWorkplace)[],
+  filtrationState: Record<string, boolean>,
+) => {
   const truthyFilters = Object.keys(filtrationState).filter((key) => filtrationState[key]);
 
   return data.filter((item) => truthyFilters.every((_) => FILTRATION_PREDICATES[_](item)));

package/src/components/OfficesAtmsMap/YandexMapProps.ts

@@ -1,4 +1,5 @@
 export type BalloonPoints = {
+  type?: string;
   coords: number[];
   content?: BalloonContent;
 };

package/src/components/OfficesAtmsMap/renderDescriptionBlock.tsx

@@ -0,0 +1,29 @@
+import { Img } from '../../ui-kit/Img/Img';
+import { RichText } from '../../ui-kit/RichText/RichText';
+import { Text } from '../../ui-kit/Text/Text';
+import { type AtmsDef } from './OfficesAtmsMapContent';
+
+export const renderDescriptionBlock = ({ __html, list }: AtmsDef) =>
+  __html || list?.length ? (
+    <div className="mb-2xl border-b sm:border border-main-divider sm:rounded-md">
+      {__html ? (
+        <div className="mb-2xl">
+          <RichText __html={__html} />
+        </div>
+      ) : null}
+      {list?.length ? (
+        <div className="flex flex-col sm:flex-row gap-2xl sm:flex-wrap pb-2xl sm:pb-xl">
+          {list.map((item, i) => (
+            <div key={String(i)} className="flex gap-xs items-center">
+              {item?.image ? <Img image={item.image} /> : null}
+              {item?.text ? (
+                <Text size="text-m" font="font-light">
+                  {item.text}
+                </Text>
+              ) : null}
+            </div>
+          ))}
+        </div>
+      ) : null}
+    </div>
+  ) : null;

package/src/components/OfficesAtmsMap/renderFiltrationForm.tsx

@@ -21,6 +21,7 @@ const FILTRATION_LABELS = {
   bullionOperations: 'Операции со слитками',
   preciousMetalsOperations: 'Операции с драгоценными металлами',
   transferringDataToBiometricSystem: 'Передача фото и голоса в Единую биометрическую систему',
+  remoteWorkplace: 'Удаленное рабочее место',
 };
 
 const COMMON_FILTERS_STYLES = 'flex flex-col sm:flex-row sm:flex-wrap gap-3xl pb-2xl';
@@ -30,7 +31,7 @@ export const renderFiltrationForm = (
   { field, reset }: { field: FormFieldRegisterer<any>; reset: () => void },
   onlyOffice?: boolean,
 ) => {
-  const visibleFiltersNum = onlyOffice ? 3 : 4;
+  const visibleFiltersNum = 4;
 
   const filtersCheckbox = (filters || []).map((key) => (
     <Checkbox key={key} text={FILTRATION_LABELS[key]} {...field(key)} />

package/src/components/OfficesAtmsMap/renderRemoteWorkplaceCard.tsx

@@ -0,0 +1,86 @@
+import { Foldable } from '../../ui-kit/Foldable/Foldable';
+import { FoldableSection } from '../../ui-kit/Foldable/FoldableSection';
+import { Icon } from '../../ui-kit/Icon/Icon';
+import { Text } from '../../ui-kit/Text/Text';
+import { CardCell } from './CardCell';
+import { CardRow } from './CardRow';
+import { type RemoteWorkplace } from './OfficesAtmsMapProps';
+import { renderFoldButton } from './renderFoldButton';
+
+export const renderRemoteWorkplaceCard = (
+  { address, workScheduleDescription }: RemoteWorkplace,
+  index: number,
+) => {
+  if (!workScheduleDescription) {
+    return null;
+  }
+
+  return (
+    <div key={String(index)} className="bg-white col-span-12 p-3xl sm:border-green sm:border">
+      <div className="sm:flex sm:justify-between">
+        <div>
+          <Text size="text-h4">Удаленное рабочее место</Text>
+          {address ? (
+            <div className="flex pb-xl pt-xs gap-2xs">
+              <Icon name="GeolocationIcon" width="24" height="24" />
+              <Text size="text-l">{address}</Text>
+            </div>
+          ) : null}
+        </div>
+      </div>
+      <div className="hidden sm:block">
+        {renderCardContent({
+          workScheduleDescription,
+        })}
+      </div>
+      <Foldable
+        className="block sm:hidden"
+        renderFoldableSection={({ isUnfolded }) => {
+          return (
+            <FoldableSection isUnfolded={isUnfolded}>
+              {renderCardContent({
+                workScheduleDescription,
+              })}
+            </FoldableSection>
+          );
+        }}
+        //** TODO: remove styles with refactoring  DefaultFoldButton*/
+        renderFoldButton={({ isUnfolded, onToggle }) => renderFoldButton({ isUnfolded, onToggle })}
+      />
+    </div>
+  );
+};
+
+const renderCardContent = ({ workScheduleDescription }: RemoteWorkplace) => {
+  return (
+    <div>
+      <CardRow className="flex">
+        <CardCell label="Операции для физических лиц">
+          <Text>Оформление и обслуживание кредитов, счетов, вкладов</Text>
+        </CardCell>
+        <CardCell label="Операции для физических лиц">
+          <Text>Оформление и обслуживание банковских карт</Text>
+        </CardCell>
+        <CardCell label="Операции для физических лиц">
+          <Text>Инвестиционное и накопительное страхование</Text>
+        </CardCell>
+        <CardCell label="Операции для физических лиц">
+          <Text>Безналичные операции в рублях, переводы без открытия счёта</Text>
+        </CardCell>
+      </CardRow>
+      <CardCell label="Режим работы" className="max-w-none">
+        <Text>{workScheduleDescription}</Text>
+      </CardCell>
+    </div>
+  );
+};
+
+export const getRemoteWorkplacePoint = ({
+  address = '',
+  workScheduleDescription,
+}: RemoteWorkplace) => {
+  const header = 'Удаленное рабочее место';
+  const body = `${address} ${workScheduleDescription}`;
+
+  return { header, body };
+};

package/src/components/OfficesAtmsMap/useOffices.ts

@@ -1,20 +1,27 @@
 import { useAsyncData } from '@redneckz/uni-jsx/lib/hooks/useAsyncData';
 import { fetchJSON } from '../../utils/fetchJSON';
-import { type Branch } from './OfficesAtmsMapProps';
+import { type Branch, type RemoteWorkplace } from './OfficesAtmsMapProps';
 
 const EMPTY_VALUE = [];
 
 export function useOffices(regionCode?: string) {
   const { data = EMPTY_VALUE } = useAsyncData(
-    `/api/v1/branches?regionCode=${regionCode}`,
+    `/api/v1/branchesAndRemoteWorkplaces?regionCode=${regionCode}`,
     fetchMap,
   );
 
   return data;
 }
 
-const fetchMap = async (url: string): Promise<Branch[]> => {
-  const result = await fetchJSON<Branch[]>(url, { method: 'GET' });
+const fetchMap = async (
+  url: string,
+): Promise<{ branches: Branch[]; remoteWorkplaces: RemoteWorkplace[] }[]> => {
+  const result = await fetchJSON<{ branches: Branch[]; remoteWorkplaces: RemoteWorkplace[] }[]>(
+    url,
+    {
+      method: 'GET',
+    },
+  );
 
   return Array.isArray(result) ? result : EMPTY_VALUE;
 };