From af8c530fbc913858de3464a7113c594e870917c7 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Andr=C3=A9?= <583546+oandregal@users.noreply.github.com> Date: Fri, 29 Dec 2023 13:50:10 +0100 Subject: [PATCH] DataViews: prevent unnecessary re-renders (#57452) --- packages/dataviews/src/filters.js | 11 +++++++++-- packages/dataviews/src/search.js | 8 +++++--- packages/dataviews/src/view-actions.js | 7 +++++-- 3 files changed, 19 insertions(+), 7 deletions(-) diff --git a/packages/dataviews/src/filters.js b/packages/dataviews/src/filters.js index 0ba9d1d50a969..bcc9df9ae327a 100644 --- a/packages/dataviews/src/filters.js +++ b/packages/dataviews/src/filters.js @@ -1,3 +1,8 @@ +/** + * WordPress dependencies + */ +import { memo } from '@wordpress/element'; + /** * Internal dependencies */ @@ -21,7 +26,7 @@ const sanitizeOperators = ( field ) => { ); }; -export default function Filters( { fields, view, onChangeView } ) { +const Filters = memo( function Filters( { fields, view, onChangeView } ) { const filters = []; fields.forEach( ( field ) => { if ( ! field.type ) { @@ -88,4 +93,6 @@ export default function Filters( { fields, view, onChangeView } ) { } return filterComponents; -} +} ); + +export default Filters; diff --git a/packages/dataviews/src/search.js b/packages/dataviews/src/search.js index 10a578b49aab2..03bcf0511892b 100644 --- a/packages/dataviews/src/search.js +++ b/packages/dataviews/src/search.js @@ -2,11 +2,11 @@ * WordPress dependencies */ import { __ } from '@wordpress/i18n'; -import { useEffect, useRef } from '@wordpress/element'; +import { useEffect, useRef, memo } from '@wordpress/element'; import { SearchControl } from '@wordpress/components'; import { useDebouncedInput } from '@wordpress/compose'; -export default function Search( { label, view, onChangeView } ) { +const Search = memo( function Search( { label, view, onChangeView } ) { const [ search, setSearch, debouncedSearch ] = useDebouncedInput( view.search ); @@ -35,4 +35,6 @@ export default function Search( { label, view, onChangeView } ) { size="compact" /> ); -} +} ); + +export default Search; diff --git a/packages/dataviews/src/view-actions.js b/packages/dataviews/src/view-actions.js index 9130f72694b28..0e1aeab6d7052 100644 --- a/packages/dataviews/src/view-actions.js +++ b/packages/dataviews/src/view-actions.js @@ -6,6 +6,7 @@ import { privateApis as componentsPrivateApis, } from '@wordpress/components'; import { __ } from '@wordpress/i18n'; +import { memo } from '@wordpress/element'; /** * Internal dependencies @@ -239,7 +240,7 @@ function SortMenu( { fields, view, onChangeView } ) { ); } -export default function ViewActions( { +const ViewActions = memo( function ViewActions( { fields, view, onChangeView, @@ -282,4 +283,6 @@ export default function ViewActions( { ); -} +} ); + +export default ViewActions;