diff --git a/__tests__/MetricServices.spec.ts b/__tests__/MetricServices.spec.ts index d1f41c52..97d7cdbc 100644 --- a/__tests__/MetricServices.spec.ts +++ b/__tests__/MetricServices.spec.ts @@ -4,7 +4,7 @@ import * as PrometheusAPIModule from '../src/API/Prometheus.api'; import { alignDataSeriesWithZeros, normalizeResponsesFromSeries } from '../src/pages/shared/Metrics/metrics.utils'; import { MetricsController } from '../src/pages/shared/Metrics/services'; import { PrometheusMetric } from '../src/types/Prometheus.interfaces'; -import { skAxisXY } from '../src/types/SkChartArea.interfaces'; +import { skAxisXY } from '../src/types/SkCharts'; describe('useMetrics', () => { it('should getLatencyPercentiles handles errors', async () => { diff --git a/__tests__/SKSankeyFIlter.spec.tsx b/__tests__/SKSankeyFIlter.spec.tsx index 7a9696da..71ac596f 100644 --- a/__tests__/SKSankeyFIlter.spec.tsx +++ b/__tests__/SKSankeyFIlter.spec.tsx @@ -5,8 +5,8 @@ import { ServiceClientResourceOptions, ServiceServerResourceOptions, SankeyMetricOptions -} from '../src/core/components/SKSanckeyChart/SkSankey.constants'; -import SankeyFilter from '../src/core/components/SKSanckeyChart/SkSankeyFilter'; +} from '../src/core/components/SkCharts/SKSanckeyChart/SkSankey.constants'; +import SankeyFilter from '../src/core/components/SkCharts/SKSanckeyChart/SkSankeyFilter'; describe('SankeyFilter', () => { it('should render the SankeyFilter component', () => { diff --git a/__tests__/Services.services.spec.ts b/__tests__/Services.services.spec.ts index c3059487..87b4d02b 100644 --- a/__tests__/Services.services.spec.ts +++ b/__tests__/Services.services.spec.ts @@ -3,7 +3,7 @@ import { describe, expect, it } from 'vitest'; import connectorsData from '../mocks/data/CONNECTORS.json'; import listenersData from '../mocks/data/LISTENERS.json'; import { styles } from '../src/config/styles'; -import { DEFAULT_SANKEY_CHART_FLOW_VALUE } from '../src/core/components/SKSanckeyChart/SkSankey.constants'; +import { DEFAULT_SANKEY_CHART_FLOW_VALUE } from '../src/core/components/SkCharts/SKSanckeyChart/SkSankey.constants'; import { ServicesController, aggregateConnectorResponses } from '../src/pages/Services/services'; import { GraphElementNames, GraphIconKeys } from '../src/types/Graph.interfaces'; import { ConnectorResponse, ListenerResponse } from '../src/types/REST.interfaces'; diff --git a/__tests__/SkChartArea.spec.tsx b/__tests__/SkChartArea.spec.tsx index ee185e60..f0f00a4d 100644 --- a/__tests__/SkChartArea.spec.tsx +++ b/__tests__/SkChartArea.spec.tsx @@ -1,7 +1,7 @@ import { render, screen, waitFor } from '@testing-library/react'; import { afterEach, beforeEach, describe, it, expect, vi } from 'vitest'; -import SkChartArea from '../src/core/components/SkChartArea'; +import SkChartArea from '../src/core/components/SkCharts/SkChartArea'; vi.mock('@patternfly/react-charts/victory', () => ({ Chart: vi.fn(({ children }) =>
{children}
), diff --git a/__tests__/SkDurationCell.spec.tsx b/__tests__/SkDurationCell.spec.tsx index 5d6cc023..817d506e 100644 --- a/__tests__/SkDurationCell.spec.tsx +++ b/__tests__/SkDurationCell.spec.tsx @@ -1,7 +1,7 @@ import { render, screen } from '@testing-library/react'; import { describe, expect, it, vi, beforeEach, Mock } from 'vitest'; -import SkDurationCell from '../src/core/components/SKDurationCell'; +import SkDurationCell from '../src/core/components/SkTable/SkCustomCells/SKDurationCell'; import { formatLatency } from '../src/core/utils/formatLatency'; vi.mock('../src/core/utils/formatLatency', () => ({ diff --git a/__tests__/SkLinkCell.spec.tsx b/__tests__/SkLinkCell.spec.tsx index 8aeccc7b..c874846c 100644 --- a/__tests__/SkLinkCell.spec.tsx +++ b/__tests__/SkLinkCell.spec.tsx @@ -1,7 +1,7 @@ import { render, screen } from '@testing-library/react'; import { describe, expect, it } from 'vitest'; -import SkLinkCell from '../src/core/components/SkLinkCell'; +import SkLinkCell from '../src/core/components/SkTable/SkCustomCells/SkLinkCell'; import { Providers } from '../src/providers'; describe('SkLinkCell', () => { diff --git a/__tests__/SkLinkStatusCell.spec.tsx b/__tests__/SkLinkStatusCell.spec.tsx index 0702bc6d..dc3360ef 100644 --- a/__tests__/SkLinkStatusCell.spec.tsx +++ b/__tests__/SkLinkStatusCell.spec.tsx @@ -1,7 +1,7 @@ import { render, screen } from '@testing-library/react'; import { describe, expect, it } from 'vitest'; -import SkLinkStatusCell from '../src/core/components/SkLinkStatusCell'; +import SkLinkStatusCell from '../src/core/components/SkTable/SkCustomCells/SkLinkStatusCell'; describe('SkLinkStatusCell', () => { const mockRouterLinkResponseUp: { destinationSiteId: string; status: 'up' } = { diff --git a/__tests__/SkSankeyChart.spec.tsx b/__tests__/SkSankeyChart.spec.tsx index 7f841f5f..b0908c18 100644 --- a/__tests__/SkSankeyChart.spec.tsx +++ b/__tests__/SkSankeyChart.spec.tsx @@ -3,7 +3,7 @@ import { describe, expect, it, vi } from 'vitest'; import { Labels } from '../src/config/labels'; import { styles } from '../src/config/styles'; -import SkSankeyChart, { getColors } from '../src/core/components/SKSanckeyChart/index'; +import SkSankeyChart, { getColors } from '../src/core/components/SkCharts/SKSanckeyChart/index'; vi.mock('@nivo/sankey', () => ({ ResponsiveSankey: () =>
diff --git a/__tests__/SkViewDetailCell.spec.tsx b/__tests__/SkViewDetailCell.spec.tsx index 17c535f1..4cc84d2a 100644 --- a/__tests__/SkViewDetailCell.spec.tsx +++ b/__tests__/SkViewDetailCell.spec.tsx @@ -1,7 +1,7 @@ import { render, fireEvent } from '@testing-library/react'; import { describe, expect, it, vi } from 'vitest'; -import SkViewDetailCell from '../src/core/components/SkViewDetailsCell/index'; +import SkViewDetailCell from '../src/core/components/SkTable/SkCustomCells/SkViewDetailsCell/index'; describe('ViewDetailCell', () => { it('should render a button with a search icon', () => { diff --git a/src/API/Prometheus.utils.ts b/src/API/Prometheus.utils.ts index 83df95cd..02c331ad 100644 --- a/src/API/Prometheus.utils.ts +++ b/src/API/Prometheus.utils.ts @@ -13,7 +13,7 @@ import { ExecuteQueryQueryType, ExecuteQueryFunction } from '../types/Prometheus.interfaces'; -import { skAxisXY } from '../types/SkChartArea.interfaces'; +import { skAxisXY } from '../types/SkCharts'; const gePrometheusQueryPATH = (queryType: 'single' | 'range' = 'range') => queryType === 'range' ? PROMETHEUS_URL_RANGE_QUERY : PROMETHEUS_URL_SINGLE_QUERY; diff --git a/src/core/components/SkBiFlowList/BiFlowList.constants.ts b/src/core/components/SkBiFlowList/BiFlowList.constants.ts index a8bedc96..d3edc347 100644 --- a/src/core/components/SkBiFlowList/BiFlowList.constants.ts +++ b/src/core/components/SkBiFlowList/BiFlowList.constants.ts @@ -6,10 +6,10 @@ import { SitesRoutesPaths } from '../../../pages/Sites/Sites.enum'; import { BiFlowResponse, TransportFlowResponse } from '../../../types/REST.interfaces'; import { formatBytes } from '../../utils/formatBytes'; import { formatLatency } from '../../utils/formatLatency'; -import SkDurationCell from '../SKDurationCell'; -import SkEndTimeCell from '../SkEndTimeCell'; -import SkLinkCell, { SkLinkCellProps } from '../SkLinkCell'; import { SkSelectOption } from '../SkSelect'; +import SkDurationCell from '../SkTable/SkCustomCells/SKDurationCell'; +import SkEndTimeCell from '../SkTable/SkCustomCells/SkEndTimeCell'; +import SkLinkCell, { SkLinkCellProps } from '../SkTable/SkCustomCells/SkLinkCell'; export const customCells = { ProcessNameLinkCell: (props: SkLinkCellProps) => diff --git a/src/core/components/SkBiFlowList/index.tsx b/src/core/components/SkBiFlowList/index.tsx index 23338634..0efef3fc 100644 --- a/src/core/components/SkBiFlowList/index.tsx +++ b/src/core/components/SkBiFlowList/index.tsx @@ -5,9 +5,9 @@ import { Modal, ModalVariant } from '@patternfly/react-core/deprecated'; import { customCells } from './BiFlowList.constants'; import { BiFlowResponse } from '../../../types/REST.interfaces'; import SkBiFlowDetails from '../SkBiFlowDetails'; -import { SkLinkCellProps } from '../SkLinkCell'; import SkTable, { SKTableProps } from '../SkTable'; -import SkViewDetailCell from '../SkViewDetailsCell'; +import { SkLinkCellProps } from '../SkTable/SkCustomCells/SkLinkCell'; +import SkViewDetailCell from '../SkTable/SkCustomCells/SkViewDetailsCell'; type SkBiFlowListProps = SKTableProps; diff --git a/src/core/components/SkChartPie/index.tsx b/src/core/components/SkChartPie/index.tsx deleted file mode 100644 index 087c073f..00000000 --- a/src/core/components/SkChartPie/index.tsx +++ /dev/null @@ -1,86 +0,0 @@ -import { FC, useEffect, useRef, useState } from 'react'; - -import { ChartDonutProps, ChartDonut, ChartTooltip } from '@patternfly/react-charts/victory'; -import { getResizeObserver } from '@patternfly/react-core'; - -import { formatToDecimalPlacesIfCents } from '../../utils/formatToDecimalPlacesIfCents'; - -const DEFAULT_CHART_PADDING = { - bottom: 40, - left: 40, - right: 40, - top: 40 -}; - -interface SkChartPieProps extends ChartDonutProps { - data: { x: string; y: number }[]; - format?: Function; -} - -const SkChartPie: FC = function ({ - data, - legendOrientation = 'horizontal', - legendPosition = 'bottom', - format = (y: number) => y, - height = 300, - ...props -}) { - const observer = useRef(() => null); - const chartContainerRef = useRef(null); - const [width, setWidth] = useState(0); - - function handleResize() { - if ( - chartContainerRef.current && - chartContainerRef.current?.clientWidth && - chartContainerRef.current?.clientHeight - ) { - setWidth(chartContainerRef.current.clientWidth); - } - } - - useEffect(() => { - if (!chartContainerRef.current) { - return; - } - - observer.current = getResizeObserver(chartContainerRef.current, handleResize); - handleResize(); - - return () => observer.current(); - }, []); - - const total = data.reduce((acc, { y }) => acc + y, 0); - const labels = data.map(({ x, y }) => `${x}: ${format(y)}`); - const legendData = data.map(({ x, y }) => ({ - name: `${x}: ${total ? formatToDecimalPlacesIfCents((y * 100) / total, 1) : 0}%` - })); - - return ( -
- - } - legendOrientation={legendOrientation} - legendPosition={legendPosition} - legendData={legendData} - padding={props.padding || DEFAULT_CHART_PADDING} - {...props} - /> -
- ); -}; - -export default SkChartPie; diff --git a/src/core/components/SKSanckeyChart/SkSankey.constants.ts b/src/core/components/SkCharts/SKSanckeyChart/SkSankey.constants.ts similarity index 86% rename from src/core/components/SKSanckeyChart/SkSankey.constants.ts rename to src/core/components/SkCharts/SKSanckeyChart/SkSankey.constants.ts index f9105206..9b5247be 100644 --- a/src/core/components/SKSanckeyChart/SkSankey.constants.ts +++ b/src/core/components/SkCharts/SKSanckeyChart/SkSankey.constants.ts @@ -1,5 +1,5 @@ -import { Labels } from '../../../config/labels'; -import { MetricKeys } from '../../../types/SkSankeyChart.interfaces'; +import { Labels } from '../../../../config/labels'; +import { MetricKeys } from '../../../../types/SkSankeyChart.interfaces'; export const DEFAULT_SANKEY_CHART_FLOW_VALUE = 0.000001; export const DEFAULT_SANKEY_CHART_HEIGHT = '350px'; diff --git a/src/core/components/SKSanckeyChart/SkSankeyFilter.tsx b/src/core/components/SkCharts/SKSanckeyChart/SkSankeyFilter.tsx similarity index 94% rename from src/core/components/SKSanckeyChart/SkSankeyFilter.tsx rename to src/core/components/SkCharts/SKSanckeyChart/SkSankeyFilter.tsx index b77bc111..d45fec2e 100644 --- a/src/core/components/SKSanckeyChart/SkSankeyFilter.tsx +++ b/src/core/components/SkCharts/SKSanckeyChart/SkSankeyFilter.tsx @@ -4,8 +4,8 @@ import { Toolbar, ToolbarContent, ToolbarToggleGroup, ToolbarItem, ToolbarGroup import { FilterIcon } from '@patternfly/react-icons'; import { SankeyMetricOptions, ServiceClientResourceOptions, ServiceServerResourceOptions } from './SkSankey.constants'; -import { MetricKeys } from '../../../types/SkSankeyChart.interfaces'; -import SkSelect from '../SkSelect'; +import { MetricKeys } from '../../../../types/SkSankeyChart.interfaces'; +import SkSelect from '../../SkSelect'; const SankeyFilter: FC<{ onSearch?: Function }> = memo(({ onSearch }) => { const [clientType, setClientType] = useState(ServiceClientResourceOptions[0].id); diff --git a/src/core/components/SKSanckeyChart/index.tsx b/src/core/components/SkCharts/SKSanckeyChart/index.tsx similarity index 89% rename from src/core/components/SKSanckeyChart/index.tsx rename to src/core/components/SkCharts/SKSanckeyChart/index.tsx index 93c55cab..9c25755a 100644 --- a/src/core/components/SKSanckeyChart/index.tsx +++ b/src/core/components/SkCharts/SKSanckeyChart/index.tsx @@ -4,10 +4,10 @@ import { ResponsiveSankey } from '@nivo/sankey'; import { DEFAULT_SANKEY_CHART_HEIGHT } from './SkSankey.constants'; import SankeyFilter from './SkSankeyFilter'; -import { Labels } from '../../../config/labels'; -import { styles } from '../../../config/styles'; -import { SkSankeyChartLink, SkSankeyChartNode } from '../../../types/SkSankeyChart.interfaces'; -import SKEmptyData from '../SkEmptyData'; +import { Labels } from '../../../../config/labels'; +import { styles } from '../../../../config/styles'; +import { SkSankeyChartLink, SkSankeyChartNode } from '../../../../types/SkSankeyChart.interfaces'; +import SKEmptyData from '../../SkEmptyData'; interface SkSankeyChartProps { nodes: SkSankeyChartNode[]; diff --git a/src/core/components/SkChartArea/SkChartArea.constants.ts b/src/core/components/SkCharts/SkChartArea/SkChartArea.constants.ts similarity index 100% rename from src/core/components/SkChartArea/SkChartArea.constants.ts rename to src/core/components/SkCharts/SkChartArea/SkChartArea.constants.ts diff --git a/src/core/components/SkChartArea/SkChartArea.utils.ts b/src/core/components/SkCharts/SkChartArea/SkChartArea.utils.ts similarity index 94% rename from src/core/components/SkChartArea/SkChartArea.utils.ts rename to src/core/components/SkCharts/SkChartArea/SkChartArea.utils.ts index 961c086f..f2f3b448 100644 --- a/src/core/components/SkChartArea/SkChartArea.utils.ts +++ b/src/core/components/SkCharts/SkChartArea/SkChartArea.utils.ts @@ -1,5 +1,5 @@ import { CHART_CONFIG } from './SkChartArea.constants'; -import { skAxisXY } from '../../../types/SkChartArea.interfaces'; +import { skAxisXY } from '../../../../types/SkCharts'; /** * Calculates tick density based on chart width diff --git a/src/core/components/SkChartArea/index.tsx b/src/core/components/SkCharts/SkChartArea/index.tsx similarity index 95% rename from src/core/components/SkChartArea/index.tsx rename to src/core/components/SkCharts/SkChartArea/index.tsx index ddb23c28..ef1f64b5 100644 --- a/src/core/components/SkChartArea/index.tsx +++ b/src/core/components/SkCharts/SkChartArea/index.tsx @@ -15,9 +15,9 @@ import { import { CHART_CONFIG } from './SkChartArea.constants'; import { calculateTickDensity, getChartDynamicPaddingLeft } from './SkChartArea.utils'; -import { useChartDimensions } from '../../../hooks/useChartDimensions'; -import { skAxisXY } from '../../../types/SkChartArea.interfaces'; -import { formatChartDateByRange } from '../../utils/formatChartDateByRange'; +import { useChartDimensions } from '../../../../hooks/useChartDimensions'; +import { skAxisXY } from '../../../../types/SkCharts'; +import { formatChartDateByRange } from '../../../utils/formatChartDateByRange'; interface SkChartAreaProps extends ChartProps { data: skAxisXY[][]; diff --git a/src/core/components/SkCharts/SkChartPie/SkChartPie.constants.ts b/src/core/components/SkCharts/SkChartPie/SkChartPie.constants.ts new file mode 100644 index 00000000..efc92fb1 --- /dev/null +++ b/src/core/components/SkCharts/SkChartPie/SkChartPie.constants.ts @@ -0,0 +1,8 @@ +const CHART_CONFIG = { + LAYOUT: { + DEFAULT_PADDING: { bottom: 40, left: 40, right: 40, top: 40 }, + DEFAULT_HEIGHT: 300 + } +}; + +export { CHART_CONFIG }; diff --git a/src/core/components/SkCharts/SkChartPie/index.tsx b/src/core/components/SkCharts/SkChartPie/index.tsx new file mode 100644 index 00000000..1928d281 --- /dev/null +++ b/src/core/components/SkCharts/SkChartPie/index.tsx @@ -0,0 +1,59 @@ +import { FC } from 'react'; + +import { ChartDonut, ChartDonutProps, ChartTooltip } from '@patternfly/react-charts/victory'; + +import { CHART_CONFIG } from './SkChartPie.constants'; +import { useChartDimensions } from '../../../../hooks/useChartDimensions'; +import { formatToDecimalPlacesIfCents } from '../../../utils/formatToDecimalPlacesIfCents'; + +export interface SkChartPieProps extends ChartDonutProps { + data: { x: string; y: number }[]; + format?: Function; + padding?: Record; +} + +const SkChartPie: FC = function ({ + data, + legendOrientation = 'horizontal', + legendPosition = 'bottom', + format = (y: number) => y, + height = CHART_CONFIG.LAYOUT.DEFAULT_HEIGHT, + padding = CHART_CONFIG.LAYOUT.DEFAULT_PADDING, + ...props +}) { + const { chartWidth, chartContainerRef } = useChartDimensions(); + + const total = data.reduce((acc, { y }) => acc + y, 0); + const labels = data.map(({ x, y }) => `${x}: ${format(y)}`); + const legendData = data.map(({ x, y }) => ({ + name: `${x}: ${total ? formatToDecimalPlacesIfCents((y * 100) / total, 1) : 0}%` + })); + + return ( +
+ + } + legendOrientation={legendOrientation} + legendPosition={legendPosition} + legendData={legendData} + padding={padding} + {...props} + /> +
+ ); +}; + +export default SkChartPie; diff --git a/src/core/components/SKDurationCell/index.tsx b/src/core/components/SkTable/SkCustomCells/SKDurationCell/index.tsx similarity index 84% rename from src/core/components/SKDurationCell/index.tsx rename to src/core/components/SkTable/SkCustomCells/SKDurationCell/index.tsx index 655a7e04..2fd78716 100644 --- a/src/core/components/SKDurationCell/index.tsx +++ b/src/core/components/SkTable/SkCustomCells/SKDurationCell/index.tsx @@ -1,6 +1,6 @@ import { ReactNode } from 'react'; -import { formatLatency } from '../../utils/formatLatency'; +import { formatLatency } from '../../../../utils/formatLatency'; interface SKDurationCellProps { data: T; diff --git a/src/core/components/SkEndTimeCell/index.tsx b/src/core/components/SkTable/SkCustomCells/SkEndTimeCell/index.tsx similarity index 81% rename from src/core/components/SkEndTimeCell/index.tsx rename to src/core/components/SkTable/SkCustomCells/SkEndTimeCell/index.tsx index 54ade208..82445c61 100644 --- a/src/core/components/SkEndTimeCell/index.tsx +++ b/src/core/components/SkTable/SkCustomCells/SkEndTimeCell/index.tsx @@ -3,8 +3,8 @@ import { ReactNode } from 'react'; import { Icon, Content, Tooltip } from '@patternfly/react-core'; import { GlobeAmericasIcon } from '@patternfly/react-icons'; -import { EMPTY_VALUE_SYMBOL } from '../../../config/app'; -import { formatLocalizedDateTime } from '../../utils/formatLocalizedDateTime'; +import { EMPTY_VALUE_SYMBOL } from '../../../../../config/app'; +import { formatLocalizedDateTime } from '../../../../utils/formatLocalizedDateTime'; interface EndTimeCellProps { data: T; diff --git a/src/core/components/SkLinkCell/index.tsx b/src/core/components/SkTable/SkCustomCells/SkLinkCell/index.tsx similarity index 83% rename from src/core/components/SkLinkCell/index.tsx rename to src/core/components/SkTable/SkCustomCells/SkLinkCell/index.tsx index 71678355..c531e5cc 100644 --- a/src/core/components/SkLinkCell/index.tsx +++ b/src/core/components/SkTable/SkCustomCells/SkLinkCell/index.tsx @@ -1,7 +1,7 @@ import { Link } from 'react-router-dom'; -import { EMPTY_VALUE_SYMBOL } from '../../../config/app'; -import ResourceIcon, { ResourceIconProps } from '../ResourceIcon'; +import { EMPTY_VALUE_SYMBOL } from '../../../../../config/app'; +import ResourceIcon, { ResourceIconProps } from '../../../ResourceIcon'; export interface SkLinkCellProps { data: T; diff --git a/src/core/components/SkLinkStatusCell/index.tsx b/src/core/components/SkTable/SkCustomCells/SkLinkStatusCell/index.tsx similarity index 100% rename from src/core/components/SkLinkStatusCell/index.tsx rename to src/core/components/SkTable/SkCustomCells/SkLinkStatusCell/index.tsx diff --git a/src/core/components/SkViewDetailsCell/index.tsx b/src/core/components/SkTable/SkCustomCells/SkViewDetailsCell/index.tsx similarity index 100% rename from src/core/components/SkViewDetailsCell/index.tsx rename to src/core/components/SkTable/SkCustomCells/SkViewDetailsCell/index.tsx diff --git a/src/pages/Components/Components.constants.ts b/src/pages/Components/Components.constants.ts index 05f42dfe..c3229b12 100644 --- a/src/pages/Components/Components.constants.ts +++ b/src/pages/Components/Components.constants.ts @@ -2,8 +2,8 @@ import { SKTableColumn } from 'types/SkTable.interfaces'; import { ComponentRoutesPaths } from './Components.enum'; import { Labels } from '../../config/labels'; -import SkEndTimeCell from '../../core/components/SkEndTimeCell'; -import SkLinkCell, { SkLinkCellProps } from '../../core/components/SkLinkCell'; +import SkEndTimeCell from '../../core/components/SkTable/SkCustomCells/SkEndTimeCell'; +import SkLinkCell, { SkLinkCellProps } from '../../core/components/SkTable/SkCustomCells/SkLinkCell'; import { ComponentResponse, PairsResponse } from '../../types/REST.interfaces'; export const ComponentsPaths = { diff --git a/src/pages/Processes/Processes.constants.ts b/src/pages/Processes/Processes.constants.ts index 28656596..e0959153 100644 --- a/src/pages/Processes/Processes.constants.ts +++ b/src/pages/Processes/Processes.constants.ts @@ -2,9 +2,9 @@ import { SKTableColumn } from 'types/SkTable.interfaces'; import { ProcessesRoutesPaths } from './Processes.enum'; import { Labels } from '../../config/labels'; -import SkEndTimeCell from '../../core/components/SkEndTimeCell'; -import SkLinkCell, { SkLinkCellProps } from '../../core/components/SkLinkCell'; import { SkSelectOption } from '../../core/components/SkSelect'; +import SkEndTimeCell from '../../core/components/SkTable/SkCustomCells/SkEndTimeCell'; +import SkLinkCell, { SkLinkCellProps } from '../../core/components/SkTable/SkCustomCells/SkLinkCell'; import { formatByteRate, formatBytes } from '../../core/utils/formatBytes'; import { ProcessPairsResponse, ProcessResponse, PairsWithInstantMetrics } from '../../types/REST.interfaces'; import { ComponentRoutesPaths } from '../Components/Components.enum'; diff --git a/src/pages/Processes/components/PairDetails.tsx b/src/pages/Processes/components/PairDetails.tsx index 243fe5f9..eb727dfa 100644 --- a/src/pages/Processes/components/PairDetails.tsx +++ b/src/pages/Processes/components/PairDetails.tsx @@ -5,7 +5,7 @@ import { LongArrowAltRightIcon } from '@patternfly/react-icons'; import Details from './Details'; import { styles } from '../../../config/styles'; -import SkLinkCell from '../../../core/components/SkLinkCell'; +import SkLinkCell from '../../../core/components/SkTable/SkCustomCells/SkLinkCell'; import { ProcessResponse } from '../../../types/REST.interfaces'; import { ProcessesRoutesPaths } from '../Processes.enum'; diff --git a/src/pages/Services/Services.constants.ts b/src/pages/Services/Services.constants.ts index 2cde10ee..7fb56c0a 100644 --- a/src/pages/Services/Services.constants.ts +++ b/src/pages/Services/Services.constants.ts @@ -3,9 +3,9 @@ import { ServicesRoutesPaths } from './Services.enum'; import { SortDirection, TcpStatus } from '../../API/REST.enum'; import { BIG_PAGINATION_SIZE, EMPTY_VALUE_SYMBOL } from '../../config/app'; import { Labels } from '../../config/labels'; -import SkEndTimeCell from '../../core/components/SkEndTimeCell'; -import SkLinkCell, { SkLinkCellProps } from '../../core/components/SkLinkCell'; import { SkSelectOption } from '../../core/components/SkSelect'; +import SkEndTimeCell from '../../core/components/SkTable/SkCustomCells/SkEndTimeCell'; +import SkLinkCell, { SkLinkCellProps } from '../../core/components/SkTable/SkCustomCells/SkLinkCell'; import { formatByteRate, formatBytes } from '../../core/utils/formatBytes'; import { ServiceResponse, diff --git a/src/pages/Services/components/ConnectorProcessCountCell.tsx b/src/pages/Services/components/ConnectorProcessCountCell.tsx index 62ac4729..859fb2c9 100644 --- a/src/pages/Services/components/ConnectorProcessCountCell.tsx +++ b/src/pages/Services/components/ConnectorProcessCountCell.tsx @@ -2,7 +2,7 @@ import { Button, List, ListItem, Popover } from '@patternfly/react-core'; import { ConnectorResponse } from 'types/REST.interfaces'; import { Labels } from '../../../config/labels'; -import SkLinkCell, { SkLinkCellProps } from '../../../core/components/SkLinkCell'; +import SkLinkCell, { SkLinkCellProps } from '../../../core/components/SkTable/SkCustomCells/SkLinkCell'; import { ProcessesRoutesPaths } from '../../Processes/Processes.enum'; const ConnectorProcessCountCell = function (props: SkLinkCellProps) { diff --git a/src/pages/Services/components/PairsSankeyChart.tsx b/src/pages/Services/components/PairsSankeyChart.tsx index 5e19b5e9..3c5db7a2 100644 --- a/src/pages/Services/components/PairsSankeyChart.tsx +++ b/src/pages/Services/components/PairsSankeyChart.tsx @@ -3,11 +3,11 @@ import { FC, useCallback, useState, startTransition } from 'react'; import { Card, CardBody, CardHeader, Content, ContentVariants } from '@patternfly/react-core'; import { Labels } from '../../../config/labels'; -import SkSankeyChart from '../../../core/components/SKSanckeyChart'; +import SkSankeyChart from '../../../core/components/SkCharts/SKSanckeyChart'; import { ServiceClientResourceOptions, ServiceServerResourceOptions -} from '../../../core/components/SKSanckeyChart/SkSankey.constants'; +} from '../../../core/components/SkCharts/SKSanckeyChart/SkSankey.constants'; import { formatByteRate, formatBytes } from '../../../core/utils/formatBytes'; import { MetricKeys } from '../../../types/SkSankeyChart.interfaces'; import { ServicesController } from '../services'; diff --git a/src/pages/Services/services/index.ts b/src/pages/Services/services/index.ts index 9e267c27..911b62e4 100644 --- a/src/pages/Services/services/index.ts +++ b/src/pages/Services/services/index.ts @@ -1,6 +1,6 @@ import { DEFAULT_COMPLEX_STRING_SEPARATOR } from '../../../config/app'; import { styles } from '../../../config/styles'; -import { DEFAULT_SANKEY_CHART_FLOW_VALUE } from '../../../core/components/SKSanckeyChart/SkSankey.constants'; +import { DEFAULT_SANKEY_CHART_FLOW_VALUE } from '../../../core/components/SkCharts/SKSanckeyChart/SkSankey.constants'; import { removeDuplicatesFromArrayOfObjects } from '../../../core/utils/removeDuplicatesFromArrayOfObjects'; import { GraphCombo, GraphEdge, GraphElementNames, GraphIconKeys, GraphNode } from '../../../types/Graph.interfaces'; import { ConnectorResponse, ListenerResponse } from '../../../types/REST.interfaces'; diff --git a/src/pages/Sites/Sites.constants.ts b/src/pages/Sites/Sites.constants.ts index d6e01289..2d628dcb 100644 --- a/src/pages/Sites/Sites.constants.ts +++ b/src/pages/Sites/Sites.constants.ts @@ -2,9 +2,9 @@ import { SKTableColumn } from 'types/SkTable.interfaces'; import { SitesRoutesPaths } from './Sites.enum'; import { Labels } from '../../config/labels'; -import SkEndTimeCell from '../../core/components/SkEndTimeCell'; -import SkLinkCell, { SkLinkCellProps } from '../../core/components/SkLinkCell'; -import SkLinkStatusCell from '../../core/components/SkLinkStatusCell'; +import SkEndTimeCell from '../../core/components/SkTable/SkCustomCells/SkEndTimeCell'; +import SkLinkCell, { SkLinkCellProps } from '../../core/components/SkTable/SkCustomCells/SkLinkCell'; +import SkLinkStatusCell from '../../core/components/SkTable/SkCustomCells/SkLinkStatusCell'; import { PairsResponse, RouterLinkResponse, SiteResponse } from '../../types/REST.interfaces'; export const SitesPaths = { diff --git a/src/pages/shared/Metrics/components/LatencyCharts.tsx b/src/pages/shared/Metrics/components/LatencyCharts.tsx index 9136cced..1f9ade74 100644 --- a/src/pages/shared/Metrics/components/LatencyCharts.tsx +++ b/src/pages/shared/Metrics/components/LatencyCharts.tsx @@ -3,7 +3,7 @@ import { FC, memo } from 'react'; import { Flex, FlexItem } from '@patternfly/react-core'; import { Labels } from '../../../../config/labels'; -import SkChartArea from '../../../../core/components/SkChartArea'; +import SkChartArea from '../../../../core/components/SkCharts/SkChartArea'; import SkIsLoading from '../../../../core/components/SkIsLoading'; import { formatLatency } from '../../../../core/utils/formatLatency'; import { LatencyMetrics } from '../../../../types/Metrics.interfaces'; diff --git a/src/pages/shared/Metrics/components/RequestCharts.tsx b/src/pages/shared/Metrics/components/RequestCharts.tsx index 0ab4b314..879e1062 100644 --- a/src/pages/shared/Metrics/components/RequestCharts.tsx +++ b/src/pages/shared/Metrics/components/RequestCharts.tsx @@ -4,7 +4,7 @@ import { Divider, Flex, FlexItem } from '@patternfly/react-core'; import { Table, Tbody, Td, Th, Thead, Tr } from '@patternfly/react-table'; import { Labels } from '../../../../config/labels'; -import SkChartArea from '../../../../core/components/SkChartArea'; +import SkChartArea from '../../../../core/components/SkCharts/SkChartArea'; import { formatToDecimalPlacesIfCents } from '../../../../core/utils/formatToDecimalPlacesIfCents'; import { RequestMetrics } from '../../../../types/Metrics.interfaces'; diff --git a/src/pages/shared/Metrics/components/ResponseCharts.tsx b/src/pages/shared/Metrics/components/ResponseCharts.tsx index 81e8a931..cae37373 100644 --- a/src/pages/shared/Metrics/components/ResponseCharts.tsx +++ b/src/pages/shared/Metrics/components/ResponseCharts.tsx @@ -6,8 +6,8 @@ import { Divider, Flex, FlexItem, Grid, GridItem } from '@patternfly/react-core' import { Labels } from '../../../../config/labels'; import { hexColors } from '../../../../config/styles'; import SkBasicTile from '../../../../core/components/SkBasicTile'; -import SkChartArea from '../../../../core/components/SkChartArea'; -import SkChartPie from '../../../../core/components/SkChartPie'; +import SkChartArea from '../../../../core/components/SkCharts/SkChartArea'; +import SkChartPie from '../../../../core/components/SkCharts/SkChartPie'; import { convertToPercentage } from '../../../../core/utils/convertToPercentage'; import { formatToDecimalPlacesIfCents } from '../../../../core/utils/formatToDecimalPlacesIfCents'; import { ResponseMetrics } from '../../../../types/Metrics.interfaces'; diff --git a/src/pages/shared/Metrics/components/TcpConnection.tsx b/src/pages/shared/Metrics/components/TcpConnection.tsx index e3ee6fc0..53ef2b2a 100644 --- a/src/pages/shared/Metrics/components/TcpConnection.tsx +++ b/src/pages/shared/Metrics/components/TcpConnection.tsx @@ -16,7 +16,7 @@ import { SearchIcon } from '@patternfly/react-icons'; import { useQuery } from '@tanstack/react-query'; import { Labels } from '../../../../config/labels'; -import SkChartArea from '../../../../core/components/SkChartArea'; +import SkChartArea from '../../../../core/components/SkCharts/SkChartArea'; import SKEmptyData from '../../../../core/components/SkEmptyData'; import SkIsLoading from '../../../../core/components/SkIsLoading'; import { formatNumber } from '../../../../core/utils/formatNumber'; diff --git a/src/pages/shared/Metrics/components/TrafficCharts.tsx b/src/pages/shared/Metrics/components/TrafficCharts.tsx index 0e03edd2..1030a9ae 100644 --- a/src/pages/shared/Metrics/components/TrafficCharts.tsx +++ b/src/pages/shared/Metrics/components/TrafficCharts.tsx @@ -6,8 +6,8 @@ import { Table, Tbody, Td, Th, Thead, Tr } from '@patternfly/react-table'; import { Labels } from '../../../../config/labels'; import { styles } from '../../../../config/styles'; -import SkChartArea from '../../../../core/components/SkChartArea'; -import SkChartPie from '../../../../core/components/SkChartPie'; +import SkChartArea from '../../../../core/components/SkCharts/SkChartArea'; +import SkChartPie from '../../../../core/components/SkCharts/SkChartPie'; import { formatByteRate, formatBytes } from '../../../../core/utils/formatBytes'; import { ByteRateMetrics } from '../../../../types/Metrics.interfaces'; import { MetricsController } from '../services'; diff --git a/src/pages/shared/Metrics/metrics.utils.ts b/src/pages/shared/Metrics/metrics.utils.ts index 9cb2249a..3e43f218 100644 --- a/src/pages/shared/Metrics/metrics.utils.ts +++ b/src/pages/shared/Metrics/metrics.utils.ts @@ -12,7 +12,7 @@ import { ResponseMetrics } from '../../../types/Metrics.interfaces'; import { PrometheusMetric } from '../../../types/Prometheus.interfaces'; -import { skAxisXY } from '../../../types/SkChartArea.interfaces'; +import { skAxisXY } from '../../../types/SkCharts'; function normalizeResponsesFromSeries(data: PrometheusMetric<'matrix'>[]): ResponseMetrics | null { // Convert the Prometheus API result into a chart data format diff --git a/src/pages/shared/Metrics/services/index.ts b/src/pages/shared/Metrics/services/index.ts index 7df5b228..e65ff958 100644 --- a/src/pages/shared/Metrics/services/index.ts +++ b/src/pages/shared/Metrics/services/index.ts @@ -13,7 +13,7 @@ import { getDataTrafficMetrics } from '../../../../types/Metrics.interfaces'; import { PrometheusQueryParams } from '../../../../types/Prometheus.interfaces'; -import { skAxisXY } from '../../../../types/SkChartArea.interfaces'; +import { skAxisXY } from '../../../../types/SkCharts'; import { alignDataSeriesWithZeros, normalizeByteRateFromSeries, diff --git a/src/types/Metrics.interfaces.ts b/src/types/Metrics.interfaces.ts index 4064343d..ec80b6c8 100644 --- a/src/types/Metrics.interfaces.ts +++ b/src/types/Metrics.interfaces.ts @@ -1,5 +1,5 @@ import { PrometheusMetric } from './Prometheus.interfaces'; -import { skAxisXY } from './SkChartArea.interfaces'; +import { skAxisXY } from './SkCharts'; import { Protocols, Direction } from '../API/REST.enum'; import { Labels } from '../config/labels'; diff --git a/src/types/Prometheus.interfaces.ts b/src/types/Prometheus.interfaces.ts index 835f2a8b..87511503 100644 --- a/src/types/Prometheus.interfaces.ts +++ b/src/types/Prometheus.interfaces.ts @@ -1,4 +1,4 @@ -import { skAxisXY } from './SkChartArea.interfaces'; +import { skAxisXY } from './SkCharts'; import { Direction, Protocols, Quantiles } from '../API/REST.enum'; // Common base type for result types type PrometheusResultType = 'matrix' | 'vector' | 'scalar' | 'string'; diff --git a/src/types/SkChartArea.interfaces.ts b/src/types/SkCharts.ts similarity index 100% rename from src/types/SkChartArea.interfaces.ts rename to src/types/SkCharts.ts