From a81726c4b2d10be55e35642e17ae8bfa562a3c9f Mon Sep 17 00:00:00 2001
From: Carlos Garcia <fluiddot@gmail.com>
Date: Tue, 20 Jul 2021 16:48:40 +0200
Subject: [PATCH 1/4] Add locale to block editor settings

---
 packages/editor/src/components/provider/index.native.js | 2 ++
 packages/react-native-editor/src/index.js               | 2 ++
 2 files changed, 4 insertions(+)

diff --git a/packages/editor/src/components/provider/index.native.js b/packages/editor/src/components/provider/index.native.js
index 6cdf848cfe69fb..059b98eb459374 100644
--- a/packages/editor/src/components/provider/index.native.js
+++ b/packages/editor/src/components/provider/index.native.js
@@ -92,6 +92,7 @@ class NativeEditorProvider extends Component {
 	componentDidMount() {
 		const {
 			capabilities,
+			locale,
 			updateSettings,
 			galleryWithImageBlocks,
 		} = this.props;
@@ -100,6 +101,7 @@ class NativeEditorProvider extends Component {
 			...capabilities,
 			...{ __unstableGalleryWithImageBlocks: galleryWithImageBlocks },
 			...this.getThemeColors( this.props ),
+			locale,
 		} );
 
 		this.subscriptionParentGetHtml = subscribeParentGetHtml( () => {
diff --git a/packages/react-native-editor/src/index.js b/packages/react-native-editor/src/index.js
index 3fd18a16746487..a0fbf482154752 100644
--- a/packages/react-native-editor/src/index.js
+++ b/packages/react-native-editor/src/index.js
@@ -84,6 +84,7 @@ const setupInitHooks = () => {
 				rawStyles,
 				rawFeatures,
 				galleryWithImageBlocks,
+				locale,
 			} = props;
 
 			if ( initialData === undefined && __DEV__ ) {
@@ -112,6 +113,7 @@ const setupInitHooks = () => {
 				rawStyles,
 				rawFeatures,
 				galleryWithImageBlocks,
+				locale,
 			};
 		}
 	);

From c04539cba61cbe72e37b37380014f53ab2b5df25 Mon Sep 17 00:00:00 2001
From: Carlos Garcia <fluiddot@gmail.com>
Date: Tue, 20 Jul 2021 16:50:48 +0200
Subject: [PATCH 2/4] Add localized embed content

---
 packages/block-library/src/embed/embed-preview.native.js | 9 +++++++--
 packages/components/src/sandbox/index.native.js          | 4 +---
 2 files changed, 8 insertions(+), 5 deletions(-)

diff --git a/packages/block-library/src/embed/embed-preview.native.js b/packages/block-library/src/embed/embed-preview.native.js
index 0beafe458ccca8..a0a677cfcbe2d6 100644
--- a/packages/block-library/src/embed/embed-preview.native.js
+++ b/packages/block-library/src/embed/embed-preview.native.js
@@ -9,11 +9,14 @@ import classnames from 'classnames/dedupe';
  * WordPress dependencies
  */
 import { View } from '@wordpress/primitives';
-
-import { BlockCaption } from '@wordpress/block-editor';
+import {
+	BlockCaption,
+	store as blockEditorStore,
+} from '@wordpress/block-editor';
 import { __, sprintf } from '@wordpress/i18n';
 import { memo, useState } from '@wordpress/element';
 import { SandBox } from '@wordpress/components';
+import { useSelect } from '@wordpress/data';
 
 /**
  * Internal dependencies
@@ -38,6 +41,7 @@ const EmbedPreview = ( {
 	url,
 } ) => {
 	const [ isCaptionSelected, setIsCaptionSelected ] = useState( false );
+	const { locale } = useSelect( blockEditorStore ).getSettings();
 
 	const wrapperStyle = styles[ 'embed-preview__wrapper' ];
 	const wrapperAlignStyle =
@@ -105,6 +109,7 @@ const EmbedPreview = ( {
 				>
 					<PreviewContent
 						html={ html }
+						lang={ locale }
 						title={ iframeTitle }
 						type={ sandboxClassnames }
 						providerUrl={ providerUrl }
diff --git a/packages/components/src/sandbox/index.native.js b/packages/components/src/sandbox/index.native.js
index cde05eeca8fcb6..81eaf47f4d58d2 100644
--- a/packages/components/src/sandbox/index.native.js
+++ b/packages/components/src/sandbox/index.native.js
@@ -154,6 +154,7 @@ const EMPTY_ARRAY = [];
 function Sandbox( {
 	containerStyle,
 	html = '',
+	lang = 'en',
 	customJS,
 	providerUrl = '',
 	scripts = EMPTY_ARRAY,
@@ -179,9 +180,6 @@ function Sandbox( {
 	} );
 
 	function getHtmlDoc() {
-		// TODO: Use the device's locale
-		const lang = 'en';
-
 		// Put the html snippet into a html document, and update the state to refresh the WebView,
 		// we can use this in the future to inject custom styles or scripts.
 		// Scripts go into the body rather than the head, to support embedded content such as Instagram

From 28fc00cae41bdbdd5d2f3a944b4ba3402c898e03 Mon Sep 17 00:00:00 2001
From: Carlos Garcia <fluiddot@gmail.com>
Date: Tue, 3 Aug 2021 18:10:46 +0200
Subject: [PATCH 3/4] Sort sandbox props

---
 packages/components/src/sandbox/index.native.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/components/src/sandbox/index.native.js b/packages/components/src/sandbox/index.native.js
index 81eaf47f4d58d2..3c5b0dacf2b656 100644
--- a/packages/components/src/sandbox/index.native.js
+++ b/packages/components/src/sandbox/index.native.js
@@ -153,9 +153,9 @@ const EMPTY_ARRAY = [];
 
 function Sandbox( {
 	containerStyle,
+	customJS,
 	html = '',
 	lang = 'en',
-	customJS,
 	providerUrl = '',
 	scripts = EMPTY_ARRAY,
 	styles = EMPTY_ARRAY,

From b0fee88157377432666d7da74b834180507043cc Mon Sep 17 00:00:00 2001
From: Carlos Garcia <fluiddot@gmail.com>
Date: Fri, 3 Sep 2021 19:10:54 +0200
Subject: [PATCH 4/4] Update react-native-editor changelog

---
 packages/react-native-editor/CHANGELOG.md | 1 +
 1 file changed, 1 insertion(+)

diff --git a/packages/react-native-editor/CHANGELOG.md b/packages/react-native-editor/CHANGELOG.md
index 80ff9080ab94af..65a37d6527ab73 100644
--- a/packages/react-native-editor/CHANGELOG.md
+++ b/packages/react-native-editor/CHANGELOG.md
@@ -10,6 +10,7 @@ For each user feature we should also add a importance categorization label  to i
 -->
 
 ## Unreleased
+-   [*] Embed block: Add device's locale to preview content [https://github.com/WordPress/gutenberg/pull/33858]
 
 ## 1.61.0
 -   [**] Enable embed preview for a list of providers (for now only YouTube and Twitter) [#34446]