diff --git a/packages/block-editor/src/components/page-template-picker/preview.native.js b/packages/block-editor/src/components/page-template-picker/preview.native.js index 7ebfbed3f07b8d..68a6fe983f5beb 100644 --- a/packages/block-editor/src/components/page-template-picker/preview.native.js +++ b/packages/block-editor/src/components/page-template-picker/preview.native.js @@ -5,12 +5,14 @@ import { BlockEditorProvider, BlockList } from '@wordpress/block-editor'; import { ModalHeaderBar } from '@wordpress/components'; import { usePreferredColorSchemeStyle } from '@wordpress/compose'; import { useSelect } from '@wordpress/data'; +import { useEffect, useRef } from '@wordpress/element'; import { __ } from '@wordpress/i18n'; /** * External dependencies */ -import { Modal, View, SafeAreaView } from 'react-native'; +import { Modal, Platform, View, SafeAreaView } from 'react-native'; +import { subscribeAndroidModalClosed } from 'react-native-gutenberg-bridge'; /** * Internal dependencies @@ -54,6 +56,26 @@ const Preview = ( props ) => { styles.previewContent, styles.previewContentDark ); + const androidModalClosedSubscription = useRef(); + + useEffect( () => { + if ( Platform.OS === 'android' ) { + androidModalClosedSubscription.current = subscribeAndroidModalClosed( + () => { + onDismiss(); + } + ); + } + + return () => { + if ( + androidModalClosedSubscription && + androidModalClosedSubscription.current + ) { + androidModalClosedSubscription.current.remove(); + } + }; + }, [] ); if ( template === undefined ) { return null; diff --git a/packages/block-library/src/button/edit.native.js b/packages/block-library/src/button/edit.native.js index 63d46ea249ade7..c0bd9b51fa3be3 100644 --- a/packages/block-library/src/button/edit.native.js +++ b/packages/block-library/src/button/edit.native.js @@ -54,7 +54,8 @@ class ButtonEdit extends Component { this.onLayout = this.onLayout.bind( this ); this.dismissSheet = this.dismissSheet.bind( this ); this.getURLFromClipboard = this.getURLFromClipboard.bind( this ); - this.onToggleLinkSettings = this.onToggleLinkSettings.bind( this ); + this.onShowLinkSettings = this.onShowLinkSettings.bind( this ); + this.onHideLinkSettings = this.onHideLinkSettings.bind( this ); this.onToggleButtonFocus = this.onToggleButtonFocus.bind( this ); this.setRef = this.setRef.bind( this ); @@ -201,9 +202,12 @@ class ButtonEdit extends Component { } ); } - onToggleLinkSettings() { - const { isLinkSheetVisible } = this.state; - this.setState( { isLinkSheetVisible: ! isLinkSheetVisible } ); + onShowLinkSettings() { + this.setState( { isLinkSheetVisible: true } ); + } + + onHideLinkSettings() { + this.setState( { isLinkSheetVisible: false } ); } onToggleButtonFocus( value ) { @@ -388,9 +392,9 @@ class ButtonEdit extends Component { @@ -399,7 +403,7 @@ class ButtonEdit extends Component { { this.getLinkSettings( url, rel, linkTarget ) }