Skip to content

Commit a4c394b

Browse files
Revert "[charts] Memoize series series selectors (mui#20326)"
This reverts commit ffb010d.
1 parent 527af3c commit a4c394b

File tree

11 files changed

+138
-99
lines changed

11 files changed

+138
-99
lines changed

packages/x-charts-pro/src/hooks/useFunnelSeries.ts

Lines changed: 7 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,15 @@
11
'use client';
22
import {
3-
useSeriesOfType,
4-
useAllSeriesOfType,
3+
createAllSeriesSelectorOfType,
4+
createSeriesSelectorsOfType,
55
ProcessedSeries,
66
SeriesId,
77
ChartSeriesDefaultized,
88
} from '@mui/x-charts/internals';
99

10+
const useSelectorSeries = createSeriesSelectorsOfType('funnel');
11+
const useSelectorSeriesContext = createAllSeriesSelectorOfType('funnel');
12+
1013
export type UseFunnelSeriesReturnValue = ChartSeriesDefaultized<'funnel'>;
1114
export type UseFunnelSeriesContextReturnValue = ProcessedSeries['funnel'];
1215

@@ -33,7 +36,7 @@ export function useFunnelSeries(): UseFunnelSeriesReturnValue[];
3336
*/
3437
export function useFunnelSeries(seriesIds: SeriesId[]): UseFunnelSeriesReturnValue[];
3538
export function useFunnelSeries(seriesIds?: SeriesId | SeriesId[]) {
36-
return useSeriesOfType('funnel', seriesIds);
39+
return useSelectorSeries(seriesIds);
3740
}
3841

3942
/**
@@ -44,5 +47,5 @@ export function useFunnelSeries(seriesIds?: SeriesId | SeriesId[]) {
4447
* @returns the funnel series
4548
*/
4649
export function useFunnelSeriesContext(): UseFunnelSeriesContextReturnValue {
47-
return useAllSeriesOfType('funnel');
50+
return useSelectorSeriesContext();
4851
}

packages/x-charts-pro/src/hooks/useHeatmapSeries.ts

Lines changed: 7 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,15 @@
11
'use client';
22
import {
3-
useSeriesOfType,
4-
useAllSeriesOfType,
3+
createAllSeriesSelectorOfType,
4+
createSeriesSelectorsOfType,
55
ProcessedSeries,
66
SeriesId,
77
ChartSeriesDefaultized,
88
} from '@mui/x-charts/internals';
99

10+
const useSelectorSeries = createSeriesSelectorsOfType('heatmap');
11+
const useSelectorSeriesContext = createAllSeriesSelectorOfType('heatmap');
12+
1013
export type UseHeatmapSeriesReturnValue = ChartSeriesDefaultized<'heatmap'>;
1114
export type UseHeatmapSeriesContextReturnValue = ProcessedSeries['heatmap'];
1215

@@ -33,7 +36,7 @@ export function useHeatmapSeries(): UseHeatmapSeriesReturnValue[];
3336
*/
3437
export function useHeatmapSeries(seriesIds: SeriesId[]): UseHeatmapSeriesReturnValue[];
3538
export function useHeatmapSeries(seriesIds?: SeriesId | SeriesId[]) {
36-
return useSeriesOfType('heatmap', seriesIds);
39+
return useSelectorSeries(seriesIds);
3740
}
3841

3942
/**
@@ -44,5 +47,5 @@ export function useHeatmapSeries(seriesIds?: SeriesId | SeriesId[]) {
4447
* @returns the heatmap series
4548
*/
4649
export function useHeatmapSeriesContext(): UseHeatmapSeriesContextReturnValue {
47-
return useAllSeriesOfType('heatmap');
50+
return useSelectorSeriesContext();
4851
}

packages/x-charts-pro/src/hooks/useSankeySeries.ts

Lines changed: 7 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,15 @@
11
'use client';
22
import {
3-
useSeriesOfType,
4-
useAllSeriesOfType,
3+
createAllSeriesSelectorOfType,
4+
createSeriesSelectorsOfType,
55
ProcessedSeries,
66
SeriesId,
77
ChartSeriesDefaultized,
88
} from '@mui/x-charts/internals';
99

10+
const useSelectorSeries = createSeriesSelectorsOfType('sankey');
11+
const useSelectorSeriesContext = createAllSeriesSelectorOfType('sankey');
12+
1013
export type UseSankeySeriesReturnValue = ChartSeriesDefaultized<'sankey'>;
1114
export type UseSankeySeriesContextReturnValue = ProcessedSeries['sankey'];
1215

