persist computation result filters #3484

ghazwarhili · 2025-11-21T08:05:55Z

PR Summary

Manage all the calculation result filters with a single hook.

…-state

…ters-persist-state' into implement-computation-result-filters-persist-state

…-state

sonarqubecloud · 2025-12-10T14:50:50Z

Quality Gate failed

Failed conditions
11.1% Duplication on New Code (required ≤ 3%)

See analysis details on SonarQube Cloud

flomillot

Some renaming to do to be more acurate and understable

onFilter -> onFilterChange
api -> agGridApi

flomillot · 2025-12-17T10:38:57Z

src/components/results/loadflow/load-flow-result-tab.tsx


    const { countriesFilter, voltageLevelsFilter, propertiesFilter } = useGlobalFilterOptions();
-    const { globalFilters, handleGlobalFilterChange } = useGlobalFilters();
+    const { handleGlobalFilterChange, globalFilters } = useGlobalFilters();


the setter at the end, keep original order?

flomillot · 2025-12-17T11:38:54Z

src/components/results/loadflow/load-flow-result-tab.tsx


+    const { persistFilters } = useComputationColumnsFilters(AgGridFilterType.Loadflow, mappingTabs(tabIndex));
+
+    const onFilter = useCallback(


Suggested change

const onFilter = useCallback(

const onFilterChange = useCallback(

flomillot · 2025-12-17T11:45:14Z

src/hooks/use-computation-global-filters.ts

+        [dispatchGlobalFilters, studyUuid, config?.id]
+    );
+
+    return useMemo(


I don't understand why this useMemo ?

flomillot · 2025-12-17T11:47:34Z

src/hooks/use-computation-columns-filters.ts

+        [studyUuid, computationResultFilterUuid, columnUuid]
+    );
+
+    return useMemo(


flomillot · 2025-12-17T11:50:20Z

src/hooks/use-computation-columns-filters.ts

+    );
+
+    const persistFilters = useCallback(
+        (colId: string, api: GridApi, filters: FilterConfig[]) => {


Suggested change

(colId: string, api: GridApi, filters: FilterConfig[]) => {

(colId: string, agGridApi: GridApi, filters: FilterConfig[]) => {

flomillot · 2025-12-17T11:52:21Z

src/components/results/pccmin/pcc-min-result-tab.tsx

+    useEffect(() => {
+        // Clear the globalfilter when tab changes
+        handleGlobalFilterChange([]);
+    }, [handleGlobalFilterChange]);
+
    return (


revert this change because you just moved the use effect so we can keep the git history

flomillot · 2025-12-17T11:55:08Z

src/components/results/pccmin/pcc-min-result-table.tsx


+    const { persistFilters } = useComputationColumnsFilters(FilterType.PccMin, PCCMIN_RESULT);
+
+    const onFilter = useCallback(


flomillot · 2025-12-17T12:04:36Z

src/components/results/sensitivity-analysis/paged-sensitivity-analysis-result.tsx

    );

-    const onFilter = useCallback(() => {
+    const memoizedSetPageCallback = useCallback(() => {


I know it's not originally from you but I don't understand the name of this callback

why it's not goFirstPage or something like this ?

flomillot · 2025-12-17T12:57:30Z

src/components/results/computing-result-filters.type.ts

+    dataType: c.filterDataType,
+    tolerance: c.filterTolerance ?? undefined,
+});
+export function setComputationResultFiltersState(filtersInfos: ComputationResultFiltersInfos): ComputationFiltersState {


Suggested change

export function setComputationResultFiltersState(filtersInfos: ComputationResultFiltersInfos): ComputationFiltersState {

export function getComputationResultFiltersState(filtersInfos: ComputationResultFiltersInfos): ComputationFiltersState {

or create / init but not set

flomillot · 2025-12-17T13:04:52Z

src/components/app.jsx

                resetTableDefinitions(collection);
            });

+            const fetchComputationResultFiltersPromise = getComputationResultFilters(studyUuid).then(


Suggested change

const fetchComputationResultFiltersPromise = getComputationResultFilters(studyUuid).then(

const fetchComputationResultFilters = getComputationResultFilters(studyUuid).then(

no need to add promise when you already have fetch in the name function

flomillot · 2025-12-17T14:22:10Z

src/hooks/use-computation-columns-filters.ts

+import { updateFilters } from '../components/custom-aggrid/custom-aggrid-filters/utils/aggrid-filters-utils';
+import { GridApi } from 'ag-grid-community';
+
+export function useComputationColumnsFilters(filterType: FilterType, filterTab: string) {


Suggested change

export function useComputationColumnsFilters(filterType: FilterType, filterTab: string) {

export function useUpdateComputationColumnsFilters(filterType: FilterType, filterTab: string) {

as the only thing you return is persistFilters which update filters

flomillot · 2025-12-17T14:23:58Z

src/hooks/use-computation-columns-filters.ts

+        (state: any) => state.computationFilters?.[filterType]?.columnsFilters?.[filterTab]?.id
+    );
+
+    const persistFilters = useCallback(


Suggested change

const persistFilters = useCallback(

const updateColumnFilters = useCallback(

flomillot · 2025-12-17T14:30:23Z

src/hooks/use-computation-columns-filters.ts

+import { updateFilters } from '../components/custom-aggrid/custom-aggrid-filters/utils/aggrid-filters-utils';
+import { GridApi } from 'ag-grid-community';
+
+export function useComputationColumnsFilters(filterType: FilterType, filterTab: string) {


Maybe not here If we are short in time, so maybe in the next pull request :

rename the hook into useColumnsFilters

include const { filters } = useFilterSelector and return filters like for global filters

remove const { filters } = useFilterSelector from other components

flomillot · 2025-12-17T14:36:10Z

src/hooks/use-filter-selector.ts

-        // @ts-expect-error TODO: found a better way to go into state
-        (state: AppState) => state[FILTER_PARAMS[filterType].filterType][filterTab]
-    );
+    const entry = FILTER_PARAMS[filterType];


Is it possible to rename the variable and add a comment to explain the code ? personally I don't understand this part

flomillot · 2025-12-17T14:43:36Z

src/redux/reducer.ts

+                };
+            });
+    });
+    builder.addCase(UPDATE_COLUMN_FILTERS, (state, action: UpdateColumnFiltersAction) => {


Much better indeed 👍 nice

flomillot · 2025-12-17T17:05:54Z

src/components/results/common/global-filter/use-global-filters.ts

-                        subtypeSubstationProperties.push(filter.label);
-                    } else {
-                        substationProperties.set(filter.filterSubtype, [filter.label]);
+        value.forEach((filter) => {


flomillot · 2025-12-17T17:20:36Z

src/components/results/loadflow/load-flow-result-utils.ts

    FilterType as AgGridFilterType,
-    textFilterParams,
    numericFilterParams,
+    textFilterParams,


revert for history

flomillot · 2025-12-17T17:27:56Z

src/components/results/loadflow/load-flow-result-utils.ts

        tab: mappingTabs(tabIndex),
+        updateFilterCallback: onFilter,
+    };
+    const createUpdateFilterCallback = (colId: string) => (api?: GridApi, filters?: FilterConfig[]) => {


Duplicated as say sonar.

flomillot · 2025-12-17T17:50:00Z

src/hooks/use-computation-columns-filters.ts

+                filterValue: filter?.value,
+                filterTolerance: filter?.tolerance,
+            };
+            updateFilters(api, filters);


I don't understand why it's here and not directly inside useCustomAggridFilter ?

flomillot · 2025-12-17T17:54:12Z

src/hooks/use-computation-columns-filters.ts

+import { updateFilters } from '../components/custom-aggrid/custom-aggrid-filters/utils/aggrid-filters-utils';
+import { GridApi } from 'ag-grid-community';
+
+export function useComputationColumnsFilters(filterType: FilterType, filterTab: string) {


Actually, did you really need this hook?
You could not put this code inside useCustomAggridFilter?

ghazwarhili added 7 commits November 21, 2025 09:01

create use computation result filters

6cf7557

resolve conflicts

ea2e14c

clean code

5032816

resolve conflicts

37e0a69

resolve conflicts

c727c8d

clean code

96a875e

fix

fb86664

ghazwarhili changed the title ~~create use computation result filters~~ persist computation result filters Dec 2, 2025

ghazwarhili added 8 commits December 2, 2025 13:44

resolve conflicts

4fc32da

clean code

4f33550

clean code part2

5522171

fix duplicated code

efa5ee7

Merge branch 'main' into implement-computation-result-filters-persist…

ddf6744

…-state

add handleGlobalFilterChangeAndUpdate

15cfa2f

Merge remote-tracking branch 'origin/implement-computation-result-fil…

851dc5c

…ters-persist-state' into implement-computation-result-filters-persist-state

Merge branch 'main' into implement-computation-result-filters-persist…

4aafd1d

…-state

flomillot reviewed Dec 17, 2025

View reviewed changes


		const { persistFilters } = useComputationColumnsFilters(AgGridFilterType.Loadflow, mappingTabs(tabIndex));

		const onFilter = useCallback(

	const onFilter = useCallback(
	const onFilterChange = useCallback(

	(colId: string, api: GridApi, filters: FilterConfig[]) => {
	(colId: string, agGridApi: GridApi, filters: FilterConfig[]) => {

	export function setComputationResultFiltersState(filtersInfos: ComputationResultFiltersInfos): ComputationFiltersState {
	export function getComputationResultFiltersState(filtersInfos: ComputationResultFiltersInfos): ComputationFiltersState {

	const fetchComputationResultFiltersPromise = getComputationResultFilters(studyUuid).then(
	const fetchComputationResultFilters = getComputationResultFilters(studyUuid).then(

	export function useComputationColumnsFilters(filterType: FilterType, filterTab: string) {
	export function useUpdateComputationColumnsFilters(filterType: FilterType, filterTab: string) {

	const persistFilters = useCallback(
	const updateColumnFilters = useCallback(

persist computation result filters #3484

Are you sure you want to change the base?

persist computation result filters #3484

Uh oh!

Conversation

ghazwarhili commented Nov 21, 2025

PR Summary

Uh oh!

sonarqubecloud bot commented Dec 10, 2025

Quality Gate failed

Uh oh!

flomillot left a comment

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants