BlockVariationPicker: remove unused withSelect (#53100)

* BlockVariationPicker: remove unused withSelect * BlockVariationPicker: remove unneeded useMemo
WordPress · Jul 28, 2023 · 429f834 · 429f834
1 parent eb59f89
commit 429f834
Showing 1 changed file with 52 additions and 72 deletions.
diff --git a/packages/block-editor/src/components/block-variation-picker/index.native.js b/packages/block-editor/src/components/block-variation-picker/index.native.js
@@ -12,12 +12,9 @@ import {
 /**
  * WordPress dependencies
  */
-import { withSelect, useDispatch } from '@wordpress/data';
-import { compose, usePreferredColorSchemeStyle } from '@wordpress/compose';
-import {
-	createBlocksFromInnerBlocksTemplate,
-	store as blocksStore,
-} from '@wordpress/blocks';
+import { useDispatch } from '@wordpress/data';
+import { usePreferredColorSchemeStyle } from '@wordpress/compose';
+import { createBlocksFromInnerBlocksTemplate } from '@wordpress/blocks';
 import { __ } from '@wordpress/i18n';
 import {
 	PanelBody,
@@ -26,7 +23,6 @@ import {
 	InserterButton,
 } from '@wordpress/components';
 import { Icon, close } from '@wordpress/icons';
-import { useMemo } from '@wordpress/element';
 
 /**
  * Internal dependencies
@@ -45,28 +41,25 @@ function BlockVariationPicker( { isVisible, onClose, clientId, variations } ) {
 		styles.cancelButtonDark
 	);
 
-	const leftButton = useMemo(
-		() => (
-			<TouchableWithoutFeedback onPress={ onClose } hitSlop={ hitSlop }>
-				<View>
-					{ isIOS ? (
-						<Text
-							style={ cancelButtonStyle }
-							maxFontSizeMultiplier={ 2 }
-						>
-							{ __( 'Cancel' ) }
-						</Text>
-					) : (
-						<Icon
-							icon={ close }
-							size={ 24 }
-							style={ styles.closeIcon }
-						/>
-					) }
-				</View>
-			</TouchableWithoutFeedback>
-		),
-		[ onClose, cancelButtonStyle ]
+	const leftButton = (
+		<TouchableWithoutFeedback onPress={ onClose } hitSlop={ hitSlop }>
+			<View>
+				{ isIOS ? (
+					<Text
+						style={ cancelButtonStyle }
+						maxFontSizeMultiplier={ 2 }
+					>
+						{ __( 'Cancel' ) }
+					</Text>
+				) : (
+					<Icon
+						icon={ close }
+						size={ 24 }
+						style={ styles.closeIcon }
+					/>
+				) }
+			</View>
+		</TouchableWithoutFeedback>
 	);
 
 	const onVariationSelect = ( variation ) => {
@@ -77,51 +70,38 @@ function BlockVariationPicker( { isVisible, onClose, clientId, variations } ) {
 		onClose();
 	};
 
-	return useMemo(
-		() => (
-			<BottomSheet
-				isVisible={ isVisible }
-				onClose={ onClose }
-				title={ __( 'Select a layout' ) }
-				contentStyle={ styles.contentStyle }
-				leftButton={ leftButton }
-				testID="block-variation-modal"
+	return (
+		<BottomSheet
+			isVisible={ isVisible }
+			onClose={ onClose }
+			title={ __( 'Select a layout' ) }
+			contentStyle={ styles.contentStyle }
+			leftButton={ leftButton }
+			testID="block-variation-modal"
+		>
+			<ScrollView
+				horizontal
+				showsHorizontalScrollIndicator={ false }
+				contentContainerStyle={ styles.contentContainerStyle }
+				style={ styles.containerStyle }
 			>
-				<ScrollView
-					horizontal
-					showsHorizontalScrollIndicator={ false }
-					contentContainerStyle={ styles.contentContainerStyle }
-					style={ styles.containerStyle }
-				>
-					{ variations.map( ( v ) => {
-						return (
-							<InserterButton
-								item={ v }
-								key={ v.name }
-								onSelect={ () => onVariationSelect( v ) }
-							/>
-						);
-					} ) }
-				</ScrollView>
-				<PanelBody>
-					<FooterMessageControl
-						label={ __(
-							'Note: Column layout may vary between themes and screen sizes'
-						) }
+				{ variations.map( ( v ) => (
+					<InserterButton
+						item={ v }
+						key={ v.name }
+						onSelect={ () => onVariationSelect( v ) }
 					/>
-				</PanelBody>
-			</BottomSheet>
-		),
-		[ variations, isVisible, onClose ]
+				) ) }
+			</ScrollView>
+			<PanelBody>
+				<FooterMessageControl
+					label={ __(
+						'Note: Column layout may vary between themes and screen sizes'
+					) }
+				/>
+			</PanelBody>
+		</BottomSheet>
 	);
 }
 
-export default compose(
-	withSelect( ( select, {} ) => {
-		const { getBlockVariations } = select( blocksStore );
-
-		return {
-			date: getBlockVariations( 'core/columns', 'block' ),
-		};
-	} )
-)( BlockVariationPicker );
+export default BlockVariationPicker;