@@ -33,7 +36,7 @@ export function useSankeySeries(): UseSankeySeriesReturnValue[];
3336
*/
3437
export function useSankeySeries(seriesIds: SeriesId[]): UseSankeySeriesReturnValue[];
3538
export function useSankeySeries(seriesIds?: SeriesId | SeriesId[]) {
36-
return useSeriesOfType('sankey', seriesIds);
39+
return useSelectorSeries(seriesIds);
3740
}
3841

3942
/**
@@ -44,5 +47,5 @@ export function useSankeySeries(seriesIds?: SeriesId | SeriesId[]) {
4447
* @returns the sankey series
4548
*/
4649
export function useSankeySeriesContext(): UseSankeySeriesContextReturnValue {
47-
return useAllSeriesOfType('sankey');
50+
return useSelectorSeriesContext();
4851
}

packages/x-charts/src/hooks/useBarSeries.ts

Lines changed: 9 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,13 @@
22
import { ProcessedSeries } from '../internals/plugins/corePlugins/useChartSeries/useChartSeries.types';
33
import { SeriesId } from '../models/seriesType/common';
44
import { ChartSeriesDefaultized } from '../models/seriesType/config';
5-
import { useSeriesOfType, useAllSeriesOfType } from '../internals/seriesSelectorOfType';
5+
import {
6+
createSeriesSelectorsOfType,
7+
createAllSeriesSelectorOfType,
8+
} from '../internals/createSeriesSelectorOfType';
9+
10+
const useSelectorSeries = createSeriesSelectorsOfType('bar');
11+
const useSelectorSeriesContext = createAllSeriesSelectorOfType('bar');
612

713
export type UseBarSeriesReturnValue = ChartSeriesDefaultized<'bar'>;
814
export type UseBarSeriesContextReturnValue = ProcessedSeries['bar'];
@@ -30,7 +36,7 @@ export function useBarSeries(): UseBarSeriesReturnValue[];
3036
*/
3137
export function useBarSeries(seriesIds: SeriesId[]): UseBarSeriesReturnValue[];
3238
export function useBarSeries(seriesIds?: SeriesId | SeriesId[]) {
33-
return useSeriesOfType('bar', seriesIds);
39+
return useSelectorSeries(seriesIds);
3440
}
3541

3642
/**
@@ -42,5 +48,5 @@ export function useBarSeries(seriesIds?: SeriesId | SeriesId[]) {
4248
* @returns the bar series
4349
*/
4450
export function useBarSeriesContext(): UseBarSeriesContextReturnValue {
45-
return useAllSeriesOfType('bar');
51+
return useSelectorSeriesContext();
4652
}

packages/x-charts/src/hooks/useLineSeries.ts

Lines changed: 9 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,13 @@
22
import { ProcessedSeries } from '../internals/plugins/corePlugins/useChartSeries/useChartSeries.types';
33
import { SeriesId } from '../models/seriesType/common';
44
import { ChartSeriesDefaultized } from '../models/seriesType/config';
5-
import { useSeriesOfType, useAllSeriesOfType } from '../internals/seriesSelectorOfType';
5+
import {
6+
createSeriesSelectorsOfType,
7+
createAllSeriesSelectorOfType,
8+
} from '../internals/createSeriesSelectorOfType';
9+
10+
const useSelectorSeries = createSeriesSelectorsOfType('line');
11+
const useSelectorSeriesContext = createAllSeriesSelectorOfType('line');
612

713
export type UseLineSeriesReturnValue = ChartSeriesDefaultized<'line'>;
814
export type UseLineSeriesContextReturnValue = ProcessedSeries['line'];
@@ -30,7 +36,7 @@ export function useLineSeries(): UseLineSeriesReturnValue[];
3036
*/
3137
export function useLineSeries(seriesIds: SeriesId[]): UseLineSeriesReturnValue[];
3238
export function useLineSeries(seriesIds?: SeriesId | SeriesId[]) {
33-
return useSeriesOfType('line', seriesIds);
39+
return useSelectorSeries(seriesIds);
3440
}
3541

3642
/**
@@ -42,5 +48,5 @@ export function useLineSeries(seriesIds?: SeriesId | SeriesId[]) {
4248
* @returns the line series
4349
*/
4450
export function useLineSeriesContext(): UseLineSeriesContextReturnValue {
45-
return useAllSeriesOfType('line');
51+
return useSelectorSeriesContext();
4652
}

packages/x-charts/src/hooks/usePieSeries.ts

