From 98474fa016f14f8bac720c65c7130128293bd72d Mon Sep 17 00:00:00 2001
From: retrofox <rdsuarez@gmail.com>
Date: Mon, 8 Jun 2020 15:01:35 -0300
Subject: [PATCH 01/32] cover: start customize media placeholder

---
 extensions/editor.js                          |  1 +
 .../blocks/cover/cover-media-placeholder.js   | 27 +++++++++++++++++++
 extensions/shared/blocks/cover/index.js       | 20 ++++++++++++++
 3 files changed, 48 insertions(+)
 create mode 100644 extensions/shared/blocks/cover/cover-media-placeholder.js
 create mode 100644 extensions/shared/blocks/cover/index.js

diff --git a/extensions/editor.js b/extensions/editor.js
index fb53f82d101e3..81a0d0cda9e68 100644
--- a/extensions/editor.js
+++ b/extensions/editor.js
@@ -6,6 +6,7 @@ import './shared/block-category';
 import './shared/plan-upgrade-notification';
 import './shared/stripe-connection-notification';
 import './shared/external-media';
+import './shared/blocks/cover';
 import analytics from '../_inc/client/lib/analytics';
 
 // @TODO Please make a shared analytics solution and remove this!
diff --git a/extensions/shared/blocks/cover/cover-media-placeholder.js b/extensions/shared/blocks/cover/cover-media-placeholder.js
new file mode 100644
index 0000000000000..22b45c8c4e272
--- /dev/null
+++ b/extensions/shared/blocks/cover/cover-media-placeholder.js
@@ -0,0 +1,27 @@
+
+/**
+ * External dependencies
+ */
+
+/**
+ * WordPress dependencies
+ */
+import { createHigherOrderComponent } from '@wordpress/compose';
+import { Fragment } from '@wordpress/element';
+import { useBlockEditContext } from '@wordpress/block-editor';
+
+export default createHigherOrderComponent(
+	CoreMediaPlaceholder => props => {
+		const { name } = useBlockEditContext();
+		if ( name !== 'core/cover' ) {
+			return <CoreMediaPlaceholder { ...props } />;
+		}
+
+		return (
+			<Fragment>
+				<CoreMediaPlaceholder { ...props } />
+			</Fragment>
+		);
+	},
+	'JetpackCoverMediaPlaceholder'
+);
diff --git a/extensions/shared/blocks/cover/index.js b/extensions/shared/blocks/cover/index.js
new file mode 100644
index 0000000000000..743acc694ed64
--- /dev/null
+++ b/extensions/shared/blocks/cover/index.js
@@ -0,0 +1,20 @@
+/**
+ * External dependencies
+ */
+
+/**
+ * WordPress dependencies
+ */
+import { addFilter } from '@wordpress/hooks';
+
+/**
+ * Internal dependencies
+ */
+import coverEditMediaPlaceholder from './cover-media-placeholder';
+
+// Take the control of MediaPlaceholder.
+addFilter(
+	'editor.MediaPlaceholder',
+	'jetpack/cover-edit-media-placeholder',
+	coverEditMediaPlaceholder
+);

From 8433eb8499d06c95147f9d8c309ddd31754774ce Mon Sep 17 00:00:00 2001
From: retrofox <rdsuarez@gmail.com>
Date: Mon, 8 Jun 2020 15:10:10 -0300
Subject: [PATCH 02/32] cover: allos only images by default

---
 .../shared/blocks/cover/cover-media-placeholder.js     | 10 +++++++++-
 1 file changed, 9 insertions(+), 1 deletion(-)

diff --git a/extensions/shared/blocks/cover/cover-media-placeholder.js b/extensions/shared/blocks/cover/cover-media-placeholder.js
index 22b45c8c4e272..747606e2254b8 100644
--- a/extensions/shared/blocks/cover/cover-media-placeholder.js
+++ b/extensions/shared/blocks/cover/cover-media-placeholder.js
@@ -10,6 +10,11 @@ import { createHigherOrderComponent } from '@wordpress/compose';
 import { Fragment } from '@wordpress/element';
 import { useBlockEditContext } from '@wordpress/block-editor';
 
