fix(charts): stop tooltip labels breaking mid-word

`overflow-wrap: anywhere` dropped the label's min-content width to one
character, so it was the only row item that could give way to a wide
value. Charts whose legend names are short also got the narrowest
tooltip, which is where it showed worst.

Assisted-by: Claude Opus 5

frontend/.oxlintrc.json

@@ -291,11 +291,6 @@
     // Prevents the usage of specific antd components in favor of our lib
     "signoz/no-signozhq-ui-barrel": "error",
     // Forces subpath imports (@signozhq/ui/<component>) instead of the eagerly-loaded barrel
-    "signoz/no-antd-barrel": "off",
-    // Off until someone runs `oxlint --fix --rules signoz/no-antd-barrel` over
-    // src: 626 files still import the barrel and the autofix has not been
-    // reviewed against the production bundle. Same rationale as
-    // no-signozhq-ui-barrel above; the barrel is ~536 modules.
     "signoz/no-css-module-bracket-access": "warn",
     // Prevents bracket access on CSS modules (styles['kebab-case']) which fails with camelCaseOnly config
     "signoz/no-dashboard-fetch-outside-root": "error",

frontend/jest.config.ts

@@ -13,9 +13,6 @@ const config: Config.InitialOptions = {
 	moduleFileExtensions: ['ts', 'tsx', 'js', 'json'],
 	modulePathIgnorePatterns: ['dist'],
 	moduleNameMapper: {
-		'^antd/es/(.*)$': 'antd/lib/$1',
-		'^lodash-es$': 'lodash',
-		'^lodash-es/(.*)$': 'lodash/$1',
 		'\\.(png|jpg|jpeg|gif|svg|webp|avif|ico|bmp|tiff)$':
 			'<rootDir>/__mocks__/fileMock.ts',
 		// The icon glob module uses `import.meta.glob` (Vite-only); jest can't parse

frontend/plugins/rules/no-antd-barrel.mjs

@@ -1,98 +0,0 @@
-/**
- * Rule: no-antd-barrel
- *
- * Forbids importing from the `antd` barrel and requires the matching
- * `antd/es/<component>` subpath instead.
- *
- * This rule catches:
- *   import { Tooltip } from 'antd'
- *   import { Button, Modal } from 'antd'
- *   import { theme as antdTheme } from 'antd'
- *
- * And expects:
- *   import Tooltip from 'antd/es/tooltip'
- *   import Button from 'antd/es/button'
- *   import antdTheme from 'antd/es/theme'
- *
- * Why: `antd/es/index.js` re-exports every component, and a re-export cannot be
- * erased by type elision the way an unused named import can, so one `Tooltip`
- * import loads all ~536 antd modules. Measured on the jest suite, five files on
- * the `tests/test-utils` path were responsible for the whole antd subtree;
- * converting just those cut per-file import cost 33%.
- *
- * Type-only imports are exempt: `import type { ThemeConfig } from 'antd'` is
- * erased before the module is ever requested.
- */
-
-const SUBPATH_OVERRIDES = {
-	theme: 'theme',
-	message: 'message',
-	notification: 'notification',
-	ConfigProvider: 'config-provider',
-	FloatButton: 'float-button',
-	AutoComplete: 'auto-complete',
-	BackTop: 'back-top',
-	ColorPicker: 'color-picker',
-	DatePicker: 'date-picker',
-	InputNumber: 'input-number',
-	TimePicker: 'time-picker',
-	TreeSelect: 'tree-select',
-	QRCode: 'qr-code',
-};
-
-function toSubpath(name) {
-	if (SUBPATH_OVERRIDES[name]) return SUBPATH_OVERRIDES[name];
-	// Components are PascalCase and live at the kebab-case path.
-	if (!/^[A-Z]/.test(name)) return null;
-	return name
-		.replace(/([a-z0-9])([A-Z])/g, '$1-$2')
-		.replace(/([A-Z]+)([A-Z][a-z])/g, '$1-$2')
-		.toLowerCase();
-}
-
-function buildReplacement(node) {
-	const quote = node.source.raw?.[0] === '"' ? '"' : "'";
-	const lines = [];
-
-	for (const spec of node.specifiers) {
-		if (spec.type !== 'ImportSpecifier') return null;
-		if (spec.imported?.type !== 'Identifier') return null;
-
-		const subpath = toSubpath(spec.imported.name);
-		if (!subpath) return null;
-
-		// An inline `type` specifier keeps its name; it is erased either way.
-		const keyword = spec.importKind === 'type' ? 'import type' : 'import';
-		lines.push(
-			`${keyword} ${spec.local.name} from ${quote}antd/es/${subpath}${quote};`,
-		);
-	}
-
-	return lines.length ? lines.join('\n') : null;
-}
-
-export default {
-	meta: {
-		fixable: 'code',
-	},
-	create(context) {
-		return {
-			ImportDeclaration(node) {
-				if (node.source.value !== 'antd') return;
-				if (node.importKind === 'type') return;
-				if (node.specifiers.length === 0) return;
-
-				const replacement = buildReplacement(node);
-				const report = {
-					node: node.source,
-					message:
-						"Do not import from the 'antd' barrel. Use the matching subpath instead (e.g. 'antd/es/tooltip', 'antd/es/button'). The barrel re-exports every component, so one named import loads all ~536 antd modules and slows every test that reaches this file.",
-				};
-				if (replacement) {
-					report.fix = (fixer) => fixer.replaceText(node, replacement);
-				}
-				context.report(report);
-			},
-		};
-	},
-};

frontend/plugins/signoz.mjs

@@ -11,7 +11,6 @@ import noUnsupportedAssetPattern from './rules/no-unsupported-asset-pattern.mjs'
 import noRawAbsolutePath from './rules/no-raw-absolute-path.mjs';
 import noAntdComponents from './rules/no-antd-components.mjs';
 import noSignozhqUiBarrel from './rules/no-signozhq-ui-barrel.mjs';
-import noAntdBarrel from './rules/no-antd-barrel.mjs';
 import noCssModuleBracketAccess from './rules/no-css-module-bracket-access.mjs';
 import noDashboardFetchOutsideRoot from './rules/no-dashboard-fetch-outside-root.mjs';
 import noConditionalTextNodesWithSiblings from './rules/no-conditional-text-nodes-with-siblings.mjs';
@@ -28,7 +27,6 @@ export default {
 		'no-raw-absolute-path': noRawAbsolutePath,
 		'no-antd-components': noAntdComponents,
 		'no-signozhq-ui-barrel': noSignozhqUiBarrel,
-		'no-antd-barrel': noAntdBarrel,
 		'no-css-module-bracket-access': noCssModuleBracketAccess,
 		'no-dashboard-fetch-outside-root': noDashboardFetchOutsideRoot,
 		'no-conditional-text-nodes-with-siblings': noConditionalTextNodesWithSiblings,

frontend/src/components/CeleryTask/CeleryTaskGraph/CeleryTaskBar.tsx

@@ -12,7 +12,7 @@ import { useIsDarkMode } from 'hooks/useDarkMode';
 import useUrlQuery from 'hooks/useUrlQuery';
 import { isEmpty } from 'lodash-es';
 import { getStartAndEndTimesInMilliseconds } from 'pages/MessagingQueues/MessagingQueuesUtils';
-import { UpdateTimeInterval } from 'store/actions/global';
+import { UpdateTimeInterval } from 'store/actions';
 import { AppState } from 'store/reducers';
 import { Widgets } from 'types/api/widgets/widget';
 import { GlobalReducer } from 'types/reducer/globalTime';

frontend/src/components/CeleryTask/CeleryTaskGraph/CeleryTaskGraph.tsx

@@ -12,7 +12,7 @@ import { useIsDarkMode } from 'hooks/useDarkMode';
 import useUrlQuery from 'hooks/useUrlQuery';
 import { RowData } from 'lib/query/createTableColumnsFromQuery';
 import { getStartAndEndTimesInMilliseconds } from 'pages/MessagingQueues/MessagingQueuesUtils';
-import { UpdateTimeInterval } from 'store/actions/global';
+import { UpdateTimeInterval } from 'store/actions';
 import { Widgets } from 'types/api/widgets/widget';
 import { MetricRangePayloadProps } from 'types/api/metrics/getQueryRange';
 

frontend/src/components/CeleryTask/CeleryTaskGraph/CeleryTaskLatencyGraph.tsx

@@ -15,7 +15,7 @@ import { useIsDarkMode } from 'hooks/useDarkMode';
 import useUrlQuery from 'hooks/useUrlQuery';
 import { OnClickPluginOpts } from 'lib/uPlotLib/plugins/onClickPlugin';
 import { getStartAndEndTimesInMilliseconds } from 'pages/MessagingQueues/MessagingQueuesUtils';
-import { UpdateTimeInterval } from 'store/actions/global';
+import { UpdateTimeInterval } from 'store/actions';
 import { AppState } from 'store/reducers';
 import { DataSource } from 'types/common/queryBuilder';
 import { GlobalReducer } from 'types/reducer/globalTime';

frontend/src/components/ErrorModal/ErrorModal.tsx

@@ -1,7 +1,6 @@
 import React from 'react';
 import { Color } from '@signozhq/design-tokens';
-import Button from 'antd/es/button';
-import Modal from 'antd/es/modal';
+import { Button, Modal } from 'antd';
 import { CircleAlert, X } from '@signozhq/icons';
 import KeyValueLabel from 'periscope/components/KeyValueLabel';
 import { useAppContext } from 'providers/App/App';

frontend/src/components/ErrorModal/components/ErrorContent.tsx

@@ -1,6 +1,6 @@
 import { ReactNode } from 'react';
 import { Color } from '@signozhq/design-tokens';
-import Button from 'antd/es/button';
+import { Button } from 'antd';
 import ErrorIcon from 'assets/Error';
 import OverlayScrollbar from 'components/OverlayScrollbar/OverlayScrollbar';
 import { BookOpenText, ChevronsDown } from '@signozhq/icons';

frontend/src/container/AlertHistory/Timeline/Graph/Graph.tsx

@@ -12,7 +12,7 @@ import heatmapPlugin from 'lib/uPlotLib/plugins/heatmapPlugin';
 import timelinePlugin from 'lib/uPlotLib/plugins/timelinePlugin';
 import { uPlotXAxisValuesFormat } from 'lib/uPlotLib/utils/constants';
 import { useTimezone } from 'providers/Timezone';
-import { UpdateTimeInterval } from 'store/actions/global';
+import { UpdateTimeInterval } from 'store/actions';
 import { AlertRuleTimelineGraphResponse } from 'types/api/alerts/def';
 import uPlot, { AlignedData } from 'uplot';
 

frontend/src/container/FormAlertRules/ChartPreview/index.tsx

@@ -34,7 +34,7 @@ import { LegendPosition } from 'lib/uPlotV2/components/types';
 import { isEmpty } from 'lodash-es';
 import { useAppContext } from 'providers/App/App';
 import { useTimezone } from 'providers/Timezone';
-import { UpdateTimeInterval } from 'store/actions/global';
+import { UpdateTimeInterval } from 'store/actions';
 import { AppState } from 'store/reducers';
 import { Warning } from 'types/api';
 import { AlertDef } from 'types/api/alerts/def';

frontend/src/container/LogsExplorerChart/index.tsx

@@ -12,7 +12,7 @@ import GetMinMax from 'lib/getMinMax';
 import { LegendPosition } from 'lib/uPlotV2/components/types';
 import { StackMode } from 'lib/uPlotV2/config/types';
 import { useTimezone } from 'providers/Timezone';
-import { UpdateTimeInterval } from 'store/actions/global';
+import { UpdateTimeInterval } from 'store/actions';
 import { AppState } from 'store/reducers';
 import { GlobalReducer } from 'types/reducer/globalTime';
 

frontend/src/container/LogsExplorerViews/tests/LogsExplorerPagination.test.tsx

@@ -33,8 +33,8 @@ let mockGlobalTimeState: {
 } | null = null;
 
 // Mock UpdateTimeInterval to update the mock state that useSelector will use
-jest.mock('store/actions/global', () => {
-	const originalModule = jest.requireActual('store/actions/global');
+jest.mock('store/actions', () => {
+	const originalModule = jest.requireActual('store/actions');
 	const GetMinMax = jest.requireActual('lib/getMinMax').default;
 
 	return {

frontend/src/container/MeterExplorer/Breakdown/BreakDown.tsx

@@ -16,7 +16,7 @@ import dayjs from 'dayjs';
 import { useIsDarkMode } from 'hooks/useDarkMode';
 import { useGetTenantLicense } from 'hooks/useGetTenantLicense';
 import useUrlQuery from 'hooks/useUrlQuery';
-import { UpdateTimeInterval } from 'store/actions/global';
+import { UpdateTimeInterval } from 'store/actions';
 import { AppState } from 'store/reducers';
 import { Widgets } from 'types/api/widgets/widget';
 import { GlobalReducer } from 'types/reducer/globalTime';

frontend/src/container/MeterExplorer/Explorer/useTimeSeriesTimeManagement.ts

@@ -11,7 +11,7 @@ import useUrlQuery from 'hooks/useUrlQuery';
 import GetMinMax from 'lib/getMinMax';
 import getTimeString from 'lib/getTimeString';
 import history from 'lib/history';
-import { UpdateTimeInterval } from 'store/actions/global';
+import { UpdateTimeInterval } from 'store/actions';
 import { getTimeRange } from 'utils/getTimeRange';
 
 interface UseTimeSeriesTimeManagementProps {

frontend/src/container/MetricsApplication/Tabs/DBCall.tsx

@@ -23,7 +23,7 @@ import useUrlQuery from 'hooks/useUrlQuery';
 import getStep from 'lib/getStep';
 import history from 'lib/history';
 import store from 'store';
-import { UpdateTimeInterval } from 'store/actions/global';
+import { UpdateTimeInterval } from 'store/actions';
 import { TagFilterItem } from 'types/api/queryBuilder/queryBuilderData';
 import { EQueryType } from 'types/common/dashboard';
 import { v4 as uuid } from 'uuid';

frontend/src/container/MetricsApplication/Tabs/External.tsx

@@ -25,7 +25,7 @@ import useUrlQuery from 'hooks/useUrlQuery';
 import getStep from 'lib/getStep';
 import history from 'lib/history';
 import store from 'store';
-import { UpdateTimeInterval } from 'store/actions/global';
+import { UpdateTimeInterval } from 'store/actions';
 import { DataTypes } from 'types/api/queryBuilder/queryAutocompleteResponse';
 import { EQueryType } from 'types/common/dashboard';
 import { v4 as uuid } from 'uuid';

frontend/src/container/MetricsApplication/Tabs/Overview.tsx

@@ -26,7 +26,7 @@ import history from 'lib/history';
 import { OnClickPluginOpts } from 'lib/uPlotLib/plugins/onClickPlugin';
 import { defaultTo } from 'lodash-es';
 import { useAppContext } from 'providers/App/App';
-import { UpdateTimeInterval } from 'store/actions/global';
+import { UpdateTimeInterval } from 'store/actions';
 import { AppState } from 'store/reducers';
 import { DataTypes } from 'types/api/queryBuilder/queryAutocompleteResponse';
 import { Query } from 'types/api/queryBuilder/queryBuilderData';

frontend/src/container/TimeSeriesView/TimeSeriesView.tsx

@@ -36,7 +36,7 @@ import { getUPlotChartOptions } from 'lib/uPlotLib/getUplotChartOptions';
 import { getUPlotChartData } from 'lib/uPlotLib/utils/getUplotChartData';
 import { isEmpty } from 'lodash-es';
 import { useTimezone } from 'providers/Timezone';
-import { UpdateTimeInterval } from 'store/actions/global';
+import { UpdateTimeInterval } from 'store/actions';
 import { AppState } from 'store/reducers';
 import { SuccessResponse, Warning } from 'types/api';
 import { LegendPosition } from 'types/api/widgets/widget';

frontend/src/container/TopNav/DateTimeSelectionV2/index.tsx

@@ -28,7 +28,7 @@ import { useTimezone } from 'providers/Timezone';
 // eslint-disable-next-line no-restricted-imports
 import { bindActionCreators, Dispatch } from 'redux';
 import { ThunkDispatch } from 'redux-thunk';
-import { GlobalTimeLoading, UpdateTimeInterval } from 'store/actions/global';
+import { GlobalTimeLoading, UpdateTimeInterval } from 'store/actions';
 import { AppState } from 'store/reducers';
 import AppActions from 'types/actions';
 import { GlobalReducer } from 'types/reducer/globalTime';

frontend/src/container/WidgetCard/Card/index.tsx

@@ -14,7 +14,7 @@ import { GetQueryResultsProps } from 'lib/dashboard/getQueryResults';
 import getTimeString from 'lib/getTimeString';
 import { isEqual } from 'lodash-es';
 import isEmpty from 'lodash-es/isEmpty';
-import { UpdateTimeInterval } from 'store/actions/global';
+import { UpdateTimeInterval } from 'store/actions';
 import { AppState } from 'store/reducers';
 import APIError from 'types/api/error';
 import { DataSource } from 'types/common/queryBuilder';

frontend/src/hooks/queryBuilder/__tests__/useSyncTimeOnStagedQueryChange.test.ts

@@ -1,7 +1,7 @@
 import { renderHook } from '@testing-library/react';
 // eslint-disable-next-line no-restricted-imports
 import { useSelector } from 'react-redux';
-import { UpdateTimeInterval } from 'store/actions/global';
+import { UpdateTimeInterval } from 'store/actions';
 
 import { useSyncTimeOnStagedQueryChange } from '../useSyncTimeOnStagedQueryChange';
 
@@ -12,7 +12,7 @@ jest.mock('react-redux', () => ({
 	useSelector: jest.fn(),
 }));
 
-jest.mock('store/actions/global', () => ({
+jest.mock('store/actions', () => ({
 	UpdateTimeInterval: jest.fn((time: string) => ({
 		type: 'UPDATE_TIME_INTERVAL_THUNK',
 		payload: time,

frontend/src/hooks/queryBuilder/useSyncTimeOnStagedQueryChange.ts

@@ -1,7 +1,7 @@
 import { useEffect, useRef } from 'react';
 // eslint-disable-next-line no-restricted-imports
 import { useDispatch, useSelector } from 'react-redux';
-import { UpdateTimeInterval } from 'store/actions/global';
+import { UpdateTimeInterval } from 'store/actions';
 import { AppState } from 'store/reducers';
 import { GlobalReducer } from 'types/reducer/globalTime';
 

frontend/src/hooks/useDarkMode/index.tsx

@@ -11,8 +11,7 @@ import {
 	useMemo,
 	useState,
 } from 'react';
-import type { ThemeConfig } from 'antd/es/config-provider';
-import antdTheme from 'antd/es/theme';
+import { theme as antdTheme, ThemeConfig } from 'antd';
 import get from 'api/browser/localstorage/get';
 import set from 'api/browser/localstorage/set';
 import { LOCALSTORAGE } from 'constants/localStorage';

frontend/src/hooks/useZoomOut.ts

@@ -6,7 +6,7 @@ import { QueryParams } from 'constants/query';
 import { useSafeNavigate } from 'hooks/useSafeNavigate';
 import useUrlQuery from 'hooks/useUrlQuery';
 import { getNextZoomOutRange } from 'lib/zoomOutUtils';
-import { UpdateTimeInterval } from 'store/actions/global';
+import { UpdateTimeInterval } from 'store/actions';
 import { AppState } from 'store/reducers';
 import { GlobalReducer } from 'types/reducer/globalTime';
 import { persistTimeDurationForRoute } from 'utils/metricsTimeStorageUtils';

frontend/src/lib/uPlotV2/components/Tooltip/components/TooltipItem/TooltipItem.module.scss

@@ -25,6 +25,7 @@
 
 .uplotTooltipItemContent {
 	width: 100%;
+	min-width: 0;
 	display: flex;
 	align-items: center;
 	gap: var(--spacing-2);
@@ -40,16 +41,24 @@
 }
 
 .uplotTooltipItemLabel {
+	min-width: 0;
+	// Not `anywhere`, which drops min-content to one character and lets a wide
+	// value squeeze the label into a mid-word break.
 	white-space: normal;
-	overflow-wrap: anywhere;
+	overflow-wrap: break-word;
+	display: -webkit-box;
+	-webkit-line-clamp: 3;
+	-webkit-box-orient: vertical;
+	overflow: hidden;
 }
 
 .uplotTooltipItemValue {
 	white-space: nowrap;
+	flex: 0 0 auto;
 }
 
 .uplotTooltipItemContentSeparator {
-	flex: 1;
+	flex: 1 1 24px;
 	border-width: 0.5px;
 	border-style: dashed;
 	min-width: 24px;

frontend/src/lib/uPlotV2/components/Tooltip/components/TooltipItem/TooltipItem.tsx

@@ -34,7 +34,9 @@ export default function TooltipItem({
 				style={{ color: item.color }}
 				data-testid={contentTestId}
 			>
-				<span className={Styles.uplotTooltipItemLabel}>{item.label}</span>
+				<span className={Styles.uplotTooltipItemLabel} title={item.label}>
+					{item.label}
+				</span>
 				<span
 					className={Styles.uplotTooltipItemContentSeparator}
 					style={{ borderColor: item.color }}

frontend/src/lib/visualization/charts/ChartWrapper/ChartWrapper.tsx

@@ -17,7 +17,8 @@ import { ChartWrapperProps } from 'lib/visualization/charts/types';
 import { useChartStacking } from 'lib/visualization/charts/ChartWrapper/useChartStacking';
 
 const TOOLTIP_WIDTH_PADDING = 120;
-const TOOLTIP_MIN_WIDTH = 300;
+// Holds a tooltip row's value column next to a legend-length label.
+const TOOLTIP_MIN_WIDTH = 360;
 
 export default function ChartWrapper({
 	legendConfig = { position: LegendPosition.BOTTOM },

frontend/src/modules/Servicemap/ServiceMap.tsx

@@ -12,8 +12,7 @@ import useResourceAttribute from 'hooks/useResourceAttribute';
 import { whilelistedKeys } from 'hooks/useResourceAttribute/config';
 import { IResourceAttribute } from 'hooks/useResourceAttribute/types';
 import { filterServiceMapSupportedQueries } from 'hooks/useResourceAttribute/utils';
-import { getDetailedServiceMapItems } from 'store/actions/serviceMap';
-import type { ServiceMapStore } from 'store/actions/serviceMap';
+import { getDetailedServiceMapItems, ServiceMapStore } from 'store/actions';
 import { AppState } from 'store/reducers';
 import styled from 'styled-components';
 import { GlobalTime } from 'types/actions/globalTime';

frontend/src/modules/Usage/UsageExplorer.tsx

@@ -7,9 +7,7 @@ import { withRouter } from 'react-router-dom';
 import { Select, Space } from 'antd';
 import { Typography } from '@signozhq/ui/typography';
 import Graph from 'components/Graph';
-import { GetService } from 'store/actions/metrics';
-import { getUsageData } from 'store/actions/usage';
-import type { UsageDataItem } from 'store/actions/usage';
+import { GetService, getUsageData, UsageDataItem } from 'store/actions';
 import { AppState } from 'store/reducers';
 import { GlobalTime } from 'types/actions/globalTime';
 import { GlobalReducer } from 'types/reducer/globalTime';

frontend/src/pages/Celery/CeleryOverview/CeleryOverviewDetail/OverviewRightPanelGraph.tsx

@@ -14,7 +14,7 @@ import { Button } from 'container/MetricsApplication/Tabs/styles';
 import { useGraphClickHandler } from 'container/MetricsApplication/Tabs/util';
 import useUrlQuery from 'hooks/useUrlQuery';
 import { OnClickPluginOpts } from 'lib/uPlotLib/plugins/onClickPlugin';
-import { UpdateTimeInterval } from 'store/actions/global';
+import { UpdateTimeInterval } from 'store/actions';
 import { AppState } from 'store/reducers';
 import { Widgets } from 'types/api/widgets/widget';
 import { BaseAutocompleteData } from 'types/api/queryBuilder/queryAutocompleteResponse';

frontend/src/pages/DashboardPage/DashboardContainer/PanelsAndSectionsLayout/Panel/hooks/usePanelInteractions.ts

@@ -11,7 +11,7 @@ import { useSafeNavigate } from 'hooks/useSafeNavigate';
 import useUrlQuery from 'hooks/useUrlQuery';
 import logEvent from 'api/common/logEvent';
 import { DashboardDetailEvents } from 'pages/DashboardPage/constants/events';
-import { UpdateTimeInterval } from 'store/actions/global';
+import { UpdateTimeInterval } from 'store/actions';
 
 export interface PanelInteractions {
 	/** Drag-select a chart range → write it to the URL + global time so every panel re-fetches the same range. */

frontend/src/pages/MessagingQueues/MQDetails/MetricPage/MetricPageGraph.tsx

@@ -9,7 +9,7 @@ import GridCard from 'container/WidgetCard/Card';
 import { Card } from 'container/WidgetCard/styles';
 import { useIsDarkMode } from 'hooks/useDarkMode';
 import useUrlQuery from 'hooks/useUrlQuery';
-import { UpdateTimeInterval } from 'store/actions/global';
+import { UpdateTimeInterval } from 'store/actions';
 import { Widgets } from 'types/api/widgets/widget';
 
 import './MetricPage.styles.scss';

frontend/src/pages/MessagingQueues/MQGraph/MQGraph.tsx

@@ -11,7 +11,7 @@ import { Card } from 'container/WidgetCard/styles';
 import { getWidgetQueryBuilder } from 'container/MetricsApplication/MetricsApplication.factory';
 import { useIsDarkMode } from 'hooks/useDarkMode';
 import useUrlQuery from 'hooks/useUrlQuery';
-import { UpdateTimeInterval } from 'store/actions/global';
+import { UpdateTimeInterval } from 'store/actions';
 
 import {
 	getFiltersFromConfigOptions,

frontend/src/periscope/components/KeyValueLabel/KeyValueLabel.tsx

@@ -1,4 +1,4 @@
-import Tooltip from 'antd/es/tooltip';
+import { Tooltip } from 'antd';
 
 import TrimmedText from '../TrimmedText/TrimmedText';
 

frontend/src/periscope/components/TrimmedText/TrimmedText.tsx

@@ -1,5 +1,5 @@
 import { useEffect, useState } from 'react';
-import Tooltip from 'antd/es/tooltip';
+import { Tooltip } from 'antd';
 
 function TrimmedText({
 	text,

frontend/src/store/actions/index.ts

@@ -0,0 +1,5 @@
+export * from './global';
+export * from './metrics';
+export * from './serviceMap';
+export * from './types';
+export * from './usage';

frontend/src/store/reducers/serviceMap.ts

@@ -1,5 +1,4 @@
-import { Action, ActionTypes } from 'store/actions/types';
-import type { ServiceMapStore } from 'store/actions/serviceMap';
+import { Action, ActionTypes, ServiceMapStore } from 'store/actions';
 
 const initialState: ServiceMapStore = {
 	items: [],

frontend/src/store/reducers/usage.ts

@@ -1,6 +1,5 @@
 /* eslint-disable sonarjs/no-small-switch */
-import { Action, ActionTypes } from 'store/actions/types';
-import type { UsageDataItem } from 'store/actions/usage';
+import { Action, ActionTypes, UsageDataItem } from 'store/actions';
 
 export const usageDataReducer = (
 	state: UsageDataItem[] = [{ timestamp: 0, count: 0 }],

frontend/src/utils/sanitizeOrderBy.ts

@@ -1,3 +1,4 @@
+import * as Sentry from '@sentry/react';
 import {
 	IBuilderQuery,
 	OrderByPayload,
@@ -22,15 +23,11 @@ export function sanitizeOrderByForExplorer(
 	const hasInvalidOrderBy = current.some((o) => !allowed.has(o.columnName));
 
 	if (hasInvalidOrderBy) {
-		// Loaded on demand: a static import puts all of @sentry/react (~273
-		// modules) in the graph of every module that reaches this file.
-		void import('@sentry/react').then((Sentry) => {
-			Sentry.captureEvent({
-				message: `Invalid orderBy: current: ${JSON.stringify(
-					current,
-				)} - allowed: ${JSON.stringify(Array.from(allowed))}`,
-				level: 'warning',
-			});
+		Sentry.captureEvent({
+			message: `Invalid orderBy: current: ${JSON.stringify(
+				current,
+			)} - allowed: ${JSON.stringify(Array.from(allowed))}`,
+			level: 'warning',
 		});
 	}
 	return current.filter((o) => allowed.has(o.columnName));