Lines changed: 9 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,13 @@
22
import { ProcessedSeries } from '../internals/plugins/corePlugins/useChartSeries/useChartSeries.types';
33
import { SeriesId } from '../models/seriesType/common';
44
import { ChartSeriesDefaultized } from '../models/seriesType/config';
5-
import { useSeriesOfType, useAllSeriesOfType } from '../internals/seriesSelectorOfType';
5+
import {
6+
createSeriesSelectorsOfType,
7+
createAllSeriesSelectorOfType,
8+
} from '../internals/createSeriesSelectorOfType';
9+
10+
const useSelectorSeries = createSeriesSelectorsOfType('pie');
11+
const useSelectorSeriesContext = createAllSeriesSelectorOfType('pie');
612

713
export type UsePieSeriesReturnValue = ChartSeriesDefaultized<'pie'>;
814
export type UsePieSeriesContextReturnValue = ProcessedSeries['pie'];
@@ -30,7 +36,7 @@ export function usePieSeries(): UsePieSeriesReturnValue[];
3036
*/
3137
export function usePieSeries(seriesIds: SeriesId[]): UsePieSeriesReturnValue[];
3238
export function usePieSeries(seriesIds?: SeriesId | SeriesId[]) {
33-
return useSeriesOfType('pie', seriesIds);
39+
return useSelectorSeries(seriesIds);
3440
}
3541

3642
/**
@@ -41,5 +47,5 @@ export function usePieSeries(seriesIds?: SeriesId | SeriesId[]) {
4147
* @returns the pie series
4248
*/
4349
export function usePieSeriesContext(): UsePieSeriesContextReturnValue {
44-
return useAllSeriesOfType('pie');
50+
return useSelectorSeriesContext();
4551
}

packages/x-charts/src/hooks/useRadarSeries.ts

Lines changed: 9 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,13 @@
22
import { ProcessedSeries } from '../internals/plugins/corePlugins/useChartSeries/useChartSeries.types';
33
import { SeriesId } from '../models/seriesType/common';
44
import { ChartSeriesDefaultized } from '../models/seriesType/config';
5-
import { useSeriesOfType, useAllSeriesOfType } from '../internals/seriesSelectorOfType';
5+
import {
6+
createSeriesSelectorsOfType,
7+
createAllSeriesSelectorOfType,
8+
} from '../internals/createSeriesSelectorOfType';
9+
10+
const useSelectorSeries = createSeriesSelectorsOfType('radar');
11+
const useSelectorSeriesContext = createAllSeriesSelectorOfType('radar');
612

713
export type UseRadarSeriesReturnValue = ChartSeriesDefaultized<'radar'>;
814
export type UseRadarSeriesContextReturnValue = ProcessedSeries['radar'];
@@ -30,7 +36,7 @@ export function useRadarSeries(): UseRadarSeriesReturnValue[];
3036
*/
3137
export function useRadarSeries(seriesIds?: SeriesId[]): UseRadarSeriesReturnValue[];
3238
export function useRadarSeries(seriesIds?: SeriesId | SeriesId[]) {
33-
return useSeriesOfType('radar', seriesIds);
39+
return useSelectorSeries(seriesIds);
3440
}
3541

3642
/**
@@ -41,5 +47,5 @@ export function useRadarSeries(seriesIds?: SeriesId | SeriesId[]) {
4147
* @returns the radar series
4248
*/
4349
export function useRadarSeriesContext(): UseRadarSeriesContextReturnValue {
44-
return useAllSeriesOfType('radar');
50+
return useSelectorSeriesContext();
4551
}

packages/x-charts/src/hooks/useScatterSeries.ts

Lines changed: 9 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,13 @@
22
import { ProcessedSeries } from '../internals/plugins/corePlugins/useChartSeries/useChartSeries.types';
33
import { SeriesId } from '../models/seriesType/common';
44
import { ChartSeriesDefaultized } from '../models/seriesType/config';
5-
import { useSeriesOfType, useAllSeriesOfType } from '../internals/seriesSelectorOfType';
5+
import {
6+
createSeriesSelectorsOfType,
7+
createAllSeriesSelectorOfType,
8+
} from '../internals/createSeriesSelectorOfType';
9+
10+
const useSelectorSeries = createSeriesSelectorsOfType('scatter');
11+
const useSelectorSeriesContext = createAllSeriesSelectorOfType('scatter');
612