+/**
+ * Module Constants
+ */
+const ALLOWED_MEDIA_TYPES = [ 'image' ];
+
 export default createHigherOrderComponent(
 	CoreMediaPlaceholder => props => {
 		const { name } = useBlockEditContext();
@@ -19,7 +24,10 @@ export default createHigherOrderComponent(
 
 		return (
 			<Fragment>
-				<CoreMediaPlaceholder { ...props } />
+				<CoreMediaPlaceholder
+					{ ...props }
+					allowedTypes={ ALLOWED_MEDIA_TYPES }
+				/>
 			</Fragment>
 		);
 	},

From f794b6c9e3c36861139732bccc0bc0e3db1c5d27 Mon Sep 17 00:00:00 2001
From: retrofox <rdsuarez@gmail.com>
Date: Mon, 8 Jun 2020 15:40:30 -0300
Subject: [PATCH 03/32] cover: show upgrade nudge

---
 .../blocks/cover/cover-media-placeholder.js   | 34 ++++++++++++++++++-
 1 file changed, 33 insertions(+), 1 deletion(-)

diff --git a/extensions/shared/blocks/cover/cover-media-placeholder.js b/extensions/shared/blocks/cover/cover-media-placeholder.js
index 747606e2254b8..229012eae111c 100644
--- a/extensions/shared/blocks/cover/cover-media-placeholder.js
+++ b/extensions/shared/blocks/cover/cover-media-placeholder.js
@@ -7,14 +7,38 @@
  * WordPress dependencies
  */
 import { createHigherOrderComponent } from '@wordpress/compose';
-import { Fragment } from '@wordpress/element';
+import { Fragment, useState } from '@wordpress/element';
 import { useBlockEditContext } from '@wordpress/block-editor';
+import { __ } from '@wordpress/i18n';
+
+/**
+ * Internal dependencies
+ */
+import UpgradeNudge from "../../components/upgrade-nudge";
 
 /**
  * Module Constants
  */
 const ALLOWED_MEDIA_TYPES = [ 'image' ];
 
+const JetpackCoverUpgradeNudge = ( { name, show } ) =>
+	show
+		? <UpgradeNudge
+			plan="value_bundle"
+			blockName={ name }
+			title={ {
+				knownPlan: __( 'To use a video in this block, upgrade to %(planName) plan.', 'jetpack' ),
+				unknownPlan: __( 'To use a video in this block, upgrade to a paid plan.', 'jetpack' ),
+			} }
+			subtitle={ __(
+				'Upload unlimited videos to your website and \
+				display them using a fast, unbranded, \
+				customizable player.',
+				'jetpack'
+			) }
+		/>
+		: null;
+
 export default createHigherOrderComponent(
 	CoreMediaPlaceholder => props => {
 		const { name } = useBlockEditContext();
@@ -22,10 +46,18 @@ export default createHigherOrderComponent(
 			return <CoreMediaPlaceholder { ...props } />;
 		}
 
+		const [ uploadingError, setUploadingError ] = useState( false );
+		const { onError } = props;
+
 		return (
 			<Fragment>
+				<JetpackCoverUpgradeNudge name={ name } show={ uploadingError } />
 				<CoreMediaPlaceholder
 					{ ...props }
+					onError = { ( message ) => {
+						setUploadingError( true );
+						return onError( message );
+					} }
 					allowedTypes={ ALLOWED_MEDIA_TYPES }
 				/>
 			</Fragment>

From c19538be355ed7dd9a9997dfaa9966525435b8e8 Mon Sep 17 00:00:00 2001
From: retrofox <rdsuarez@gmail.com>
Date: Tue, 9 Jun 2020 18:51:57 -0300
Subject: [PATCH 04/32] cover: extend media placeholder in filter

---
 .../blocks/cover/cover-media-placeholder.js   |  8 +-----
 extensions/shared/blocks/cover/index.js       | 25 +++++++++++++++----
 2 files changed, 21 insertions(+), 12 deletions(-)

diff --git a/extensions/shared/blocks/cover/cover-media-placeholder.js b/extensions/shared/blocks/cover/cover-media-placeholder.js
index 229012eae111c..6c126353ae339 100644
--- a/extensions/shared/blocks/cover/cover-media-placeholder.js
+++ b/extensions/shared/blocks/cover/cover-media-placeholder.js
@@ -8,7 +8,6 @@
  */
 import { createHigherOrderComponent } from '@wordpress/compose';
 import { Fragment, useState } from '@wordpress/element';
-import { useBlockEditContext } from '@wordpress/block-editor';
 import { __ } from '@wordpress/i18n';
 
 /**
@@ -39,13 +38,8 @@ const JetpackCoverUpgradeNudge = ( { name, show } ) =>
 		/>
 		: null;
 
-export default createHigherOrderComponent(
+export default ( name ) => createHigherOrderComponent(
 	CoreMediaPlaceholder => props => {
-		const { name } = useBlockEditContext();
-		if ( name !== 'core/cover' ) {
-			return <CoreMediaPlaceholder { ...props } />;
-		}
-
 		const [ uploadingError, setUploadingError ] = useState( false );
 		const { onError } = props;
 
diff --git a/extensions/shared/blocks/cover/index.js b/extensions/shared/blocks/cover/index.js
index 743acc694ed64..a7ee353a5f805 100644
--- a/extensions/shared/blocks/cover/index.js
+++ b/extensions/shared/blocks/cover/index.js
@@ -6,15 +6,30 @@
  * WordPress dependencies
  */
 import { addFilter } from '@wordpress/hooks';
+import { createHigherOrderComponent } from '@wordpress/compose';
 
 /**
  * Internal dependencies
  */
 import coverEditMediaPlaceholder from './cover-media-placeholder';
 
-// Take the control of MediaPlaceholder.
-addFilter(
-	'editor.MediaPlaceholder',
-	'jetpack/cover-edit-media-placeholder',
-	coverEditMediaPlaceholder
+const extendCoreCoverBlock = createHigherOrderComponent(
+	( BlockEdit ) => ( props ) => {
+		const { name } = props;
+		if ( ! name || name !== 'core/cover' ) {
+			return <BlockEdit { ...props } />;
+		}
+
+		// Take the control of MediaPlaceholder.
+		addFilter(
+			'editor.MediaPlaceholder',
+			'jetpack/cover-edit-media-placeholder',
+			coverEditMediaPlaceholder( name )
+		);
+
+		return <BlockEdit { ...props } />;
+	},
+	'JetpackCoverEdit'
 );
+
+addFilter( 'editor.BlockEdit', 'jetpack/cover', extendCoreCoverBlock );

From aa724bdcc6fff84aefc9ee01d98ba3d36e6f44b3 Mon Sep 17 00:00:00 2001
From: retrofox <rdsuarez@gmail.com>
Date: Mon, 8 Jun 2020 16:55:18 -0300
Subject: [PATCH 05/32] cover: show nudge only when error contains a file

---
 .../shared/blocks/cover/cover-media-placeholder.js    | 11 ++++++++---
 1 file changed, 8 insertions(+), 3 deletions(-)

diff --git a/extensions/shared/blocks/cover/cover-media-placeholder.js b/extensions/shared/blocks/cover/cover-media-placeholder.js
index 6c126353ae339..b33b79d6132b9 100644
--- a/extensions/shared/blocks/cover/cover-media-placeholder.js
+++ b/extensions/shared/blocks/cover/cover-media-placeholder.js
@@ -40,16 +40,21 @@ const JetpackCoverUpgradeNudge = ( { name, show } ) =>
 
 export default ( name ) => createHigherOrderComponent(
 	CoreMediaPlaceholder => props => {
-		const [ uploadingError, setUploadingError ] = useState( false );
+		const [ error, setError ] = useState( false );
 		const { onError } = props;
 
 		return (
 			<Fragment>
-				<JetpackCoverUpgradeNudge name={ name } show={ uploadingError } />
+				<JetpackCoverUpgradeNudge name={ name } show={ !! error } />
 				<CoreMediaPlaceholder
 					{ ...props }
 					onError = { ( message ) => {
-						setUploadingError( true );
+						// Try to pick up filename from the error message.
+						// We should find a better way to do it. Unstable.
+						const filename = message?.[0]?.props?.children;
+						if ( filename ) {
+							return setError( message );
+						}
 						return onError( message );
 					} }
 					allowedTypes={ ALLOWED_MEDIA_TYPES }

From 32f1077ca7d6143c22641fd2a732db83fb64734e Mon Sep 17 00:00:00 2001
From: retrofox <rdsuarez@gmail.com>
Date: Tue, 9 Jun 2020 10:24:52 -0300
Subject: [PATCH 06/32] cover: populate with wpAllowedVideoMimeTypes prop

---
 .../blocks/cover/cover-media-placeholder.js    | 18 ++++++++++++++++--
 1 file changed, 16 insertions(+), 2 deletions(-)

diff --git a/extensions/shared/blocks/cover/cover-media-placeholder.js b/extensions/shared/blocks/cover/cover-media-placeholder.js
index b33b79d6132b9..7b5cbcf9dc9d2 100644
--- a/extensions/shared/blocks/cover/cover-media-placeholder.js
+++ b/extensions/shared/blocks/cover/cover-media-placeholder.js
@@ -2,13 +2,15 @@
 /**
  * External dependencies
  */
+import { filter } from 'lodash';
 
 /**
  * WordPress dependencies
  */
-import { createHigherOrderComponent } from '@wordpress/compose';
+import { createHigherOrderComponent, compose } from '@wordpress/compose';
 import { Fragment, useState } from '@wordpress/element';
 import { __ } from '@wordpress/i18n';
+import { withSelect } from '@wordpress/data';
 
 /**
  * Internal dependencies
@@ -38,7 +40,7 @@ const JetpackCoverUpgradeNudge = ( { name, show } ) =>
 		/>
 		: null;
 
-export default ( name ) => createHigherOrderComponent(
+const JetpackCoverMediaPlaceholder = ( name ) => createHigherOrderComponent(
 	CoreMediaPlaceholder => props => {
 		const [ error, setError ] = useState( false );
 		const { onError } = props;
@@ -64,3 +66,15 @@ export default ( name ) => createHigherOrderComponent(
 	},
 	'JetpackCoverMediaPlaceholder'
 );
+
+export default ( name ) => compose( [
+	withSelect( ( select ) => {
+		const { getEditorSettings } = select( 'core/editor' );
+		const wpAllowedVideoMimeTypes = filter( getEditorSettings().allowedMimeTypes, type => /^video\//.test( type ) );
+
+		return {
+			wpAllowedVideoMimeTypes
+		};
+	} ),
+	JetpackCoverMediaPlaceholder( name )
+] );

From 15d92228aa1ae4e9073856cedb300c54b88252ca Mon Sep 17 00:00:00 2001
From: retrofox <rdsuarez@gmail.com>
Date: Tue, 9 Jun 2020 10:45:06 -0300
Subject: [PATCH 07/32] cover: populate with allowed videos props

---
 .../shared/blocks/cover/cover-media-placeholder.js     | 10 +++++++---
 1 file changed, 7 insertions(+), 3 deletions(-)

diff --git a/extensions/shared/blocks/cover/cover-media-placeholder.js b/extensions/shared/blocks/cover/cover-media-placeholder.js
index 7b5cbcf9dc9d2..d5a58d82dafc5 100644
--- a/extensions/shared/blocks/cover/cover-media-placeholder.js
+++ b/extensions/shared/blocks/cover/cover-media-placeholder.js
@@ -2,7 +2,7 @@
 /**
  * External dependencies
  */
-import { filter } from 'lodash';
+import { pickBy, keys, map, flatten } from 'lodash';
 
 /**
  * WordPress dependencies
@@ -70,10 +70,14 @@ const JetpackCoverMediaPlaceholder = ( name ) => createHigherOrderComponent(
 export default ( name ) => compose( [
 	withSelect( ( select ) => {
 		const { getEditorSettings } = select( 'core/editor' );
-		const wpAllowedVideoMimeTypes = filter( getEditorSettings().allowedMimeTypes, type => /^video\//.test( type ) );
+		const wpAllowedMimeTypes = getEditorSettings().allowedMimeTypes || [];
+
+		const wpAllowedVideoMimeTypes = pickBy( wpAllowedMimeTypes, ( type ) => /^video\//.test( type ) );
+		const wpAllowedVideoFileExtensions = flatten( map( keys( wpAllowedVideoMimeTypes ), ext => ext.split( '|' ) ) );
 
 		return {
-			wpAllowedVideoMimeTypes
+			wpAllowedVideoMimeTypes,
+			wpAllowedVideoFileExtensions,
 		};
 	} ),
 	JetpackCoverMediaPlaceholder( name )

From 397d950bb5678b768c29d00f92ac2d109b358b8f Mon Sep 17 00:00:00 2001
From: retrofox <rdsuarez@gmail.com>
Date: Tue, 9 Jun 2020 10:52:00 -0300
Subject: [PATCH 08/32] cover: show upgrade nudge only for videos

---
 .../blocks/cover/cover-media-placeholder.js      | 16 +++++++++-------
 1 file changed, 9 insertions(+), 7 deletions(-)

diff --git a/extensions/shared/blocks/cover/cover-media-placeholder.js b/extensions/shared/blocks/cover/cover-media-placeholder.js
index d5a58d82dafc5..7e683d56a5798 100644
--- a/extensions/shared/blocks/cover/cover-media-placeholder.js
+++ b/extensions/shared/blocks/cover/cover-media-placeholder.js
@@ -42,8 +42,8 @@ const JetpackCoverUpgradeNudge = ( { name, show } ) =>
 
 const JetpackCoverMediaPlaceholder = ( name ) => createHigherOrderComponent(
 	CoreMediaPlaceholder => props => {
+		const { onError, allowedVideoFileExtensions } = props;
 		const [ error, setError ] = useState( false );
-		const { onError } = props;
 
 		return (
 			<Fragment>
@@ -55,7 +55,10 @@ const JetpackCoverMediaPlaceholder = ( name ) => createHigherOrderComponent(
 						// We should find a better way to do it. Unstable.
 						const filename = message?.[0]?.props?.children;
 						if ( filename ) {
-							return setError( message );
+							const fileExtension = ( filename.split( '.' ) )?.[ 1 ];
+							if ( allowedVideoFileExtensions.includes( fileExtension ) ) {
+								return setError( message );
+							}
 						}
 						return onError( message );
 					} }
@@ -71,13 +74,12 @@ export default ( name ) => compose( [
 	withSelect( ( select ) => {
 		const { getEditorSettings } = select( 'core/editor' );
 		const wpAllowedMimeTypes = getEditorSettings().allowedMimeTypes || [];
-
-		const wpAllowedVideoMimeTypes = pickBy( wpAllowedMimeTypes, ( type ) => /^video\//.test( type ) );
-		const wpAllowedVideoFileExtensions = flatten( map( keys( wpAllowedVideoMimeTypes ), ext => ext.split( '|' ) ) );
+		const allowedVideoMimeTypes = pickBy( wpAllowedMimeTypes, ( type ) => /^video\//.test( type ) );
+		const allowedVideoFileExtensions = flatten( map( keys( allowedVideoMimeTypes ), ext => ext.split( '|' ) ) );
 
 		return {
-			wpAllowedVideoMimeTypes,
-			wpAllowedVideoFileExtensions,
+			allowedVideoMimeTypes,
+			allowedVideoFileExtensions,
 		};
 	} ),
 	JetpackCoverMediaPlaceholder( name )

From 3a79ce0e92faed7158b630e2e7f8c80e42f09668 Mon Sep 17 00:00:00 2001
From: retrofox <rdsuarez@gmail.com>
Date: Tue, 9 Jun 2020 10:53:36 -0300
Subject: [PATCH 09/32] cover: do not allow multiple uploading

---
 extensions/shared/blocks/cover/cover-media-placeholder.js | 1 +
 1 file changed, 1 insertion(+)

diff --git a/extensions/shared/blocks/cover/cover-media-placeholder.js b/extensions/shared/blocks/cover/cover-media-placeholder.js
index 7e683d56a5798..ecadfa4b7fb66 100644
--- a/extensions/shared/blocks/cover/cover-media-placeholder.js
+++ b/extensions/shared/blocks/cover/cover-media-placeholder.js
@@ -50,6 +50,7 @@ const JetpackCoverMediaPlaceholder = ( name ) => createHigherOrderComponent(
 				<JetpackCoverUpgradeNudge name={ name } show={ !! error } />
 				<CoreMediaPlaceholder
 					{ ...props }
+					multiple={ false }
 					onError = { ( message ) => {
 						// Try to pick up filename from the error message.
 						// We should find a better way to do it. Unstable.

From d624244e30079825c865716eff49f11d2b16fea8 Mon Sep 17 00:00:00 2001
From: retrofox <rdsuarez@gmail.com>
Date: Tue, 9 Jun 2020 11:10:51 -0300
Subject: [PATCH 10/32] cover: TRY picking up file from prop

---
 .../shared/blocks/cover/cover-media-placeholder.js  | 13 ++++++++++---
 1 file changed, 10 insertions(+), 3 deletions(-)

diff --git a/extensions/shared/blocks/cover/cover-media-placeholder.js b/extensions/shared/blocks/cover/cover-media-placeholder.js
index ecadfa4b7fb66..980ddf262b06f 100644
--- a/extensions/shared/blocks/cover/cover-media-placeholder.js
+++ b/extensions/shared/blocks/cover/cover-media-placeholder.js
@@ -2,7 +2,7 @@
 /**
  * External dependencies
  */
-import { pickBy, keys, map, flatten } from 'lodash';
+import { pickBy, keys, map, flatten, values } from 'lodash';
 
 /**
  * WordPress dependencies
@@ -42,7 +42,7 @@ const JetpackCoverUpgradeNudge = ( { name, show } ) =>
 
 const JetpackCoverMediaPlaceholder = ( name ) => createHigherOrderComponent(
 	CoreMediaPlaceholder => props => {
-		const { onError, allowedVideoFileExtensions } = props;
+		const { onError, allowedVideoMimeTypes, allowedVideoFileExtensions } = props;
 		const [ error, setError ] = useState( false );
 
 		return (
@@ -51,6 +51,13 @@ const JetpackCoverMediaPlaceholder = ( name ) => createHigherOrderComponent(
 				<CoreMediaPlaceholder
 					{ ...props }
 					multiple={ false }
+					onFilesPreUpload={ ( files ) => {
+						const fileMimeType = files?.[ 0 ].type;
+						if ( ! fileMimeType || ! allowedVideoMimeTypes.includes( fileMimeType ) ) {
+							return;
+						}
+						return setError( true );
+					} }
 					onError = { ( message ) => {
 						// Try to pick up filename from the error message.
 						// We should find a better way to do it. Unstable.
@@ -79,7 +86,7 @@ export default ( name ) => compose( [
 		const allowedVideoFileExtensions = flatten( map( keys( allowedVideoMimeTypes ), ext => ext.split( '|' ) ) );
 
 		return {
-			allowedVideoMimeTypes,
+			allowedVideoMimeTypes: values( allowedVideoMimeTypes ),
 			allowedVideoFileExtensions,
 		};
 	} ),

From bdd36d2b6376e778a9dab5681d39f94ef3f5c564 Mon Sep 17 00:00:00 2001
From: retrofox <rdsuarez@gmail.com>
Date: Tue, 9 Jun 2020 11:38:13 -0300
Subject: [PATCH 11/32] cover: extend only for simple sites

---
 extensions/shared/blocks/cover/index.js | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

diff --git a/extensions/shared/blocks/cover/index.js b/extensions/shared/blocks/cover/index.js
index a7ee353a5f805..30423242c567e 100644
--- a/extensions/shared/blocks/cover/index.js
+++ b/extensions/shared/blocks/cover/index.js
@@ -12,11 +12,15 @@ import { createHigherOrderComponent } from '@wordpress/compose';
  * Internal dependencies
  */
 import coverEditMediaPlaceholder from './cover-media-placeholder';
+import { isSimpleSite } from '../../site-type-utils';
 
 const extendCoreCoverBlock = createHigherOrderComponent(
 	( BlockEdit ) => ( props ) => {
 		const { name } = props;
-		if ( ! name || name !== 'core/cover' ) {
+		if (
+			( ! name || name !== 'core/cover' ) || // extend only for cover block
+			! isSimpleSite() // only for Simple sites
+		) {
 			return <BlockEdit { ...props } />;
 		}
 

From 815764022c4a3b69521d627d183b3030bdc67b70 Mon Sep 17 00:00:00 2001
From: retrofox <rdsuarez@gmail.com>
Date: Tue, 9 Jun 2020 13:31:45 -0300
Subject: [PATCH 12/32] cover: allow uploading video

---
 extensions/shared/blocks/cover/cover-media-placeholder.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/extensions/shared/blocks/cover/cover-media-placeholder.js b/extensions/shared/blocks/cover/cover-media-placeholder.js
index 980ddf262b06f..1eebd64c8c67d 100644
--- a/extensions/shared/blocks/cover/cover-media-placeholder.js
+++ b/extensions/shared/blocks/cover/cover-media-placeholder.js
@@ -20,7 +20,7 @@ import UpgradeNudge from "../../components/upgrade-nudge";
 /**
  * Module Constants
  */
-const ALLOWED_MEDIA_TYPES = [ 'image' ];
+const ALLOWED_MEDIA_TYPES = [ 'image', 'video' ];
 
 const JetpackCoverUpgradeNudge = ( { name, show } ) =>
 	show

From 83231fc32cdf6a83a0bfaa9d28a0b10d0d69b2c4 Mon Sep 17 00:00:00 2001
From: retrofox <rdsuarez@gmail.com>
Date: Tue, 9 Jun 2020 18:09:56 -0300
Subject: [PATCH 13/32] cover: halding simple site + free plan

---
 extensions/shared/blocks/cover/index.js | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/extensions/shared/blocks/cover/index.js b/extensions/shared/blocks/cover/index.js
index 30423242c567e..5a7a1325666ee 100644
--- a/extensions/shared/blocks/cover/index.js
+++ b/extensions/shared/blocks/cover/index.js
@@ -13,13 +13,16 @@ import { createHigherOrderComponent } from '@wordpress/compose';
  */
 import coverEditMediaPlaceholder from './cover-media-placeholder';
 import { isSimpleSite } from '../../site-type-utils';
+import getJetpackExtensionAvailability from '../../get-jetpack-extension-availability';
 
 const extendCoreCoverBlock = createHigherOrderComponent(
 	( BlockEdit ) => ( props ) => {
 		const { name } = props;
+		const { unavailableReason } = getJetpackExtensionAvailability( 'videopress' );
 		if (
 			( ! name || name !== 'core/cover' ) || // extend only for cover block
-			! isSimpleSite() // only for Simple sites
+			! isSimpleSite() || // only for Simple sites
+			! [ 'missing_plan', 'unknown' ].includes( unavailableReason )
 		) {
 			return <BlockEdit { ...props } />;
 		}

From e5d902f826760e1eafd0b45f9090498a4f86807f Mon Sep 17 00:00:00 2001
From: retrofox <rdsuarez@gmail.com>
Date: Tue, 9 Jun 2020 18:30:58 -0300
Subject: [PATCH 14/32] cover: use constans to detect uploading video

---
 .../blocks/cover/cover-media-placeholder.js   |  7 ++--
 extensions/shared/blocks/cover/utils.js       | 32 +++++++++++++++++++
 2 files changed, 36 insertions(+), 3 deletions(-)
 create mode 100644 extensions/shared/blocks/cover/utils.js

diff --git a/extensions/shared/blocks/cover/cover-media-placeholder.js b/extensions/shared/blocks/cover/cover-media-placeholder.js
index 1eebd64c8c67d..102f4bbec2fb2 100644
--- a/extensions/shared/blocks/cover/cover-media-placeholder.js
+++ b/extensions/shared/blocks/cover/cover-media-placeholder.js
@@ -16,6 +16,7 @@ import { withSelect } from '@wordpress/data';
  * Internal dependencies
  */
 import UpgradeNudge from "../../components/upgrade-nudge";
+import { videoFileExtensions, videoFileMimeTypes } from './utils';
 
 /**
  * Module Constants
@@ -42,7 +43,7 @@ const JetpackCoverUpgradeNudge = ( { name, show } ) =>
 
 const JetpackCoverMediaPlaceholder = ( name ) => createHigherOrderComponent(
 	CoreMediaPlaceholder => props => {
-		const { onError, allowedVideoMimeTypes, allowedVideoFileExtensions } = props;
+		const { onError } = props;
 		const [ error, setError ] = useState( false );
 
 		return (
@@ -53,7 +54,7 @@ const JetpackCoverMediaPlaceholder = ( name ) => createHigherOrderComponent(
 					multiple={ false }
 					onFilesPreUpload={ ( files ) => {
 						const fileMimeType = files?.[ 0 ].type;
-						if ( ! fileMimeType || ! allowedVideoMimeTypes.includes( fileMimeType ) ) {
+						if ( ! fileMimeType || ! videoFileMimeTypes.includes( fileMimeType ) ) {
 							return;
 						}
 						return setError( true );
@@ -64,7 +65,7 @@ const JetpackCoverMediaPlaceholder = ( name ) => createHigherOrderComponent(
 						const filename = message?.[0]?.props?.children;
 						if ( filename ) {
 							const fileExtension = ( filename.split( '.' ) )?.[ 1 ];
-							if ( allowedVideoFileExtensions.includes( fileExtension ) ) {
+							if ( videoFileExtensions.includes( fileExtension ) ) {
 								return setError( message );
 							}
 						}
diff --git a/extensions/shared/blocks/cover/utils.js b/extensions/shared/blocks/cover/utils.js
new file mode 100644
index 0000000000000..ff41e5b38321e
--- /dev/null
+++ b/extensions/shared/blocks/cover/utils.js
@@ -0,0 +1,32 @@
+
+export const videoFileExtensions = [
+	'ogv',
+	'mp4',
+	'm4v',
+	'mov',
+	'qt',
+	'wmv',
+	'avi',
+	'mpeg',
+	'mpg',
+	'mpe',
+	'3gp',
+	'3gpp',
+	'3g2',
+	'3gp2',
+	'3gp',
+	'3g2',
+];
+
+export const videoFileMimeTypes = [
+	'video/ogg',
+	'video/mp4',
+	'video/quicktime',
+	'video/x-ms-wmv',
+	'video/avi',
+	'video/mpeg',
+	'video/3gpp',
+	'video/3gpp2',
+	'video/3gpp',
+	'video/3gpp2',
+];

From 56a64031b7247f28a5ab14fa06619afebce4b456 Mon Sep 17 00:00:00 2001
From: retrofox <rdsuarez@gmail.com>
Date: Tue, 9 Jun 2020 18:34:05 -0300
Subject: [PATCH 15/32] cover: improve doc

---
 extensions/shared/blocks/cover/cover-media-placeholder.js | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/extensions/shared/blocks/cover/cover-media-placeholder.js b/extensions/shared/blocks/cover/cover-media-placeholder.js
index 102f4bbec2fb2..ce643c92e410a 100644
--- a/extensions/shared/blocks/cover/cover-media-placeholder.js
+++ b/extensions/shared/blocks/cover/cover-media-placeholder.js
@@ -53,6 +53,10 @@ const JetpackCoverMediaPlaceholder = ( name ) => createHigherOrderComponent(
 					{ ...props }
 					multiple={ false }
 					onFilesPreUpload={ ( files ) => {
+						// TRY/Experimental.
+						// Adding `onFilesPreUpload` prop hasn't been shiped yet.
+						// PR: https://github.com/WordPress/gutenberg/pull/22995
+						// Remove this code block in case the PR does isn't merged.
 						const fileMimeType = files?.[ 0 ].type;
 						if ( ! fileMimeType || ! videoFileMimeTypes.includes( fileMimeType ) ) {
 							return;

From 8f8c9721818ba0cccb735be116ad780f6a33e6c2 Mon Sep 17 00:00:00 2001
From: retrofox <rdsuarez@gmail.com>
Date: Tue, 9 Jun 2020 18:48:02 -0300
Subject: [PATCH 16/32] cover: refact -> use hook to get block name

---
 .../shared/blocks/cover/cover-media-placeholder.js   | 12 +++++++++---
 extensions/shared/blocks/cover/index.js              |  2 +-
 2 files changed, 10 insertions(+), 4 deletions(-)

diff --git a/extensions/shared/blocks/cover/cover-media-placeholder.js b/extensions/shared/blocks/cover/cover-media-placeholder.js
index ce643c92e410a..ad281619989d2 100644
--- a/extensions/shared/blocks/cover/cover-media-placeholder.js
+++ b/extensions/shared/blocks/cover/cover-media-placeholder.js
@@ -8,6 +8,7 @@ import { pickBy, keys, map, flatten, values } from 'lodash';
  * WordPress dependencies
  */
 import { createHigherOrderComponent, compose } from '@wordpress/compose';
+import { useBlockEditContext } from '@wordpress/block-editor';
 import { Fragment, useState } from '@wordpress/element';
 import { __ } from '@wordpress/i18n';
 import { withSelect } from '@wordpress/data';
@@ -41,8 +42,13 @@ const JetpackCoverUpgradeNudge = ( { name, show } ) =>
 		/>
 		: null;
 
-const JetpackCoverMediaPlaceholder = ( name ) => createHigherOrderComponent(
+const JetpackCoverMediaPlaceholder = createHigherOrderComponent(
 	CoreMediaPlaceholder => props => {
+		const { name } = useBlockEditContext();
+		if ( name !== 'core/cover' ) {
+			return <CoreMediaPlaceholder { ...props } />;
+		}
+
 		const { onError } = props;
 		const [ error, setError ] = useState( false );
 
@@ -83,7 +89,7 @@ const JetpackCoverMediaPlaceholder = ( name ) => createHigherOrderComponent(
 	'JetpackCoverMediaPlaceholder'
 );
 
-export default ( name ) => compose( [
+export default compose( [
 	withSelect( ( select ) => {
 		const { getEditorSettings } = select( 'core/editor' );
 		const wpAllowedMimeTypes = getEditorSettings().allowedMimeTypes || [];
@@ -95,5 +101,5 @@ export default ( name ) => compose( [
 			allowedVideoFileExtensions,
 		};
 	} ),
-	JetpackCoverMediaPlaceholder( name )
+	JetpackCoverMediaPlaceholder
 ] );
diff --git a/extensions/shared/blocks/cover/index.js b/extensions/shared/blocks/cover/index.js
index 5a7a1325666ee..8b182a9fde737 100644
--- a/extensions/shared/blocks/cover/index.js
+++ b/extensions/shared/blocks/cover/index.js
@@ -31,7 +31,7 @@ const extendCoreCoverBlock = createHigherOrderComponent(
 		addFilter(
 			'editor.MediaPlaceholder',
 			'jetpack/cover-edit-media-placeholder',
-			coverEditMediaPlaceholder( name )
+			coverEditMediaPlaceholder
 		);
 
 		return <BlockEdit { ...props } />;

From f76982f7920d097e828dcdf47cd8e44cdfaa4d06 Mon Sep 17 00:00:00 2001
From: retrofox <rdsuarez@gmail.com>
Date: Tue, 9 Jun 2020 19:40:03 -0300
Subject: [PATCH 17/32] cover: remove unused props

---
 .../blocks/cover/cover-media-placeholder.js   | 25 ++-----------------
 1 file changed, 2 insertions(+), 23 deletions(-)

diff --git a/extensions/shared/blocks/cover/cover-media-placeholder.js b/extensions/shared/blocks/cover/cover-media-placeholder.js
index ad281619989d2..fc42272d9179d 100644
--- a/extensions/shared/blocks/cover/cover-media-placeholder.js
+++ b/extensions/shared/blocks/cover/cover-media-placeholder.js
@@ -1,17 +1,11 @@
 
-/**
- * External dependencies
- */
-import { pickBy, keys, map, flatten, values } from 'lodash';
-
 /**
  * WordPress dependencies
  */
-import { createHigherOrderComponent, compose } from '@wordpress/compose';
+import { createHigherOrderComponent } from '@wordpress/compose';
 import { useBlockEditContext } from '@wordpress/block-editor';
 import { Fragment, useState } from '@wordpress/element';
 import { __ } from '@wordpress/i18n';
-import { withSelect } from '@wordpress/data';
 
 /**
  * Internal dependencies
@@ -42,7 +36,7 @@ const JetpackCoverUpgradeNudge = ( { name, show } ) =>
 		/>
 		: null;
 
-const JetpackCoverMediaPlaceholder = createHigherOrderComponent(
+export default createHigherOrderComponent(
 	CoreMediaPlaceholder => props => {
 		const { name } = useBlockEditContext();
 		if ( name !== 'core/cover' ) {
@@ -88,18 +82,3 @@ const JetpackCoverMediaPlaceholder = createHigherOrderComponent(
 	},
 	'JetpackCoverMediaPlaceholder'
 );
-
-export default compose( [
-	withSelect( ( select ) => {
-		const { getEditorSettings } = select( 'core/editor' );
-		const wpAllowedMimeTypes = getEditorSettings().allowedMimeTypes || [];
-		const allowedVideoMimeTypes = pickBy( wpAllowedMimeTypes, ( type ) => /^video\//.test( type ) );
-		const allowedVideoFileExtensions = flatten( map( keys( allowedVideoMimeTypes ), ext => ext.split( '|' ) ) );
-
-		return {
-			allowedVideoMimeTypes: values( allowedVideoMimeTypes ),
-			allowedVideoFileExtensions,
-		};
-	} ),
-	JetpackCoverMediaPlaceholder
-] );

From be1460a2e887de4e377c41d8be85e33382972fdb Mon Sep 17 00:00:00 2001
From: retrofox <rdsuarez@gmail.com>
Date: Tue, 9 Jun 2020 20:03:50 -0300
Subject: [PATCH 18/32] cover: move site & plan logic to media placeholder

---
 .../blocks/cover/cover-media-placeholder.js   |  9 +++++-
 extensions/shared/blocks/cover/index.js       | 32 +++----------------
 2 files changed, 13 insertions(+), 28 deletions(-)

diff --git a/extensions/shared/blocks/cover/cover-media-placeholder.js b/extensions/shared/blocks/cover/cover-media-placeholder.js
index fc42272d9179d..0e620bab8cf1c 100644
--- a/extensions/shared/blocks/cover/cover-media-placeholder.js
+++ b/extensions/shared/blocks/cover/cover-media-placeholder.js
@@ -12,6 +12,8 @@ import { __ } from '@wordpress/i18n';
  */
 import UpgradeNudge from "../../components/upgrade-nudge";
 import { videoFileExtensions, videoFileMimeTypes } from './utils';
+import { isSimpleSite } from "../../site-type-utils";
+import getJetpackExtensionAvailability from "../../get-jetpack-extension-availability";
 
 /**
  * Module Constants
@@ -39,7 +41,12 @@ const JetpackCoverUpgradeNudge = ( { name, show } ) =>
 export default createHigherOrderComponent(
 	CoreMediaPlaceholder => props => {
 		const { name } = useBlockEditContext();
-		if ( name !== 'core/cover' ) {
+		const { unavailableReason } = getJetpackExtensionAvailability( 'videopress' );
+		if (
+			( ! name || name !== 'core/cover' ) || // extend only for cover block
+			! isSimpleSite() || // only for Simple sites
+			! [ 'missing_plan', 'unknown' ].includes( unavailableReason )
+		) {
 			return <CoreMediaPlaceholder { ...props } />;
 		}
 
diff --git a/extensions/shared/blocks/cover/index.js b/extensions/shared/blocks/cover/index.js
index 8b182a9fde737..743acc694ed64 100644
--- a/extensions/shared/blocks/cover/index.js
+++ b/extensions/shared/blocks/cover/index.js
@@ -6,37 +6,15 @@
  * WordPress dependencies
  */
 import { addFilter } from '@wordpress/hooks';
-import { createHigherOrderComponent } from '@wordpress/compose';
 
 /**
  * Internal dependencies
  */
 import coverEditMediaPlaceholder from './cover-media-placeholder';
-import { isSimpleSite } from '../../site-type-utils';
-import getJetpackExtensionAvailability from '../../get-jetpack-extension-availability';
 
-const extendCoreCoverBlock = createHigherOrderComponent(
-	( BlockEdit ) => ( props ) => {
-		const { name } = props;
-		const { unavailableReason } = getJetpackExtensionAvailability( 'videopress' );
-		if (
-			( ! name || name !== 'core/cover' ) || // extend only for cover block
-			! isSimpleSite() || // only for Simple sites
-			! [ 'missing_plan', 'unknown' ].includes( unavailableReason )
-		) {
-			return <BlockEdit { ...props } />;
-		}
-
-		// Take the control of MediaPlaceholder.
-		addFilter(
-			'editor.MediaPlaceholder',
-			'jetpack/cover-edit-media-placeholder',
-			coverEditMediaPlaceholder
-		);
-
-		return <BlockEdit { ...props } />;
-	},
-	'JetpackCoverEdit'
+// Take the control of MediaPlaceholder.
+addFilter(
+	'editor.MediaPlaceholder',
+	'jetpack/cover-edit-media-placeholder',
+	coverEditMediaPlaceholder
 );
-
-addFilter( 'editor.BlockEdit', 'jetpack/cover', extendCoreCoverBlock );

From a18b2d7bc2abfe928129435bddf602a6ceb295fe Mon Sep 17 00:00:00 2001
From: retrofox <rdsuarez@gmail.com>
Date: Tue, 9 Jun 2020 20:15:45 -0300
Subject: [PATCH 19/32] cover: adjust dims of nudge

---
 extensions/shared/blocks/cover/cover-media-placeholder.js | 6 +++---
 extensions/shared/blocks/cover/editor.scss                | 3 +++
 extensions/shared/blocks/cover/index.js                   | 1 +
 3 files changed, 7 insertions(+), 3 deletions(-)
 create mode 100644 extensions/shared/blocks/cover/editor.scss

diff --git a/extensions/shared/blocks/cover/cover-media-placeholder.js b/extensions/shared/blocks/cover/cover-media-placeholder.js
index 0e620bab8cf1c..51456878aed9e 100644
--- a/extensions/shared/blocks/cover/cover-media-placeholder.js
+++ b/extensions/shared/blocks/cover/cover-media-placeholder.js
@@ -4,7 +4,7 @@
  */
 import { createHigherOrderComponent } from '@wordpress/compose';
 import { useBlockEditContext } from '@wordpress/block-editor';
-import { Fragment, useState } from '@wordpress/element';
+import { useState } from '@wordpress/element';
 import { __ } from '@wordpress/i18n';
 
 /**
@@ -54,7 +54,7 @@ export default createHigherOrderComponent(
 		const [ error, setError ] = useState( false );
 
 		return (
-			<Fragment>
+			<div className="jetpack-cover-media-placeholder">
 				<JetpackCoverUpgradeNudge name={ name } show={ !! error } />
 				<CoreMediaPlaceholder
 					{ ...props }
@@ -84,7 +84,7 @@ export default createHigherOrderComponent(
 					} }
 					allowedTypes={ ALLOWED_MEDIA_TYPES }
 				/>
-			</Fragment>
+			</div>
 		);
 	},
 	'JetpackCoverMediaPlaceholder'
diff --git a/extensions/shared/blocks/cover/editor.scss b/extensions/shared/blocks/cover/editor.scss
new file mode 100644
index 0000000000000..eb903bf5d0f09
--- /dev/null
+++ b/extensions/shared/blocks/cover/editor.scss
@@ -0,0 +1,3 @@
+.jetpack-cover-media-placeholder {
+	width: 100%;
+}
diff --git a/extensions/shared/blocks/cover/index.js b/extensions/shared/blocks/cover/index.js
index 743acc694ed64..c8f027f4131a2 100644
--- a/extensions/shared/blocks/cover/index.js
+++ b/extensions/shared/blocks/cover/index.js
@@ -11,6 +11,7 @@ import { addFilter } from '@wordpress/hooks';
  * Internal dependencies
  */
 import coverEditMediaPlaceholder from './cover-media-placeholder';
+import './editor.scss';
 
 // Take the control of MediaPlaceholder.
 addFilter(

From da2622e95f602ccd18761dda6ec24ad7ceb89bca Mon Sep 17 00:00:00 2001
From: retrofox <rdsuarez@gmail.com>
Date: Tue, 9 Jun 2020 20:57:15 -0300
Subject: [PATCH 20/32] cover: fix i18n bug

---
 extensions/shared/blocks/cover/cover-media-placeholder.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/extensions/shared/blocks/cover/cover-media-placeholder.js b/extensions/shared/blocks/cover/cover-media-placeholder.js
index 51456878aed9e..c11b96710d00b 100644
--- a/extensions/shared/blocks/cover/cover-media-placeholder.js
+++ b/extensions/shared/blocks/cover/cover-media-placeholder.js
@@ -26,7 +26,7 @@ const JetpackCoverUpgradeNudge = ( { name, show } ) =>
 			plan="value_bundle"
 			blockName={ name }
 			title={ {
-				knownPlan: __( 'To use a video in this block, upgrade to %(planName) plan.', 'jetpack' ),
+				knownPlan: __( 'To use a video in this block, upgrade to %(planName)s plan.', 'jetpack' ),
 				unknownPlan: __( 'To use a video in this block, upgrade to a paid plan.', 'jetpack' ),
 			} }
 			subtitle={ __(

From b2b3147019c407b512e2e1a73bcc18703656cd26 Mon Sep 17 00:00:00 2001
From: retrofox <rdsuarez@gmail.com>
Date: Wed, 10 Jun 2020 08:01:07 -0300
Subject: [PATCH 21/32] cover: tweak upgrade nudge.

---
 extensions/shared/blocks/cover/editor.scss | 9 +++++++++
 1 file changed, 9 insertions(+)

diff --git a/extensions/shared/blocks/cover/editor.scss b/extensions/shared/blocks/cover/editor.scss
index eb903bf5d0f09..31b0bfc258a87 100644
--- a/extensions/shared/blocks/cover/editor.scss
+++ b/extensions/shared/blocks/cover/editor.scss
@@ -1,3 +1,12 @@
 .jetpack-cover-media-placeholder {
 	width: 100%;
+
+	// tweak Upgrade nudge.
+	.block-editor-warning__contents {
+		flex-wrap: initial;
+
+		.block-editor-warning__actions {
+			align-self: center;
+		}
+	}
 }

From 9590bae3e50d32a237f9a76aa29090456b99961f Mon Sep 17 00:00:00 2001
From: retrofox <rdsuarez@gmail.com>
Date: Wed, 10 Jun 2020 08:07:49 -0300
Subject: [PATCH 22/32] cover: remove ussage of the experimental prop

---
 .../shared/blocks/cover/cover-media-placeholder.js  | 13 +------------
 extensions/shared/blocks/cover/utils.js             | 13 -------------
 2 files changed, 1 insertion(+), 25 deletions(-)

diff --git a/extensions/shared/blocks/cover/cover-media-placeholder.js b/extensions/shared/blocks/cover/cover-media-placeholder.js
index c11b96710d00b..7d3135f0fcc91 100644
--- a/extensions/shared/blocks/cover/cover-media-placeholder.js
+++ b/extensions/shared/blocks/cover/cover-media-placeholder.js
@@ -11,7 +11,7 @@ import { __ } from '@wordpress/i18n';
  * Internal dependencies
  */
 import UpgradeNudge from "../../components/upgrade-nudge";
-import { videoFileExtensions, videoFileMimeTypes } from './utils';
+import { videoFileExtensions } from './utils';
 import { isSimpleSite } from "../../site-type-utils";
 import getJetpackExtensionAvailability from "../../get-jetpack-extension-availability";
 
@@ -59,17 +59,6 @@ export default createHigherOrderComponent(
 				<CoreMediaPlaceholder
 					{ ...props }
 					multiple={ false }
-					onFilesPreUpload={ ( files ) => {
-						// TRY/Experimental.
-						// Adding `onFilesPreUpload` prop hasn't been shiped yet.
-						// PR: https://github.com/WordPress/gutenberg/pull/22995
-						// Remove this code block in case the PR does isn't merged.
-						const fileMimeType = files?.[ 0 ].type;
-						if ( ! fileMimeType || ! videoFileMimeTypes.includes( fileMimeType ) ) {
-							return;
-						}
-						return setError( true );
-					} }
 					onError = { ( message ) => {
 						// Try to pick up filename from the error message.
 						// We should find a better way to do it. Unstable.
diff --git a/extensions/shared/blocks/cover/utils.js b/extensions/shared/blocks/cover/utils.js
index ff41e5b38321e..1f07200be342f 100644
--- a/extensions/shared/blocks/cover/utils.js
+++ b/extensions/shared/blocks/cover/utils.js
@@ -17,16 +17,3 @@ export const videoFileExtensions = [
 	'3gp',
 	'3g2',
 ];
-
-export const videoFileMimeTypes = [
-	'video/ogg',
-	'video/mp4',
-	'video/quicktime',
-	'video/x-ms-wmv',
-	'video/avi',
-	'video/mpeg',
-	'video/3gpp',
-	'video/3gpp2',
-	'video/3gpp',
-	'video/3gpp2',
-];

From a5b3b857173c19fa57c3244938a510ef25c71156 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Dami=C3=A1n=20Su=C3=A1rez?= <rdsuarez@gmail.com>
Date: Wed, 10 Jun 2020 11:49:17 -0300
Subject: [PATCH 23/32] Update
 extensions/shared/blocks/cover/cover-media-placeholder.js

Co-authored-by: Jeremy Herve <jeremy@jeremy.hu>
---
 extensions/shared/blocks/cover/cover-media-placeholder.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/extensions/shared/blocks/cover/cover-media-placeholder.js b/extensions/shared/blocks/cover/cover-media-placeholder.js
index 7d3135f0fcc91..105062523a3f5 100644
--- a/extensions/shared/blocks/cover/cover-media-placeholder.js
+++ b/extensions/shared/blocks/cover/cover-media-placeholder.js
@@ -26,7 +26,7 @@ const JetpackCoverUpgradeNudge = ( { name, show } ) =>
 			plan="value_bundle"
 			blockName={ name }
 			title={ {
-				knownPlan: __( 'To use a video in this block, upgrade to %(planName)s plan.', 'jetpack' ),
+				knownPlan: __( 'To use a video in this block, upgrade to %(planName)s.', 'jetpack' ),
 				unknownPlan: __( 'To use a video in this block, upgrade to a paid plan.', 'jetpack' ),
 			} }
 			subtitle={ __(

From 2209fedb65bfcba101b8d847ca3fbab3db0c539a Mon Sep 17 00:00:00 2001
From: retrofox <rdsuarez@gmail.com>
Date: Wed, 10 Jun 2020 16:53:36 -0300
Subject: [PATCH 24/32] upgrade-nudge: allow don't render subtitle

---
 .../shared/components/block-nudge/index.jsx   |  2 +-
 .../shared/components/upgrade-nudge/index.jsx | 24 ++++++++++++-------
 2 files changed, 17 insertions(+), 9 deletions(-)

diff --git a/extensions/shared/components/block-nudge/index.jsx b/extensions/shared/components/block-nudge/index.jsx
index 97c883c872e10..0019e886c4669 100644
--- a/extensions/shared/components/block-nudge/index.jsx
+++ b/extensions/shared/components/block-nudge/index.jsx
@@ -30,7 +30,7 @@ export const BlockNudge = ( { autosaveAndRedirect, buttonLabel, href, icon, subt
 			{ icon }
 			<span className="jetpack-block-nudge__text-container">
 				<span className="jetpack-block-nudge__title">{ title }</span>
-				<span className="jetpack-block-nudge__message">{ subtitle }</span>
+				{ subtitle && <span className="jetpack-block-nudge__message">{ subtitle }</span> }
 			</span>
 		</span>
 	</Warning>
diff --git a/extensions/shared/components/upgrade-nudge/index.jsx b/extensions/shared/components/upgrade-nudge/index.jsx
index f4263bd8044b4..2178aa5f93ec2 100644
--- a/extensions/shared/components/upgrade-nudge/index.jsx
+++ b/extensions/shared/components/upgrade-nudge/index.jsx
@@ -32,6 +32,21 @@ const getTitle = ( customTitle, planName ) => {
 		: __( 'Upgrade to a paid plan to use this block on your site.', 'jetpack' );
 };
 
+const getSubtitle = ( subtitle ) => {
+	if ( subtitle === false ) {
+		return null;
+	}
+
+	if ( ! subtitle ) {
+		return __(
+			'You can try it out before upgrading, but only you will see it. It will be hidden from your visitors until you upgrade.',
+			'jetpack'
+		);
+	}
+
+	return subtitle;
+};
+
 export const UpgradeNudge = ( {
 	planName,
 	trackViewEvent,
@@ -61,14 +76,7 @@ export const UpgradeNudge = ( {
 			href={ upgradeUrl }
 			onClick={ trackClickEvent }
 			title={ getTitle( title, planName ) }
-			subtitle={
-				subtitle
-					? subtitle
-					: __(
-							'You can try it out before upgrading, but only you will see it. It will be hidden from your visitors until you upgrade.',
-							'jetpack'
-					  )
-			}
+			subtitle={ getSubtitle( subtitle ) }
 		/>
 	);
 };

From 5bd4db9825248dfae097949e07b7d3ab28eb27ec Mon Sep 17 00:00:00 2001
From: retrofox <rdsuarez@gmail.com>
Date: Wed, 10 Jun 2020 16:54:18 -0300
Subject: [PATCH 25/32] cover: remove nudge subtitle

---
 extensions/shared/blocks/cover/cover-media-placeholder.js | 7 +------
 extensions/shared/blocks/cover/editor.scss                | 1 +
 2 files changed, 2 insertions(+), 6 deletions(-)

diff --git a/extensions/shared/blocks/cover/cover-media-placeholder.js b/extensions/shared/blocks/cover/cover-media-placeholder.js
index 7d3135f0fcc91..3963eace1dae3 100644
--- a/extensions/shared/blocks/cover/cover-media-placeholder.js
+++ b/extensions/shared/blocks/cover/cover-media-placeholder.js
@@ -29,12 +29,7 @@ const JetpackCoverUpgradeNudge = ( { name, show } ) =>
 				knownPlan: __( 'To use a video in this block, upgrade to %(planName)s plan.', 'jetpack' ),
 				unknownPlan: __( 'To use a video in this block, upgrade to a paid plan.', 'jetpack' ),
 			} }
-			subtitle={ __(
-				'Upload unlimited videos to your website and \
-				display them using a fast, unbranded, \
-				customizable player.',
-				'jetpack'
-			) }
+			subtitle={ false }
 		/>
 		: null;
 
diff --git a/extensions/shared/blocks/cover/editor.scss b/extensions/shared/blocks/cover/editor.scss
index 31b0bfc258a87..43b944595017a 100644
--- a/extensions/shared/blocks/cover/editor.scss
+++ b/extensions/shared/blocks/cover/editor.scss
@@ -5,6 +5,7 @@
 	.block-editor-warning__contents {
 		flex-wrap: initial;
 
+		.jetpack-block-nudge__text-container,
 		.block-editor-warning__actions {
 			align-self: center;
 		}

From 4eff238f7e7be3e652d5080e466e6f57ac7a581d Mon Sep 17 00:00:00 2001
From: retrofox <rdsuarez@gmail.com>
Date: Thu, 11 Jun 2020 04:13:01 -0300
Subject: [PATCH 26/32] cover: improve jsdoc

---
 .../shared/blocks/cover/cover-media-placeholder.js  | 13 +++++++++++++
 1 file changed, 13 insertions(+)

diff --git a/extensions/shared/blocks/cover/cover-media-placeholder.js b/extensions/shared/blocks/cover/cover-media-placeholder.js
index 86bd55fd5416c..56ea3c8d16443 100644
--- a/extensions/shared/blocks/cover/cover-media-placeholder.js
+++ b/extensions/shared/blocks/cover/cover-media-placeholder.js
@@ -20,6 +20,19 @@ import getJetpackExtensionAvailability from "../../get-jetpack-extension-availab
  */
 const ALLOWED_MEDIA_TYPES = [ 'image', 'video' ];
 
+/**
+ * Nudge shows when the user tries to upload a video file.
+ * Unlike the core/video block, handled/extended by the videopress block,
+ * the nudge is not shown permanently.
+ * It's handled by the MediaPlaceholder component.
+ * For this reason, we can't wrap the edit setting
+ * with the wrapPaidBlock() HOC, as the videopress does.
+ *
+ * @param {object}  props - Information about the user.
+ * @param {string}  props.name - Show the Nudge component.
+ * @param {boolean} props.show - Show the Nudge component.
+ * @returns {*} Nudge component or Null.
+ */
 const JetpackCoverUpgradeNudge = ( { name, show } ) =>
 	show
 		? <UpgradeNudge

From 25294bdb126e2c5597739df6f255794cc28c4f11 Mon Sep 17 00:00:00 2001
From: retrofox <rdsuarez@gmail.com>
Date: Thu, 11 Jun 2020 06:09:16 -0300
Subject: [PATCH 27/32] cover: move hook at top of the component

---
 extensions/shared/blocks/cover/cover-media-placeholder.js | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/extensions/shared/blocks/cover/cover-media-placeholder.js b/extensions/shared/blocks/cover/cover-media-placeholder.js
index 56ea3c8d16443..e2178807734bd 100644
--- a/extensions/shared/blocks/cover/cover-media-placeholder.js
+++ b/extensions/shared/blocks/cover/cover-media-placeholder.js
@@ -48,6 +48,7 @@ const JetpackCoverUpgradeNudge = ( { name, show } ) =>
 
 export default createHigherOrderComponent(
 	CoreMediaPlaceholder => props => {
+		const [ error, setError ] = useState( false );
 		const { name } = useBlockEditContext();
 		const { unavailableReason } = getJetpackExtensionAvailability( 'videopress' );
 		if (
@@ -59,8 +60,6 @@ export default createHigherOrderComponent(
 		}
 
 		const { onError } = props;
-		const [ error, setError ] = useState( false );
-
 		return (
 			<div className="jetpack-cover-media-placeholder">
 				<JetpackCoverUpgradeNudge name={ name } show={ !! error } />

From ec16a96a34d881eb9701bd7f84fc2917f85baca2 Mon Sep 17 00:00:00 2001
From: retrofox <rdsuarez@gmail.com>
Date: Thu, 11 Jun 2020 06:13:57 -0300
Subject: [PATCH 28/32] cover: improve checking need upgrade

---
 .../blocks/cover/cover-media-placeholder.js       | 15 +++++++++------
 1 file changed, 9 insertions(+), 6 deletions(-)

diff --git a/extensions/shared/blocks/cover/cover-media-placeholder.js b/extensions/shared/blocks/cover/cover-media-placeholder.js
index e2178807734bd..a71efbdb0f019 100644
--- a/extensions/shared/blocks/cover/cover-media-placeholder.js
+++ b/extensions/shared/blocks/cover/cover-media-placeholder.js
@@ -70,13 +70,16 @@ export default createHigherOrderComponent(
 						// Try to pick up filename from the error message.
 						// We should find a better way to do it. Unstable.
 						const filename = message?.[0]?.props?.children;
-						if ( filename ) {
-							const fileExtension = ( filename.split( '.' ) )?.[ 1 ];
-							if ( videoFileExtensions.includes( fileExtension ) ) {
-								return setError( message );
-							}
+						if ( ! filename ) {
+							return onError( message );
 						}
-						return onError( message );
+
+						const fileExtension = ( filename.split( '.' ) )?.[ 1 ];
+						if ( ! videoFileExtensions.includes( fileExtension ) ) {
+							return onError( message );
+						}
+
+						return setError( message );
 					} }
 					allowedTypes={ ALLOWED_MEDIA_TYPES }
 				/>

From ac7bde5c9bbb68ddc10e8a8aac23a44e885ba811 Mon Sep 17 00:00:00 2001
From: retrofox <rdsuarez@gmail.com>
Date: Thu, 11 Jun 2020 06:40:19 -0300
Subject: [PATCH 29/32] cover: do not create an HOC unecessarely

---
 .../blocks/cover/cover-media-placeholder.js   | 75 +++++++++----------
 1 file changed, 36 insertions(+), 39 deletions(-)

diff --git a/extensions/shared/blocks/cover/cover-media-placeholder.js b/extensions/shared/blocks/cover/cover-media-placeholder.js
index a71efbdb0f019..54f58dda67a6b 100644
--- a/extensions/shared/blocks/cover/cover-media-placeholder.js
+++ b/extensions/shared/blocks/cover/cover-media-placeholder.js
@@ -46,45 +46,42 @@ const JetpackCoverUpgradeNudge = ( { name, show } ) =>
 		/>
 		: null;
 
-export default createHigherOrderComponent(
-	CoreMediaPlaceholder => props => {
-		const [ error, setError ] = useState( false );
-		const { name } = useBlockEditContext();
-		const { unavailableReason } = getJetpackExtensionAvailability( 'videopress' );
-		if (
-			( ! name || name !== 'core/cover' ) || // extend only for cover block
-			! isSimpleSite() || // only for Simple sites
-			! [ 'missing_plan', 'unknown' ].includes( unavailableReason )
-		) {
-			return <CoreMediaPlaceholder { ...props } />;
-		}
+export default CoreMediaPlaceholder => props => {
+	const [ error, setError ] = useState( false );
+	const { name } = useBlockEditContext();
+	const { unavailableReason } = getJetpackExtensionAvailability( 'videopress' );
+	if (
+		( ! name || name !== 'core/cover' ) || // extend only for cover block
+		! isSimpleSite() || // only for Simple sites
+		! [ 'missing_plan', 'unknown' ].includes( unavailableReason )
+	) {
+		return <CoreMediaPlaceholder { ...props } />;
+	}
 
-		const { onError } = props;
-		return (
-			<div className="jetpack-cover-media-placeholder">
-				<JetpackCoverUpgradeNudge name={ name } show={ !! error } />
-				<CoreMediaPlaceholder
-					{ ...props }
-					multiple={ false }
-					onError = { ( message ) => {
-						// Try to pick up filename from the error message.
-						// We should find a better way to do it. Unstable.
-						const filename = message?.[0]?.props?.children;
-						if ( ! filename ) {
-							return onError( message );
-						}
+	const { onError } = props;
+	return (
+		<div className="jetpack-cover-media-placeholder">
+			<JetpackCoverUpgradeNudge name={ name } show={ !! error } />
+			<CoreMediaPlaceholder
+				{ ...props }
+				multiple={ false }
+				onError = { ( message ) => {
+					// Try to pick up filename from the error message.
+					// We should find a better way to do it. Unstable.
+					const filename = message?.[0]?.props?.children;
+					if ( ! filename ) {
+						return onError( message );
+					}
 
-						const fileExtension = ( filename.split( '.' ) )?.[ 1 ];
-						if ( ! videoFileExtensions.includes( fileExtension ) ) {
-							return onError( message );
-						}
+					const fileExtension = ( filename.split( '.' ) )?.[ 1 ];
+					if ( ! videoFileExtensions.includes( fileExtension ) ) {
+						return onError( message );
+					}
 
-						return setError( message );
-					} }
-					allowedTypes={ ALLOWED_MEDIA_TYPES }
-				/>
-			</div>
-		);
-	},
-	'JetpackCoverMediaPlaceholder'
-);
+					return setError( message );
+				} }
+				allowedTypes={ ALLOWED_MEDIA_TYPES }
+			/>
+		</div>
+	);
+};

From 84f695a449e8492ca1a1545db1aa77cd1f9e0d25 Mon Sep 17 00:00:00 2001
From: retrofox <rdsuarez@gmail.com>
Date: Mon, 15 Jun 2020 06:04:03 -0300
Subject: [PATCH 30/32] cover: remove unneeded dependency. Improve jsdoc.

---
 extensions/shared/blocks/cover/cover-media-placeholder.js | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/extensions/shared/blocks/cover/cover-media-placeholder.js b/extensions/shared/blocks/cover/cover-media-placeholder.js
index 54f58dda67a6b..609f2a6245c4f 100644
--- a/extensions/shared/blocks/cover/cover-media-placeholder.js
+++ b/extensions/shared/blocks/cover/cover-media-placeholder.js
@@ -2,7 +2,6 @@
 /**
  * WordPress dependencies
  */
-import { createHigherOrderComponent } from '@wordpress/compose';
 import { useBlockEditContext } from '@wordpress/block-editor';
 import { useState } from '@wordpress/element';
 import { __ } from '@wordpress/i18n';
@@ -24,7 +23,8 @@ const ALLOWED_MEDIA_TYPES = [ 'image', 'video' ];
  * Nudge shows when the user tries to upload a video file.
  * Unlike the core/video block, handled/extended by the videopress block,
  * the nudge is not shown permanently.
- * It's handled by the MediaPlaceholder component.
+ * It's handled by the MediaPlaceholder component
+ * when the user tries to upload a video file.
  * For this reason, we can't wrap the edit setting
  * with the wrapPaidBlock() HOC, as the videopress does.
  *
@@ -50,6 +50,7 @@ export default CoreMediaPlaceholder => props => {
 	const [ error, setError ] = useState( false );
 	const { name } = useBlockEditContext();
 	const { unavailableReason } = getJetpackExtensionAvailability( 'videopress' );
+
 	if (
 		( ! name || name !== 'core/cover' ) || // extend only for cover block
 		! isSimpleSite() || // only for Simple sites

From e7a61ea231c1304525e4126adaafbe9eb5956103 Mon Sep 17 00:00:00 2001
From: retrofox <rdsuarez@gmail.com>
Date: Mon, 15 Jun 2020 06:29:36 -0300
Subject: [PATCH 31/32] cover: apply filter only when user is connected

---
 extensions/shared/blocks/cover/index.js | 15 +++++++++------
 1 file changed, 9 insertions(+), 6 deletions(-)

diff --git a/extensions/shared/blocks/cover/index.js b/extensions/shared/blocks/cover/index.js
index c8f027f4131a2..85bb5df2f82c8 100644
--- a/extensions/shared/blocks/cover/index.js
+++ b/extensions/shared/blocks/cover/index.js
@@ -11,11 +11,14 @@ import { addFilter } from '@wordpress/hooks';
  * Internal dependencies
  */
 import coverEditMediaPlaceholder from './cover-media-placeholder';
+import isCurrentUserConnected from "../../is-current-user-connected";
 import './editor.scss';
 
-// Take the control of MediaPlaceholder.
-addFilter(
-	'editor.MediaPlaceholder',
-	'jetpack/cover-edit-media-placeholder',
-	coverEditMediaPlaceholder
-);
+if ( isCurrentUserConnected() ) {
+	// Take the control of MediaPlaceholder.
+	addFilter(
+		'editor.MediaPlaceholder',
+		'jetpack/cover-edit-media-placeholder',
+		coverEditMediaPlaceholder
+	);
+}

From c272350c7f010977c02c6a71282d7d24b11247c3 Mon Sep 17 00:00:00 2001
From: retrofox <rdsuarez@gmail.com>
Date: Mon, 15 Jun 2020 06:29:59 -0300
Subject: [PATCH 32/32] upgrade-nudge: improve jsdoc

---
 extensions/shared/components/upgrade-nudge/index.jsx | 10 ++++++++++
 1 file changed, 10 insertions(+)

diff --git a/extensions/shared/components/upgrade-nudge/index.jsx b/extensions/shared/components/upgrade-nudge/index.jsx
index 2178aa5f93ec2..21371144a8036 100644
--- a/extensions/shared/components/upgrade-nudge/index.jsx
+++ b/extensions/shared/components/upgrade-nudge/index.jsx
@@ -32,6 +32,16 @@ const getTitle = ( customTitle, planName ) => {
 		: __( 'Upgrade to a paid plan to use this block on your site.', 'jetpack' );
 };
 
+/**
+ * Return the nudge description translated to the user language, or Null.
+ * `subtitle` param accepts three types:
+ * - A string, in which case it will translate and returned.
+ * - False (boolean), in which case it will return false
+ * - Undefined: it will return the default nudge description.
+ *
+ * @param {string|boolean} subtitle - Subtitle to translate, or False.
+ * @returns {string|null} Nudge description, or Null.
+ */
 const getSubtitle = ( subtitle ) => {
 	if ( subtitle === false ) {
 		return null;