villebro commented on a change in pull request #16994:
URL: https://github.com/apache/superset/pull/16994#discussion_r723976115
##########
File path:
superset-frontend/src/dashboard/components/nativeFilters/FilterBar/FilterControls/FilterControls.tsx
##########
@@ -63,7 +63,8 @@ const FilterControls: FC<FilterControlsProps> = ({
dataMask: dataMaskSelected[filter.id],
}));
return buildCascadeFiltersTree(filtersWithValue);
- }, [filterValues, dataMaskSelected]);
+ // eslint-disable-next-line react-hooks/exhaustive-deps
+ }, [JSON.stringify(filterValues), dataMaskSelected]);
Review comment:
> Can we wrap `filterValues` in line 51 in useMemo instead? Like
>
> ```
> const filterValues = useMemo(() => Object.values<Filter>(filters),
[filters]);
> ```
That's a good idea - however, won't we need to use stringify `filter` in the
deps array? Seems like the object reference may change without the contents
actually changing.
##########
File path:
superset-frontend/src/dashboard/components/nativeFilters/FilterBar/FilterControls/FilterValue.tsx
##########
@@ -105,10 +105,17 @@ const FilterValue: React.FC<FilterProps> = ({
time_range,
});
const filterOwnState = filter.dataMask?.ownState || {};
+ // TODO: We should try to improve our useEffect hooks to depend more on
+ // granular information instead of big objects that require deep
comparison.
+ const customizer = (
+ objValue: Partial<QueryFormData>,
+ othValue: Partial<QueryFormData>,
+ key: string,
+ ) => (key === 'url_params' ? true : undefined);
if (
!isRefreshing &&
- (!areObjectsEqual(formData, newFormData) ||
- !areObjectsEqual(ownState, filterOwnState) ||
+ (!isEqualWith(formData, newFormData, customizer) ||
Review comment:
> Maybe we could enhance `areObjectsEqual` to accept customizer function?
Agreed, let's do that by adding `customizer` to `opts` in `areObjectsEqual`.
##########
File path:
superset-frontend/src/dashboard/components/nativeFilters/FilterBar/FilterControls/FilterControls.tsx
##########
@@ -63,7 +63,8 @@ const FilterControls: FC<FilterControlsProps> = ({
dataMask: dataMaskSelected[filter.id],
}));
return buildCascadeFiltersTree(filtersWithValue);
- }, [filterValues, dataMaskSelected]);
+ // eslint-disable-next-line react-hooks/exhaustive-deps
+ }, [JSON.stringify(filterValues), dataMaskSelected]);
Review comment:
> Ah, now I see that `useFilters` hooks returns `Object.entries` which
creates a new object on each run... Yeah, that means that it probably needs
`JSON.stringify`, but in general I'm not sure if the pattern used in
`useFilters` is good
I agree, it's definitely an antipattern. However, until we have a guideline
for avoiding them I'd suggest going with `JSON.stringify` for now, leaving a
`// TODO:` here and then cleaning these stringifys up in follow-up refactor PRs
once we've settled on a good pattern for being able to use strict equality in
the deps arrays.
##########
File path:
superset-frontend/src/dashboard/components/nativeFilters/FilterBar/FilterControls/FilterValue.tsx
##########
@@ -105,10 +105,17 @@ const FilterValue: React.FC<FilterProps> = ({
time_range,
});
const filterOwnState = filter.dataMask?.ownState || {};
+ // TODO: We should try to improve our useEffect hooks to depend more on
+ // granular information instead of big objects that require deep
comparison.
+ const customizer = (
+ objValue: Partial<QueryFormData>,
+ othValue: Partial<QueryFormData>,
+ key: string,
+ ) => (key === 'url_params' ? true : undefined);
if (
!isRefreshing &&
- (!areObjectsEqual(formData, newFormData) ||
- !areObjectsEqual(ownState, filterOwnState) ||
+ (!isEqualWith(formData, newFormData, customizer) ||
Review comment:
The point of `areObjectsEqual` IMO is to serve as a minimum-effort
wrapper around `isEqual` that can be centrally updated if the lodash API were
to change (I believe I may have implemented that `ignoreUndefined` some time
ago based on some docs I found). I'm all for making this more efficient - if
this can be implemented in a simpler fashion let's do it 👍
--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
To unsubscribe, e-mail: [email protected]
For queries about this service, please contact Infrastructure at:
[email protected]
---------------------------------------------------------------------
To unsubscribe, e-mail: [email protected]
For additional commands, e-mail: [email protected]
