https://pastein.ru/t/llp
Загрузка данных
diff --git a/src/components/Icons/ZoomInMap.tsx b/src/components/Icons/ZoomInMap.tsx
deleted file mode 100644
index 526f6ad82db0918d7a81bafb5ef039f9575f66c2..0000000000000000000000000000000000000000
--- a/src/components/Icons/ZoomInMap.tsx
+++ /dev/null
@@ -1,20 +0,0 @@
-import React, { FC } from 'react';
-
-import { IconLegacyProps } from './IconsProps';
-
-export const ZoomInMap: FC<IconLegacyProps> = (props) => (
- <svg
- width="24"
- height="24"
- viewBox="0 0 24 24"
- fill="none"
- xmlns="http://www.w3.org/2000/svg"
- {...props}
- >
- <path
- d="M7.81348 15.4736C8.00821 15.2789 8.33163 15.2789 8.52637 15.4736C8.72048 15.6677 8.72119 15.9896 8.52832 16.1846L6.34766 18.3447L5.99121 18.6982L7.79297 20.5H3.5V16.207L5.30176 18.0088L5.65527 17.6523L7.81348 15.4736ZM15.4736 15.4736C15.6439 15.3034 15.9124 15.2818 16.1074 15.4092L16.1865 15.4736L18.3447 17.6523L18.6982 18.0088L20.5 16.207V20.5H16.207L18.0088 18.6982L17.6523 18.3447L15.4717 16.1846C15.2788 15.9896 15.2795 15.6677 15.4736 15.4736ZM7.79297 3.5L5.99121 5.30176L6.34766 5.65527L8.52832 7.81543C8.72119 8.01036 8.72048 8.33225 8.52637 8.52637C8.33163 8.7211 8.00821 8.7211 7.81348 8.52637L5.65527 6.34766L5.30176 5.99121L3.5 7.79297V3.5H7.79297ZM20.5 3.5V7.79297L18.6982 5.99121L18.3447 6.34766L16.1865 8.52637C15.9918 8.72111 15.6684 8.7211 15.4736 8.52637C15.2795 8.33225 15.2788 8.01036 15.4717 7.81543L17.6523 5.65527L18.0088 5.30176L16.207 3.5H20.5Z"
- fill="currentColor"
- stroke="currentColor"
- />
- </svg>
-);
diff --git a/src/components/Icons/ZoomOutMap.tsx b/src/components/Icons/ZoomOutMap.tsx
deleted file mode 100644
index 95e6ef413beff0b40b999896a036e66b44e46792..0000000000000000000000000000000000000000
--- a/src/components/Icons/ZoomOutMap.tsx
+++ /dev/null
@@ -1,20 +0,0 @@
-import React, { FC } from 'react';
-
-import { IconLegacyProps } from './IconsProps';
-
-export const ZoomOutMap: FC<IconLegacyProps> = (props) => (
- <svg
- width="16"
- height="16"
- viewBox="0 0 16 16"
- fill="none"
- xmlns="http://www.w3.org/2000/svg"
- {...props}
- >
- <path
- d="M5.61523 10.3848V12.6777L4.58008 11.6426L4.22656 12L2.78809 13.4512C2.72335 13.5159 2.61357 13.5159 2.54883 13.4512C2.50032 13.4027 2.48754 13.3288 2.51172 13.2676L2.54883 13.2119L4 11.7734L4.35742 11.4199L3.32227 10.3848H5.61523ZM12.6777 10.3848L11.6426 11.4199L12 11.7734L13.4502 13.2119H13.4512C13.5159 13.2767 13.5159 13.3864 13.4512 13.4512C13.4027 13.4997 13.3288 13.5125 13.2676 13.4883L13.2119 13.4512L11.7734 12L11.4199 11.6426L10.3848 12.6777V10.3848H12.6777ZM13.2119 2.54883C13.2767 2.48409 13.3864 2.48409 13.4512 2.54883C13.5158 2.61344 13.5155 2.72232 13.4512 2.78711L12 4.22656L11.6426 4.58008L12.6777 5.61523H10.3848V3.32227L11.4199 4.35742L11.7734 4L13.2119 2.54883ZM2.73242 2.51172L2.78809 2.54883L4.22656 4L4.58008 4.35742L5.61523 3.32227V5.61523H3.32227L4.35742 4.58008L4 4.22656L2.54785 2.78711C2.48397 2.72226 2.48438 2.61328 2.54883 2.54883C2.59733 2.50032 2.67115 2.48754 2.73242 2.51172Z"
- fill="currentColor"
- stroke="currentColor"
- />
- </svg>
-);
diff --git a/src/components/Icons/index.tsx b/src/components/Icons/index.tsx
index 6c8db38b6d2c56d0c617396585afea47cc39cb4f..4af9e08ab8863cc2de728c5bc2cc47a78b2f8e4f 100644
--- a/src/components/Icons/index.tsx
+++ b/src/components/Icons/index.tsx
@@ -119,7 +119,7 @@ import { Send } from './Send';
import { SettingsButtonIcon } from './SettingsButtonIcon';
import { SettingsIcon } from './SettingsIcon';
import { SettingsSliderIcon } from './SettingsSlider';
-import { ShareForwardFilled, ShareForwardSVG } from './ShareForward';
+import { ShareForwardFilled } from './ShareForward';
import { ShareIOSIcon } from './ShareIOS';
import { ShowChart } from './ShowChart';
import { SortDown } from './SortDown';
@@ -149,8 +149,6 @@ import { WarningCircleIcon } from './WarningСircleIcon';
import { WarnSign } from './WarnSign';
import { WidgetBindIcon } from './WidgetBindIcon';
import { WidgetPreview } from './WidgetPreview';
-import { ZoomInMap } from './ZoomInMap';
-import { ZoomOutMap } from './ZoomOutMap';
export default {
ClearIcon,
@@ -288,7 +286,6 @@ export default {
Triangle,
StopSign,
ShareForwardFilled,
- // ShareForwardSVG,
RoundedClose,
Reply,
RefreshIcon,
@@ -298,8 +295,6 @@ export default {
EllipsisVerticalIcon,
ShareIOSIcon,
PersonIcon,
- ZoomInMap,
- ZoomOutMap,
CalendarIcon,
CreateFolderIcon,
diff --git a/src/widgets/MarketMap/components/HeaderButtons/FullSpaceChartButton/FullSpaceChartButton.tsx b/src/widgets/MarketMap/components/HeaderButtons/FullSpaceChartButton/FullSpaceChartButton.tsx
index 1f9341e80359f099c5b688c61c8d89ab94be4273..845bcf72d3c208d90cbf8e46e27f7185be3c40cc 100644
--- a/src/widgets/MarketMap/components/HeaderButtons/FullSpaceChartButton/FullSpaceChartButton.tsx
+++ b/src/widgets/MarketMap/components/HeaderButtons/FullSpaceChartButton/FullSpaceChartButton.tsx
@@ -1,7 +1,7 @@
import React from 'react';
import { IconButton } from '@components/IconButton';
-import Icons from '@components/Icons';
+import { Icon } from '@uikit/Icon';
import Tooltip from '@uikit/Tooltip';
import { useIsChartFullSpace } from '@widgets/MarketMap/properties/useProperties';
@@ -12,17 +12,17 @@ const ZOOM_OUT_TITLE = 'Свернуть';
export const FullSpaceChartButton = () => {
const { isChartFullSpace, setIsChartFullSpace } = useIsChartFullSpace();
-
- const icon = isChartFullSpace ? (
- <Icons.ZoomOutMap className={styles.icon} />
- ) : (
- <Icons.ZoomInMap className={styles.icon} />
- );
+ const iconVariant = isChartFullSpace ? 'shrink' : 'expand';
return (
<Tooltip title={isChartFullSpace ? ZOOM_OUT_TITLE : ZOOM_IN_TITLE}>
<IconButton
- icon={icon}
+ icon={
+ <Icon
+ variant={iconVariant}
+ className={styles.icon}
+ />
+ }
onClick={() => setIsChartFullSpace(!isChartFullSpace)}
active={isChartFullSpace}
/>
diff --git a/src/widgets/MarketMap/components/HeaderButtons/__tests__/FullSpaceChartButton.test.tsx b/src/widgets/MarketMap/components/HeaderButtons/__tests__/FullSpaceChartButton.test.tsx
index a5e59aff2f3e7d9964415c2cd6c3da9dd976aa35..b1127377e2cc32452c70515231ff08f5d1d7b50e 100644
--- a/src/widgets/MarketMap/components/HeaderButtons/__tests__/FullSpaceChartButton.test.tsx
+++ b/src/widgets/MarketMap/components/HeaderButtons/__tests__/FullSpaceChartButton.test.tsx
@@ -35,12 +35,14 @@ jest.mock('@components/IconButton', () => ({
),
}));
-jest.mock('@components/Icons', () => ({
+jest.mock('@uikit/Icon', () => ({
__esModule: true,
- default: {
- ZoomInMap: () => <span data-testid="icon-zoom-in" />,
- ZoomOutMap: () => <span data-testid="icon-zoom-out" />,
- },
+ Icon: ({ variant }: { variant: string }) => (
+ <span
+ data-testid="icon"
+ data-variant={variant}
+ />
+ ),
}));
describe('FullSpaceChartButton Component', () => {
@@ -62,36 +64,28 @@ describe('FullSpaceChartButton Component', () => {
expect(screen.getByTestId('full-space-mock-icon-button')).toBeInTheDocument();
});
- it('должен показывать тултип "Развернуть" и иконку ZoomInMap, если isChartFullSpace === false', () => {
- render(<FullSpaceChartButton />);
+ it.each([
+ { title: 'Свернуть', variant: 'shrink', isChartFullSpace: true },
+ { title: 'Развернуть', variant: 'expand', isChartFullSpace: false },
+ ])(
+ 'должен показывать тултип "$title" и иконку $variant, если isChartFullSpace === $isChartFullSpace',
+ ({ title, variant, isChartFullSpace }) => {
+ (useIsChartFullSpace as jest.Mock).mockReturnValue({
+ isChartFullSpace,
+ setIsChartFullSpace: mockSetIsChartFullSpace,
+ });
- const tooltip = screen.getByTestId('full-space-mock-tooltip');
- expect(tooltip).toHaveAttribute('data-title', 'Развернуть');
+ render(<FullSpaceChartButton />);
- expect(screen.getByTestId('icon-zoom-in')).toBeInTheDocument();
- expect(screen.queryByTestId('icon-zoom-out')).not.toBeInTheDocument();
+ const tooltip = screen.getByTestId('full-space-mock-tooltip');
+ expect(tooltip).toHaveAttribute('data-title', title);
- const button = screen.getByTestId('full-space-mock-icon-button');
- expect(button).toHaveAttribute('data-active', 'false');
- });
+ expect(screen.getByTestId('icon')).toHaveAttribute('data-variant', variant);
- it('должен показывать тултип "Свернуть" и иконку ZoomOutMap, если isChartFullSpace === true', () => {
- (useIsChartFullSpace as jest.Mock).mockReturnValue({
- isChartFullSpace: true,
- setIsChartFullSpace: mockSetIsChartFullSpace,
- });
-
- render(<FullSpaceChartButton />);
-
- const tooltip = screen.getByTestId('full-space-mock-tooltip');
- expect(tooltip).toHaveAttribute('data-title', 'Свернуть');
-
- expect(screen.getByTestId('icon-zoom-out')).toBeInTheDocument();
- expect(screen.queryByTestId('icon-zoom-in')).not.toBeInTheDocument();
-
- const button = screen.getByTestId('full-space-mock-icon-button');
- expect(button).toHaveAttribute('data-active', 'true');
- });
+ const button = screen.getByTestId('full-space-mock-icon-button');
+ expect(button).toHaveAttribute('data-active', String(isChartFullSpace));
+ },
+ );
it('должен вызывать setIsChartFullSpace(true) при клике, если график не развернут (false)', () => {
render(<FullSpaceChartButton />);