713
export type UseScatterSeriesReturnValue = ChartSeriesDefaultized<'scatter'>;
814
export type UseScatterSeriesContextReturnValue = ProcessedSeries['scatter'];
@@ -30,7 +36,7 @@ export function useScatterSeries(): UseScatterSeriesReturnValue[];
3036
*/
3137
export function useScatterSeries(seriesIds: SeriesId[]): UseScatterSeriesReturnValue[];
3238
export function useScatterSeries(seriesIds?: SeriesId | SeriesId[]) {
33-
return useSeriesOfType('scatter', seriesIds);
39+
return useSelectorSeries(seriesIds);
3440
}
3541

3642
/**
@@ -41,5 +47,5 @@ export function useScatterSeries(seriesIds?: SeriesId | SeriesId[]) {
4147
* @returns the scatter series
4248
*/
4349
export function useScatterSeriesContext(): UseScatterSeriesContextReturnValue {
44-
return useAllSeriesOfType('scatter');
50+
return useSelectorSeriesContext();
4551
}
Lines changed: 71 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,71 @@
1+
// import { fastArrayCompare } from '@mui/x-internals/fastArrayCompare';
2+
import { warnOnce } from '@mui/x-internals/warning';
3+
import { ChartSeriesDefaultized, ChartsSeriesConfig } from '../models/seriesType/config';
4+
import { SeriesId } from '../models/seriesType/common';
5+
import { createSelector } from './plugins/utils/selectors';
6+
import { selectorChartSeriesProcessed } from './plugins/corePlugins/useChartSeries/useChartSeries.selectors';
7+
import { useStore } from './store/useStore';
8+
import { useSelector } from './store/useSelector';
9+
10+
export function createSeriesSelectorsOfType<T extends keyof ChartsSeriesConfig>(seriesType: T) {
11+
const selectorSeriesWithIds = createSelector(
12+
[selectorChartSeriesProcessed],
13+
(processedSeries, ids?: SeriesId | SeriesId[]) => {
14+
if (!ids || (Array.isArray(ids) && ids.length === 0)) {
15+
return (
16+
processedSeries[seriesType]?.seriesOrder?.map(
17+
(seriesId) => processedSeries[seriesType]?.series[seriesId],
18+
) ?? []
19+
);
20+
}
21+
22+
if (!Array.isArray(ids)) {
23+
return processedSeries[seriesType]?.series?.[ids];
24+
}
25+
26+
const result: ChartSeriesDefaultized<T>[] = [];
27+
const failedIds: SeriesId[] = [];
28+
for (const id of ids) {
29+
const series = processedSeries[seriesType]?.series?.[id];
30+
if (series) {
31+
result.push(series);
32+
} else {
33+
failedIds.push(id);
34+
}
35+
}
36+
if (process.env.NODE_ENV !== 'production' && failedIds.length > 0) {
37+
const formattedIds = failedIds.map((v) => JSON.stringify(v)).join(', ');
38+
const fnName = `use${seriesType.charAt(0).toUpperCase()}${seriesType.slice(1)}Series`;
39+
warnOnce([
40+
`MUI X Charts: The following ids provided to "${fnName}" could not be found: ${formattedIds}.`,
41+
`Make sure that they exist and their series are using the "${seriesType}" series type.`,
42+
]);
43+
}
44+
return result;
45+
},
46+
);
47+
48+
return (ids?: SeriesId | SeriesId[]) => {
49+
const store = useStore();
50+
51+
return useSelector(
52+
store,
53+
selectorSeriesWithIds,
54+
ids,
55+
// fastArrayCompare
56+
);
57+
};
58+
}
59+
60+
export function createAllSeriesSelectorOfType<T extends keyof ChartsSeriesConfig>(seriesType: T) {
61+
const selectorSeries = createSelector(
62+
[selectorChartSeriesProcessed],
63+
(processedSeries) => processedSeries[seriesType],
64+
);
65+
66+
return () => {
67+
const store = useStore();
68+
69+
return useSelector(store, selectorSeries);
70+
};
71+
}

packages/x-charts/src/internals/index.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,7 @@ export { useBarPlotData } from '../BarChart/useBarPlotData';
1818
export { useRadarChartProps } from '../RadarChart/useRadarChartProps';
1919
export * from '../ChartContainer/useChartContainerProps';
2020
export * from '../ChartDataProvider/useChartDataProviderProps';
21-
export * from './seriesSelectorOfType';
21+
export * from './createSeriesSelectorOfType';
2222

2323
// plugins
2424
export * from './plugins/corePlugins/useChartId';

0 commit comments

Comments
 (0)