Unsupported block editor is on all mobile builds (#23592)

* Add unsupported block edit feature release note Co-authored-by: eToledo <[email protected]> Co-authored-by: Marko Savic <[email protected]>
WordPress · Jul 1, 2020 · d41c9d4 · d41c9d4
1 parent 20bb502
commit d41c9d4
Show file tree

Hide file tree

Showing 4 changed files with 52 additions and 35 deletions.
diff --git a/packages/block-library/src/missing/edit.native.js b/packages/block-library/src/missing/edit.native.js
@@ -7,8 +7,13 @@ import { Platform, View, Text, TouchableWithoutFeedback } from 'react-native';
  * WordPress dependencies
  */
 import { requestUnsupportedBlockFallback } from '@wordpress/react-native-bridge';
-import { BottomSheet, Icon } from '@wordpress/components';
-import { withPreferredColorScheme } from '@wordpress/compose';
+import {
+	BottomSheet,
+	Icon,
+	withSiteCapabilities,
+	isUnsupportedBlockEditorSupported,
+} from '@wordpress/components';
+import { compose, withPreferredColorScheme } from '@wordpress/compose';
 import { coreBlocks } from '@wordpress/block-library';
 import { normalizeIconObject } from '@wordpress/blocks';
 import { Component } from '@wordpress/element';
@@ -71,7 +76,12 @@ export class UnsupportedBlockEdit extends Component {
 	}
 
 	renderSheet( blockTitle, blockName ) {
-		const { getStylesFromColorScheme, attributes, clientId } = this.props;
+		const {
+			getStylesFromColorScheme,
+			attributes,
+			clientId,
+			capabilities,
+		} = this.props;
 		const infoTextStyle = getStylesFromColorScheme(
 			styles.infoText,
 			styles.infoTextDark
@@ -133,37 +143,31 @@ export class UnsupportedBlockEdit extends Component {
 						{ infoTitle }
 					</Text>
 					<Text style={ [ infoTextStyle, infoDescriptionStyle ] }>
-						{
-							// eslint-disable-next-line no-undef
-							__DEV__
-								? __(
-										"We are working hard to add more blocks with each release. In the meantime, you can also edit this block using your device's web browser."
-								  )
-								: __(
-										'We are working hard to add more blocks with each release. In the meantime, you can also edit this post on the web.'
-								  )
-						}
+						{ isUnsupportedBlockEditorSupported( capabilities )
+							? __(
+									"We are working hard to add more blocks with each release. In the meantime, you can also edit this block using your device's web browser."
+							  )
+							: __(
+									'We are working hard to add more blocks with each release. In the meantime, you can also edit this post on the web.'
+							  ) }
 					</Text>
 				</View>
-				{
-					// eslint-disable-next-line no-undef
-					__DEV__ && (
-						<>
-							<BottomSheet.Cell
-								label={ __( 'Edit block in web browser' ) }
-								separatorType="topFullWidth"
-								onPress={ this.requestFallback }
-								labelStyle={ actionButtonStyle }
-							/>
-							<BottomSheet.Cell
-								label={ __( 'Dismiss' ) }
-								separatorType="topFullWidth"
-								onPress={ this.toggleSheet }
-								labelStyle={ actionButtonStyle }
-							/>
-						</>
-					)
-				}
+				{ isUnsupportedBlockEditorSupported( capabilities ) && (
+					<>
+						<BottomSheet.Cell
+							label={ __( 'Edit block in web browser' ) }
+							separatorType="topFullWidth"
+							onPress={ this.requestFallback }
+							labelStyle={ actionButtonStyle }
+						/>
+						<BottomSheet.Cell
+							label={ __( 'Dismiss' ) }
+							separatorType="topFullWidth"
+							onPress={ this.toggleSheet }
+							labelStyle={ actionButtonStyle }
+						/>
+					</>
+				) }
 			</BottomSheet>
 		);
 	}
@@ -216,4 +220,6 @@ export class UnsupportedBlockEdit extends Component {
 	}
 }
 
-export default withPreferredColorScheme( UnsupportedBlockEdit );
+export default compose( [ withPreferredColorScheme, withSiteCapabilities ] )(
+	UnsupportedBlockEdit
+);
diff --git a/packages/components/src/mobile/site-capabilities/index.js b/packages/components/src/mobile/site-capabilities/index.js
@@ -7,6 +7,10 @@ export function isMentionsSupported( capabilities ) {
 	return capabilities.mentions === true;
 }
 
+export function isUnsupportedBlockEditorSupported( capabilities ) {
+	return capabilities.unsupportedBlockEditor === true;
+}
+
 export const SiteCapabilitiesContext = createContext( {} );
 
 export const useSiteCapabilities = () => {

diff --git a/...ve-bridge/android/src/main/java/org/wordpress/mobile/WPAndroidGlue/WPAndroidGlueCode.java b/...ve-bridge/android/src/main/java/org/wordpress/mobile/WPAndroidGlue/WPAndroidGlueCode.java
@@ -111,6 +111,7 @@ public class WPAndroidGlueCode {
     private static final String PROP_NAME_TRANSLATIONS = "translations";
     public static final String PROP_NAME_CAPABILITIES = "capabilities";
     public static final String PROP_NAME_CAPABILITIES_MENTIONS = "mentions";
+    public static final String PROP_NAME_CAPABILITIES_UNSUPPORTED_BLOCK_EDITOR = "unsupportedBlockEditor";
     private static final String PROP_NAME_COLORS = "colors";
     private static final String PROP_NAME_GRADIENTS = "gradients";
 
@@ -380,7 +381,7 @@ public void gutenbergDidRequestUnsupportedBlockFallback(ReplaceUnsupportedBlockC
                         gutenbergDidRequestUnsupportedBlockFallback(new UnsupportedBlock(blockId, blockName, blockTitle, content));
             }
 
-            @Override 
+            @Override
             public void onAddMention(Consumer<String> onSuccess) {
                 mAddMentionUtil.getMention(onSuccess);
             }
@@ -431,7 +432,8 @@ public void onCreateView(Context initContext,
                              Consumer<Exception> exceptionLogger,
                              Consumer<String> breadcrumbLogger,
                              @Nullable Boolean isSiteUsingWpComRestApi,
-                             @Nullable Bundle editorTheme) {
+                             @Nullable Bundle editorTheme,
+                             boolean siteJetpackIsConnected) {
         mIsDarkMode = isDarkMode;
         mExceptionLogger = exceptionLogger;
         mBreadcrumbLogger = breadcrumbLogger;
@@ -467,6 +469,7 @@ public void onCreateView(Context initContext,
         Bundle capabilities = new Bundle();
         if (isSiteUsingWpComRestApi != null) {
             capabilities.putBoolean(PROP_NAME_CAPABILITIES_MENTIONS, isSiteUsingWpComRestApi);
+            capabilities.putBoolean(PROP_NAME_CAPABILITIES_UNSUPPORTED_BLOCK_EDITOR, !siteJetpackIsConnected);
         }
         initialProps.putBundle(PROP_NAME_CAPABILITIES, capabilities);
 

diff --git a/packages/react-native-editor/RELEASE-NOTES.txt b/packages/react-native-editor/RELEASE-NOTES.txt
@@ -1,3 +1,7 @@
+1.32.0
+------
+* [***] The block editor now gives users the ability to individually edit unsupported blocks found in posts or pages. 
+
 1.31.0
 ------
 * [**] Add support for customizing gradient type and angle in Buttons and Cover blocks.