@redneckz/wildless-cms-uni-blocks 0.14.217 → 0.14.218

package/mobile/lib/components/OfficesAtmsMap/renderFiltrationForm.js

@@ -1,5 +1,7 @@
 import { jsx as _jsx, jsxs as _jsxs } from "@redneckz/uni-jsx/jsx-runtime";
 import { Checkbox } from '../../ui-kit/Checkbox/Checkbox.js';
+import { Foldable } from '../../ui-kit/Foldable/Foldable.js';
+import { FoldableSection } from '../../ui-kit/Foldable/FoldableSection.js';
 import { Icon } from '../../ui-kit/Icon/Icon.js';
 import { LinkButton } from '../../ui-kit/LinkButton/LinkButton.js';
 const FILTRATION_LABELS = {
@@ -9,6 +11,25 @@ const FILTRATION_LABELS = {
     terminalTypeTerm: 'Терминалы',
     workAllTime: 'Круглосуточно',
     billAcceptorEnable: 'Прием наличных',
+    premiumService: 'Премиальное обслуживание',
+    privateBanking: 'Услуга Private banking',
+    sellingCoins: 'Продажа монет из драгоценных металлов',
+    buyingCoins: 'Покупка монет из драгоценных металлов',
+    bullionOperations: 'Операции со слитками',
+    preciousMetalsOperations: 'Операции с драгоценными металлами',
+    transferringDataToBiometricSystem: 'Передача фото и голоса в Единую биометрическую систему',
+};
+const COMMON_FILTERS_STYLES = 'flex flex-col sm:flex-row sm:flex-wrap gap-3xl pb-2xl';
+export const renderFiltrationForm = (filters, { field, reset }, visibleFiltersNum = 3) => {
+    const filtersCheckbox = (filters || []).map((key) => (_jsx(Checkbox, { text: FILTRATION_LABELS[key], ...field(key) }, key)));
+    const [visibleFilters, hiddenFilters] = visibleFiltersNum > 0
+        ? [filtersCheckbox.slice(0, visibleFiltersNum), filtersCheckbox.slice(visibleFiltersNum)]
+        : [filtersCheckbox, []];
+    return (_jsx("div", { children: filters?.length ? (_jsx("div", { children: hiddenFilters.length > 0 ? (_jsx(Foldable, { renderFoldableSection: ({ isUnfolded }) => (_jsxs("div", { children: [_jsx("div", { className: COMMON_FILTERS_STYLES, children: visibleFilters }), _jsx(FoldableSection, { className: COMMON_FILTERS_STYLES, isUnfolded: isUnfolded, children: hiddenFilters })] })), renderFoldButton: renderFoldButton(reset) })) : (_jsx("div", { className: COMMON_FILTERS_STYLES, children: visibleFilters })) })) : null }));
+};
+export const renderFoldButton = (reset) => ({ isUnfolded, onToggle }) => {
+    const labels = ['Больше фильтров', 'Меньше фильтров'];
+    const icons = ['ArrowDownIcon', 'ArrowUpIcon'];
+    return (_jsxs("div", { className: "flex", children: [_jsx(LinkButton, { version: "transparent", className: "text-secondary-text [&>*]:p-0 mr-lg", appendRight: _jsx(Icon, { name: icons[Number(isUnfolded)], width: "16", height: "16" }), text: labels[Number(isUnfolded)], onClick: onToggle }), _jsx(LinkButton, { version: "transparent", className: "text-secondary-text [&>*]:p-0", onClick: reset, text: "\u041E\u0447\u0438\u0441\u0442\u0438\u0442\u044C \u0444\u0438\u043B\u044C\u0442\u0440", appendRight: _jsx(Icon, { name: "CloseIcon", width: "16", height: "16" }) })] }));
 };
-export const renderFiltrationForm = (filters, { field, reset }) => (_jsxs("div", { className: "pb-2xl", children: [filters?.length ? (_jsx("div", { className: "flex flex-col sm:flex-row sm:flex-wrap gap-3xl pb-2xl", children: filters.map((key) => (_jsx(Checkbox, { text: FILTRATION_LABELS[key], ...field(key) }, key))) })) : null, _jsx(LinkButton, { version: "transparent", className: "text-secondary-text [&>*]:p-0", onClick: reset, text: "\u041E\u0447\u0438\u0441\u0442\u0438\u0442\u044C \u0444\u0438\u043B\u044C\u0442\u0440", appendRight: _jsx(Icon, { name: "CloseIcon", width: "16", height: "16" }) })] }));
 //# sourceMappingURL=renderFiltrationForm.js.map

package/mobile/lib/components/OfficesAtmsMap/renderFiltrationForm.js.map

@@ -1 +1 @@
-{"version":3,"file":"renderFiltrationForm.js","sourceRoot":"","sources":["../../../src/components/OfficesAtmsMap/renderFiltrationForm.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,QAAQ,EAAE,MAAM,gCAAgC,CAAC;AAC1D,OAAO,EAAE,IAAI,EAAE,MAAM,wBAAwB,CAAC;AAC9C,OAAO,EAAE,UAAU,EAAE,MAAM,oCAAoC,CAAC;AAEhE,MAAM,iBAAiB,GAAG;IACxB,kBAAkB,EAAE,sCAAsC;IAC1D,eAAe,EAAE,qBAAqB;IACtC,gBAAgB,EAAE,WAAW;IAC7B,gBAAgB,EAAE,WAAW;IAC7B,WAAW,EAAE,eAAe;IAC5B,kBAAkB,EAAE,gBAAgB;CACrC,CAAC;AAEF,MAAM,CAAC,MAAM,oBAAoB,GAAG,CAClC,OAAiB,EACjB,EAAE,KAAK,EAAE,KAAK,EAA0D,EACxE,EAAE,CAAC,CACH,eAAK,SAAS,EAAC,QAAQ,aACpB,OAAO,EAAE,MAAM,CAAC,CAAC,CAAC,CACjB,cAAK,SAAS,EAAC,uDAAuD,YACnE,OAAO,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC,CACpB,KAAC,QAAQ,IAAW,IAAI,EAAE,iBAAiB,CAAC,GAAG,CAAC,KAAM,KAAK,CAAC,GAAG,CAAC,IAAjD,GAAG,CAAkD,CACrE,CAAC,GACE,CACP,CAAC,CAAC,CAAC,IAAI,EACR,KAAC,UAAU,IACT,OAAO,EAAC,aAAa,EACrB,SAAS,EAAC,+BAA+B,EACzC,OAAO,EAAE,KAAK,EACd,IAAI,EAAC,uFAAiB,EACtB,WAAW,EAAE,KAAC,IAAI,IAAC,IAAI,EAAC,WAAW,EAAC,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,IAAI,GAAG,GAC7D,IACE,CACP,CAAC"}
+{"version":3,"file":"renderFiltrationForm.js","sourceRoot":"","sources":["../../../src/components/OfficesAtmsMap/renderFiltrationForm.tsx"],"names":[],"mappings":"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"}

package/mobile/lib/components/SafeDepositRental/utils.js

@@ -1,8 +1,10 @@
 export const getCoordinates = (data) => {
+    const getBalloon = () => void 0;
     if (Array.isArray(data)) {
         return data
             .map((_) => ({
-            coords: [Number(_.gpsLatitude), Number(_.gpsLongitude)]?.filter(Boolean),
+            coords: [Number(_.gpsLatitude), Number(_.gpsLongitude)].filter(Boolean),
+            content: getBalloon(),
         }))
             .filter((_) => _.coords && _.coords.length === 2);
     }

package/mobile/lib/components/SafeDepositRental/utils.js.map

@@ -1 +1 @@
-{"version":3,"file":"utils.js","sourceRoot":"","sources":["../../../src/components/SafeDepositRental/utils.ts"],"names":[],"mappings":"AAGA,MAAM,CAAC,MAAM,cAAc,GAAG,CAAC,IAAwB,EAAmB,EAAE;IAC1E,IAAI,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE;QACvB,OAAO,IAAI;aACR,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC;YACX,MAAM,EAAE,CAAC,MAAM,CAAC,CAAC,CAAC,WAAW,CAAC,EAAE,MAAM,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,EAAE,MAAM,CAAC,OAAO,CAAC;SACzE,CAAC,CAAC;aACF,MAAM,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,MAAM,IAAI,CAAC,CAAC,MAAM,CAAC,MAAM,KAAK,CAAC,CAAC,CAAC;KACrD;IAED,IAAI,IAAI,EAAE,WAAW,IAAI,IAAI,EAAE,YAAY,EAAE;QAC3C,OAAO,CAAC,EAAE,MAAM,EAAE,CAAC,IAAI,CAAC,WAAW,EAAE,IAAI,CAAC,YAAY,CAAC,EAAE,CAAC,CAAC;KAC5D;IAED,OAAO,EAAE,CAAC;AACZ,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,SAAS,GAAG,CAAC,QAAkB,EAAE,cAAsB,EAAE,EAAE,CACtE,QAAQ,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,UAAU,KAAK,cAAc,CAAC,CAAC"}
+{"version":3,"file":"utils.js","sourceRoot":"","sources":["../../../src/components/SafeDepositRental/utils.ts"],"names":[],"mappings":"AAGA,MAAM,CAAC,MAAM,cAAc,GAAG,CAAC,IAAwB,EAAmB,EAAE;IAC1E,MAAM,UAAU,GAAG,GAAG,EAAE,CAAC,KAAK,CAAC,CAAC;IAEhC,IAAI,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE;QACvB,OAAO,IAAI;aACR,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC;YACX,MAAM,EAAE,CAAC,MAAM,CAAC,CAAC,CAAC,WAAW,CAAC,EAAE,MAAM,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC;YACvE,OAAO,EAAE,UAAU,EAAE;SACtB,CAAC,CAAC;aACF,MAAM,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,MAAM,IAAI,CAAC,CAAC,MAAM,CAAC,MAAM,KAAK,CAAC,CAAC,CAAC;KACrD;IAED,IAAI,IAAI,EAAE,WAAW,IAAI,IAAI,EAAE,YAAY,EAAE;QAC3C,OAAO,CAAC,EAAE,MAAM,EAAE,CAAC,IAAI,CAAC,WAAW,EAAE,IAAI,CAAC,YAAY,CAAC,EAAE,CAAC,CAAC;KAC5D;IAED,OAAO,EAAE,CAAC;AACZ,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,SAAS,GAAG,CAAC,QAAkB,EAAE,cAAsB,EAAE,EAAE,CACtE,QAAQ,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,UAAU,KAAK,cAAc,CAAC,CAAC"}

package/mobile/src/components/OfficesAtmsMap/OfficesAtmsMapLayout.tsx

@@ -1,7 +1,8 @@
 import { JSX } from '@redneckz/uni-jsx';
-import { useMemo } from '@redneckz/uni-jsx/lib/hooks';
+import { useMemo, useState } from '@redneckz/uni-jsx/lib/hooks';
 import { useForm } from '../../hooks/useForm';
 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';
@@ -30,6 +31,9 @@ export interface OfficesAtmsMapLayoutProps<T> {
   title?: string;
 }
 
+const filtersVisibleStyles = (activeButton: string) =>
+  activeButton === 'all' ? 'block' : 'hidden';
+
 export const OfficesAtmsMapLayout = JSX<OfficesAtmsMapLayoutProps<Branch | Atm>>(
   ({
     className,
@@ -56,6 +60,8 @@ export const OfficesAtmsMapLayout = JSX<OfficesAtmsMapLayoutProps<Branch | Atm>>
       return [_filteredItems, _points, _filteredItems.length];
     }, [data, filtrationState]);
 
+    const [activeButton, setActiveButton] = useState('all');
+
     return (
       <div className={style('space-y-1', className)}>
         <div className="bg-white">
@@ -67,7 +73,10 @@ export const OfficesAtmsMapLayout = JSX<OfficesAtmsMapLayoutProps<Branch | Atm>>
               ) : null}
             </div>
             {descriptionData ? renderDescriptionBlock(descriptionData) : null}
-            {renderFiltrationForm(Object.keys(initFilterState), { field, reset })}
+            {renderButtonsGroup(data, activeButton, setActiveButton)}
+            <div className={style('pb-2xl', filtersVisibleStyles(activeButton))}>
+              {renderFiltrationForm(Object.keys(initFilterState), { field, reset })}
+            </div>
           </div>
           <div className="h-[600px]">
             <ClientOnly>
@@ -81,6 +90,51 @@ export const OfficesAtmsMapLayout = JSX<OfficesAtmsMapLayoutProps<Branch | Atm>>
   },
 );
 
+const renderButtonsGroup = (
+  data: Branch[],
+  activeButton: string,
+  setActiveButton: (item: string) => void,
+) => {
+  const allButtonVersion = activeButton === 'all' ? 'primary' : 'secondary';
+
+  const businessButtonVersion = activeButton === 'business' ? 'primary' : 'secondary';
+
+  const handleOnClick = (e: any, key: string, branches: Branch[]) => {
+    if (e.currentTarget === e.target && key === 'business') {
+      branches.filter(
+        (branch) =>
+          branch.workSchedule &&
+          branch.workSchedule.businessScheduleVisibleTag &&
+          !branch.workSchedule.businessScheduleDescription,
+      );
+    }
+
+    setActiveButton(key);
+
+    return branches;
+  };
+
+  return (
+    <div className="flex pb-lg">
+      <Button
+        className="mr-m"
+        data-id="all"
+        onClick={(e) => handleOnClick(e, 'all', data)}
+        version={allButtonVersion}
+      >
+        Для физических лиц
+      </Button>
+      <Button
+        data-id="business"
+        onClick={(e) => handleOnClick(e, 'business', data)}
+        version={businessButtonVersion}
+      >
+        Для юридических лиц
+      </Button>
+    </div>
+  );
+};
+
 const renderDescriptionBlock = ({ __html, list }: AtmsDef) =>
   __html || list?.length ? (
     <div className="mb-2xl border-b sm:border border-main-divider sm:rounded-md">

package/mobile/src/components/OfficesAtmsMap/OfficesAtmsMapProps.tsx

@@ -47,6 +47,13 @@ export type WorkSchedule = {
   isMatchesPattern?: boolean;
   businessScheduleVisibleTag?: boolean;
   businessScheduleDescription?: string;
+  premiumService?: boolean;
+  privateBanking?: boolean;
+  sellingCoins?: boolean;
+  buyingCoins?: boolean;
+  bullionOperations?: boolean;
+  preciousMetalsOperations?: boolean;
+  transferringDataToBiometricSystem?: boolean;
 };
 
 export type SafeBoxCaseTariff = {

package/mobile/src/components/OfficesAtmsMap/OfficesMap.tsx

@@ -6,13 +6,26 @@ import { getOfficePoint, renderOfficeCard } from './renderOfficeCard';
 import { useOffices } from './useOffices';
 
 const INITIAL_FILTRATION_STATE = {
-  //safeBoxCaseVolumes: false, //TODO: temp hide
   workingSaturday: false,
+  premiumService: false,
+  privateBanking: false,
+  sellingCoins: false,
+  buyingCoins: false,
+  bullionOperations: false,
+  preciousMetalsOperations: false,
+  transferringDataToBiometricSystem: false,
 };
 
 const FILTRATION_PREDICATES = {
-  //safeBoxCaseVolumes: (item: Branch) => Boolean(item.safeBoxCaseVolumes), //TODO: temp hide
   workingSaturday: (item: Branch) => Boolean(item.workSchedule?.workingSaturday),
+  premiumService: (item: Branch) => Boolean(item.workSchedule?.premiumService),
+  privateBanking: (item: Branch) => Boolean(item.workSchedule?.privateBanking),
+  sellingCoins: (item: Branch) => Boolean(item.workSchedule?.sellingCoins),
+  buyingCoins: (item: Branch) => Boolean(item.workSchedule?.buyingCoins),
+  bullionOperations: (item: Branch) => Boolean(item.workSchedule?.bullionOperations),
+  preciousMetalsOperations: (item: Branch) => Boolean(item.workSchedule?.preciousMetalsOperations),
+  transferringDataToBiometricSystem: (item: Branch) =>
+    Boolean(item.workSchedule?.transferringDataToBiometricSystem),
 };
 
 export interface OfficesMapProps {

package/mobile/src/components/OfficesAtmsMap/renderFiltrationForm.tsx

@@ -1,6 +1,10 @@
 import { type FormFieldRegisterer } from '../../hooks/useForm';
 import { Checkbox } from '../../ui-kit/Checkbox/Checkbox';
+import { Foldable } from '../../ui-kit/Foldable/Foldable';
+import { type FoldablePartProps } from '../../ui-kit/Foldable/FoldablePartProps';
+import { FoldableSection } from '../../ui-kit/Foldable/FoldableSection';
 import { Icon } from '../../ui-kit/Icon/Icon';
+import { type IconName } from '../../ui-kit/Icon/IconProps';
 import { LinkButton } from '../../ui-kit/LinkButton/LinkButton';
 
 const FILTRATION_LABELS = {
@@ -10,26 +14,78 @@ const FILTRATION_LABELS = {
   terminalTypeTerm: 'Терминалы',
   workAllTime: 'Круглосуточно',
   billAcceptorEnable: 'Прием наличных',
+  premiumService: 'Премиальное обслуживание',
+  privateBanking: 'Услуга Private banking',
+  sellingCoins: 'Продажа монет из драгоценных металлов',
+  buyingCoins: 'Покупка монет из драгоценных металлов',
+  bullionOperations: 'Операции со слитками',
+  preciousMetalsOperations: 'Операции с драгоценными металлами',
+  transferringDataToBiometricSystem: 'Передача фото и голоса в Единую биометрическую систему',
 };
 
+const COMMON_FILTERS_STYLES = 'flex flex-col sm:flex-row sm:flex-wrap gap-3xl pb-2xl';
+
 export const renderFiltrationForm = (
   filters: string[],
   { field, reset }: { field: FormFieldRegisterer<any>; reset: () => void },
-) => (
-  <div className="pb-2xl">
-    {filters?.length ? (
-      <div className="flex flex-col sm:flex-row sm:flex-wrap gap-3xl pb-2xl">
-        {filters.map((key) => (
-          <Checkbox key={key} text={FILTRATION_LABELS[key]} {...field(key)} />
-        ))}
+  visibleFiltersNum = 3,
+) => {
+  const filtersCheckbox = (filters || []).map((key) => (
+    <Checkbox key={key} text={FILTRATION_LABELS[key]} {...field(key)} />
+  ));
+
+  const [visibleFilters, hiddenFilters] =
+    visibleFiltersNum > 0
+      ? [filtersCheckbox.slice(0, visibleFiltersNum), filtersCheckbox.slice(visibleFiltersNum)]
+      : [filtersCheckbox, []];
+
+  return (
+    <div>
+      {filters?.length ? (
+        <div>
+          {hiddenFilters.length > 0 ? (
+            <Foldable
+              renderFoldableSection={({ isUnfolded }) => (
+                <div>
+                  <div className={COMMON_FILTERS_STYLES}>{visibleFilters}</div>
+                  <FoldableSection className={COMMON_FILTERS_STYLES} isUnfolded={isUnfolded}>
+                    {hiddenFilters}
+                  </FoldableSection>
+                </div>
+              )}
+              renderFoldButton={renderFoldButton(reset)}
+            />
+          ) : (
+            <div className={COMMON_FILTERS_STYLES}>{visibleFilters}</div>
+          )}
+        </div>
+      ) : null}
+    </div>
+  );
+};
+
+export const renderFoldButton =
+  (reset: () => void) =>
+  ({ isUnfolded, onToggle }: FoldablePartProps) => {
+    const labels = ['Больше фильтров', 'Меньше фильтров'];
+    const icons: IconName[] = ['ArrowDownIcon', 'ArrowUpIcon'];
+
+    return (
+      <div className="flex">
+        <LinkButton
+          version="transparent"
+          className="text-secondary-text [&>*]:p-0 mr-lg"
+          appendRight={<Icon name={icons[Number(isUnfolded)]} width="16" height="16" />}
+          text={labels[Number(isUnfolded)]}
+          onClick={onToggle}
+        />
+        <LinkButton
+          version="transparent"
+          className="text-secondary-text [&>*]:p-0"
+          onClick={reset}
+          text="Очистить фильтр"
+          appendRight={<Icon name="CloseIcon" width="16" height="16" />}
+        />
       </div>
-    ) : null}
-    <LinkButton
-      version="transparent"
-      className="text-secondary-text [&>*]:p-0"
-      onClick={reset}
-      text="Очистить фильтр"
-      appendRight={<Icon name="CloseIcon" width="16" height="16" />}
-    />
-  </div>
-);
+    );
+  };

package/mobile/src/components/SafeDepositRental/utils.ts

@@ -2,10 +2,13 @@ import { type BalloonPoints } from '../OfficesAtmsMap/YandexMapProps';
 import { type Branch } from './useSafeBoxes';
 
 export const getCoordinates = (data?: Branch | Branch[]): BalloonPoints[] => {
+  const getBalloon = () => void 0;
+
   if (Array.isArray(data)) {
     return data
       .map((_) => ({
-        coords: [Number(_.gpsLatitude), Number(_.gpsLongitude)]?.filter(Boolean),
+        coords: [Number(_.gpsLatitude), Number(_.gpsLongitude)].filter(Boolean),
+        content: getBalloon(),
       }))
       .filter((_) => _.coords && _.coords.length === 2);
   }

package/package.json

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

package/src/components/OfficesAtmsMap/OfficesAtmsMapLayout.tsx

@@ -1,7 +1,8 @@
 import { JSX } from '@redneckz/uni-jsx';
-import { useMemo } from '@redneckz/uni-jsx/lib/hooks';
+import { useMemo, useState } from '@redneckz/uni-jsx/lib/hooks';
 import { useForm } from '../../hooks/useForm';
 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';
@@ -30,6 +31,9 @@ export interface OfficesAtmsMapLayoutProps<T> {
   title?: string;
 }
 
+const filtersVisibleStyles = (activeButton: string) =>
+  activeButton === 'all' ? 'block' : 'hidden';
+
 export const OfficesAtmsMapLayout = JSX<OfficesAtmsMapLayoutProps<Branch | Atm>>(
   ({
     className,
@@ -56,6 +60,8 @@ export const OfficesAtmsMapLayout = JSX<OfficesAtmsMapLayoutProps<Branch | Atm>>
       return [_filteredItems, _points, _filteredItems.length];
     }, [data, filtrationState]);
 
+    const [activeButton, setActiveButton] = useState('all');
+
     return (
       <div className={style('space-y-1', className)}>
         <div className="bg-white">
@@ -67,7 +73,10 @@ export const OfficesAtmsMapLayout = JSX<OfficesAtmsMapLayoutProps<Branch | Atm>>
               ) : null}
             </div>
             {descriptionData ? renderDescriptionBlock(descriptionData) : null}
-            {renderFiltrationForm(Object.keys(initFilterState), { field, reset })}
+            {renderButtonsGroup(data, activeButton, setActiveButton)}
+            <div className={style('pb-2xl', filtersVisibleStyles(activeButton))}>
+              {renderFiltrationForm(Object.keys(initFilterState), { field, reset })}
+            </div>
           </div>
           <div className="h-[600px]">
             <ClientOnly>
@@ -81,6 +90,51 @@ export const OfficesAtmsMapLayout = JSX<OfficesAtmsMapLayoutProps<Branch | Atm>>
   },
 );
 
+const renderButtonsGroup = (
+  data: Branch[],
+  activeButton: string,
+  setActiveButton: (item: string) => void,
+) => {
+  const allButtonVersion = activeButton === 'all' ? 'primary' : 'secondary';
+
+  const businessButtonVersion = activeButton === 'business' ? 'primary' : 'secondary';
+
+  const handleOnClick = (e: any, key: string, branches: Branch[]) => {
+    if (e.currentTarget === e.target && key === 'business') {
+      branches.filter(
+        (branch) =>
+          branch.workSchedule &&
+          branch.workSchedule.businessScheduleVisibleTag &&
+          !branch.workSchedule.businessScheduleDescription,
+      );
+    }
+
+    setActiveButton(key);
+
+    return branches;
+  };
+
+  return (
+    <div className="flex pb-lg">
+      <Button
+        className="mr-m"
+        data-id="all"
+        onClick={(e) => handleOnClick(e, 'all', data)}
+        version={allButtonVersion}
+      >
+        Для физических лиц
+      </Button>
+      <Button
+        data-id="business"
+        onClick={(e) => handleOnClick(e, 'business', data)}
+        version={businessButtonVersion}
+      >
+        Для юридических лиц
+      </Button>
+    </div>
+  );
+};
+
 const renderDescriptionBlock = ({ __html, list }: AtmsDef) =>
   __html || list?.length ? (
     <div className="mb-2xl border-b sm:border border-main-divider sm:rounded-md">

package/src/components/OfficesAtmsMap/OfficesAtmsMapProps.tsx

@@ -47,6 +47,13 @@ export type WorkSchedule = {
   isMatchesPattern?: boolean;
   businessScheduleVisibleTag?: boolean;
   businessScheduleDescription?: string;
+  premiumService?: boolean;
+  privateBanking?: boolean;
+  sellingCoins?: boolean;
+  buyingCoins?: boolean;
+  bullionOperations?: boolean;
+  preciousMetalsOperations?: boolean;
+  transferringDataToBiometricSystem?: boolean;
 };
 
 export type SafeBoxCaseTariff = {

package/src/components/OfficesAtmsMap/OfficesMap.tsx

@@ -6,13 +6,26 @@ import { getOfficePoint, renderOfficeCard } from './renderOfficeCard';
 import { useOffices } from './useOffices';
 
 const INITIAL_FILTRATION_STATE = {
-  //safeBoxCaseVolumes: false, //TODO: temp hide
   workingSaturday: false,
+  premiumService: false,
+  privateBanking: false,
+  sellingCoins: false,
+  buyingCoins: false,
+  bullionOperations: false,
+  preciousMetalsOperations: false,
+  transferringDataToBiometricSystem: false,
 };
 
 const FILTRATION_PREDICATES = {
-  //safeBoxCaseVolumes: (item: Branch) => Boolean(item.safeBoxCaseVolumes), //TODO: temp hide
   workingSaturday: (item: Branch) => Boolean(item.workSchedule?.workingSaturday),
+  premiumService: (item: Branch) => Boolean(item.workSchedule?.premiumService),
+  privateBanking: (item: Branch) => Boolean(item.workSchedule?.privateBanking),
+  sellingCoins: (item: Branch) => Boolean(item.workSchedule?.sellingCoins),
+  buyingCoins: (item: Branch) => Boolean(item.workSchedule?.buyingCoins),
+  bullionOperations: (item: Branch) => Boolean(item.workSchedule?.bullionOperations),
+  preciousMetalsOperations: (item: Branch) => Boolean(item.workSchedule?.preciousMetalsOperations),
+  transferringDataToBiometricSystem: (item: Branch) =>
+    Boolean(item.workSchedule?.transferringDataToBiometricSystem),
 };
 
 export interface OfficesMapProps {

package/src/components/OfficesAtmsMap/renderFiltrationForm.tsx

@@ -1,6 +1,10 @@
 import { type FormFieldRegisterer } from '../../hooks/useForm';
 import { Checkbox } from '../../ui-kit/Checkbox/Checkbox';
+import { Foldable } from '../../ui-kit/Foldable/Foldable';
+import { type FoldablePartProps } from '../../ui-kit/Foldable/FoldablePartProps';
+import { FoldableSection } from '../../ui-kit/Foldable/FoldableSection';
 import { Icon } from '../../ui-kit/Icon/Icon';
+import { type IconName } from '../../ui-kit/Icon/IconProps';
 import { LinkButton } from '../../ui-kit/LinkButton/LinkButton';
 
 const FILTRATION_LABELS = {
@@ -10,26 +14,78 @@ const FILTRATION_LABELS = {
   terminalTypeTerm: 'Терминалы',
   workAllTime: 'Круглосуточно',
   billAcceptorEnable: 'Прием наличных',
+  premiumService: 'Премиальное обслуживание',
+  privateBanking: 'Услуга Private banking',
+  sellingCoins: 'Продажа монет из драгоценных металлов',
+  buyingCoins: 'Покупка монет из драгоценных металлов',
+  bullionOperations: 'Операции со слитками',
+  preciousMetalsOperations: 'Операции с драгоценными металлами',
+  transferringDataToBiometricSystem: 'Передача фото и голоса в Единую биометрическую систему',
 };
 
+const COMMON_FILTERS_STYLES = 'flex flex-col sm:flex-row sm:flex-wrap gap-3xl pb-2xl';
+
 export const renderFiltrationForm = (
   filters: string[],
   { field, reset }: { field: FormFieldRegisterer<any>; reset: () => void },
-) => (
-  <div className="pb-2xl">
-    {filters?.length ? (
-      <div className="flex flex-col sm:flex-row sm:flex-wrap gap-3xl pb-2xl">
-        {filters.map((key) => (
-          <Checkbox key={key} text={FILTRATION_LABELS[key]} {...field(key)} />
-        ))}
+  visibleFiltersNum = 3,
+) => {
+  const filtersCheckbox = (filters || []).map((key) => (
+    <Checkbox key={key} text={FILTRATION_LABELS[key]} {...field(key)} />
+  ));
+
+  const [visibleFilters, hiddenFilters] =
+    visibleFiltersNum > 0
+      ? [filtersCheckbox.slice(0, visibleFiltersNum), filtersCheckbox.slice(visibleFiltersNum)]
+      : [filtersCheckbox, []];
+
+  return (
+    <div>
+      {filters?.length ? (
+        <div>
+          {hiddenFilters.length > 0 ? (
+            <Foldable
+              renderFoldableSection={({ isUnfolded }) => (
+                <div>
+                  <div className={COMMON_FILTERS_STYLES}>{visibleFilters}</div>
+                  <FoldableSection className={COMMON_FILTERS_STYLES} isUnfolded={isUnfolded}>
+                    {hiddenFilters}
+                  </FoldableSection>
+                </div>
+              )}
+              renderFoldButton={renderFoldButton(reset)}
+            />
+          ) : (
+            <div className={COMMON_FILTERS_STYLES}>{visibleFilters}</div>
+          )}
+        </div>
+      ) : null}
+    </div>
+  );
+};
+
+export const renderFoldButton =
+  (reset: () => void) =>
+  ({ isUnfolded, onToggle }: FoldablePartProps) => {
+    const labels = ['Больше фильтров', 'Меньше фильтров'];
+    const icons: IconName[] = ['ArrowDownIcon', 'ArrowUpIcon'];
+
+    return (
+      <div className="flex">
+        <LinkButton
+          version="transparent"
+          className="text-secondary-text [&>*]:p-0 mr-lg"
+          appendRight={<Icon name={icons[Number(isUnfolded)]} width="16" height="16" />}
+          text={labels[Number(isUnfolded)]}
+          onClick={onToggle}
+        />
+        <LinkButton
+          version="transparent"
+          className="text-secondary-text [&>*]:p-0"
+          onClick={reset}
+          text="Очистить фильтр"
+          appendRight={<Icon name="CloseIcon" width="16" height="16" />}
+        />
       </div>
-    ) : null}
-    <LinkButton
-      version="transparent"
-      className="text-secondary-text [&>*]:p-0"
-      onClick={reset}
-      text="Очистить фильтр"
-      appendRight={<Icon name="CloseIcon" width="16" height="16" />}
-    />
-  </div>
-);
+    );
+  };

package/src/components/SafeDepositRental/utils.ts

@@ -2,10 +2,13 @@ import { type BalloonPoints } from '../OfficesAtmsMap/YandexMapProps';
 import { type Branch } from './useSafeBoxes';
 
 export const getCoordinates = (data?: Branch | Branch[]): BalloonPoints[] => {
+  const getBalloon = () => void 0;
+
   if (Array.isArray(data)) {
     return data
       .map((_) => ({
-        coords: [Number(_.gpsLatitude), Number(_.gpsLongitude)]?.filter(Boolean),
+        coords: [Number(_.gpsLatitude), Number(_.gpsLongitude)].filter(Boolean),
+        content: getBalloon(),
       }))
       .filter((_) => _.coords && _.coords.length === 2);
   }