Update jetpack 8.0

Signed-off-by: Anthony G. Basile <blueness@gentoo.org>

40 files changed, 7 insertions, 3175 deletions

diff --git a/plugins/jetpack/extensions/blocks/tiled-gallery/constants.js b/plugins/jetpack/extensions/blocks/tiled-gallery/constants.js
deleted file mode 100644
index 0df90737..00000000
--- a/plugins/jetpack/extensions/blocks/tiled-gallery/constants.js
+++ /dev/null
@@ -1,28 +0,0 @@
-export const ALLOWED_MEDIA_TYPES = [ 'image' ];
-export const DEFAULT_GALLERY_WIDTH = 580;
-export const GUTTER_WIDTH = 4;
-export const MAX_COLUMNS = 20;
-export const PHOTON_MAX_RESIZE = 2000;
-
-/**
- * Layouts
- */
-export const LAYOUT_CIRCLE = 'circle';
-export const LAYOUT_COLUMN = 'columns';
-export const LAYOUT_DEFAULT = 'rectangular';
-export const LAYOUT_SQUARE = 'square';
-export const LAYOUT_STYLES = [
-	{
-		isDefault: true,
-		name: LAYOUT_DEFAULT,
-	},
-	{
-		name: LAYOUT_CIRCLE,
-	},
-	{
-		name: LAYOUT_SQUARE,
-	},
-	{
-		name: LAYOUT_COLUMN,
-	},
-];
diff --git a/plugins/jetpack/extensions/blocks/tiled-gallery/css-gram.scss b/plugins/jetpack/extensions/blocks/tiled-gallery/css-gram.scss
deleted file mode 100644
index 9fd2f49c..00000000
--- a/plugins/jetpack/extensions/blocks/tiled-gallery/css-gram.scss
+++ /dev/null
@@ -1,86 +0,0 @@
-/**
- * This code is based on CSS gram:
- * https://github.com/una/CSSgram/tree/master
- *
- * Due to the packaging options available, the source has been duplicated and adapted here
- * to best fit our specific needs.
- */
-
-/* From https://github.com/una/CSSgram/blob/0.1.12/source/scss/_shared.scss */
-@mixin pseudo-elem {
-	content: '';
-	display: block;
-	height: 100%;
-	width: 100%;
-	top: 0;
-	left: 0;
-	position: absolute;
-	pointer-events: none;
-}
-
-@mixin filter-base {
-	position: relative;
-
-	img {
-		width: 100%;
-		z-index: 1;
-	}
-
-	&::before {
-		@include pseudo-elem;
-		z-index: 2;
-	}
-
-	&::after {
-		@include pseudo-elem;
-		z-index: 3;
-	}
-}
-
-/**
- * 1977
- * From https://github.com/una/CSSgram/blob/0.1.12/source/scss/1977.scss
- */
-@mixin _1977( $filters... ) {
-	@include filter-base;
-	filter: contrast( 1.1 ) brightness( 1.1 ) saturate( 1.3 ) $filters;
-
-	&::after {
-		background: rgba( 243, 106, 188, 0.3 );
-		mix-blend-mode: screen;
-	}
-
-	@content;
-}
-
-/*
- * Clarendon
- * From https://github.com/una/CSSgram/blob/0.1.12/source/scss/clarendon.scss
- */
-@mixin clarendon( $filters... ) {
-	@include filter-base;
-	filter: contrast( 1.2 ) saturate( 1.35 ) $filters;
-
-	&::before {
-		background: rgba( 127, 187, 227, 0.2 );
-		mix-blend-mode: overlay;
-	}
-
-	@content;
-}
-
-/**
- * Gingham
- * From https://github.com/una/CSSgram/blob/0.1.12/source/scss/gingham.scss
- */
-@mixin gingham( $filters... ) {
-	@include filter-base;
-	filter: brightness( 1.05 ) hue-rotate( -10deg ) $filters;
-
-	&::after {
-		background: rgb( 230, 230, 250 );
-		mix-blend-mode: soft-light;
-	}
-
-	@content;
-}
diff --git a/plugins/jetpack/extensions/blocks/tiled-gallery/deprecated/v1/constants.js b/plugins/jetpack/extensions/blocks/tiled-gallery/deprecated/v1/constants.js
deleted file mode 100644
index 55a451fc..00000000
--- a/plugins/jetpack/extensions/blocks/tiled-gallery/deprecated/v1/constants.js
+++ /dev/null
@@ -1,27 +0,0 @@
-export const ALLOWED_MEDIA_TYPES = [ 'image' ];
-export const GUTTER_WIDTH = 4;
-export const MAX_COLUMNS = 20;
-export const PHOTON_MAX_RESIZE = 2000;
-
-/**
- * Layouts
- */
-export const LAYOUT_CIRCLE = 'circle';
-export const LAYOUT_COLUMN = 'columns';
-export const LAYOUT_DEFAULT = 'rectangular';
-export const LAYOUT_SQUARE = 'square';
-export const LAYOUT_STYLES = [
-	{
-		isDefault: true,
-		name: LAYOUT_DEFAULT,
-	},
-	{
-		name: LAYOUT_CIRCLE,
-	},
-	{
-		name: LAYOUT_SQUARE,
-	},
-	{
-		name: LAYOUT_COLUMN,
-	},
-];
diff --git a/plugins/jetpack/extensions/blocks/tiled-gallery/deprecated/v1/image.js b/plugins/jetpack/extensions/blocks/tiled-gallery/deprecated/v1/image.js
deleted file mode 100644
index 61d4a2cd..00000000
--- a/plugins/jetpack/extensions/blocks/tiled-gallery/deprecated/v1/image.js
+++ /dev/null
@@ -1,51 +0,0 @@
-/**
- * External Dependencies
- */
-import { isBlobURL } from '@wordpress/blob';
-
-export default function GalleryImageSave( props ) {
-	const {
-		'aria-label': ariaLabel,
-		alt,
-		// caption,
-		height,
-		id,
-		link,
-		linkTo,
-		origUrl,
-		url,
-		width,
-	} = props;
-
-	if ( isBlobURL( origUrl ) ) {
-		return null;
-	}
-
-	let href;
-
-	switch ( linkTo ) {
-		case 'media':
-			href = url;
-			break;
-		case 'attachment':
-			href = link;
-			break;
-	}
-
-	const img = (
-		<img
-			alt={ alt }
-			aria-label={ ariaLabel }
-			data-height={ height }
-			data-id={ id }
-			data-link={ link }
-			data-url={ origUrl }
-			data-width={ width }
-			src={ url }
-		/>
-	);
-
-	return (
-		<figure className="tiled-gallery__item">{ href ? <a href={ href }>{ img }</a> : img }</figure>
-	);
-}
diff --git a/plugins/jetpack/extensions/blocks/tiled-gallery/deprecated/v1/index.js b/plugins/jetpack/extensions/blocks/tiled-gallery/deprecated/v1/index.js
deleted file mode 100644
index 69539d00..00000000
--- a/plugins/jetpack/extensions/blocks/tiled-gallery/deprecated/v1/index.js
+++ /dev/null
@@ -1,81 +0,0 @@
-/**
- * Internal dependencies
- */
-export { default as save } from './save';
-import { LAYOUT_DEFAULT } from './constants';
-
-export const attributes = {
-	// Set default align
-	align: {
-		default: 'center',
-		type: 'string',
-	},
-	// Set default className (used with block styles)
-	className: {
-		default: `is-style-${ LAYOUT_DEFAULT }`,
-		type: 'string',
-	},
-	columns: {
-		type: 'number',
-	},
-	ids: {
-		default: [],
-		type: 'array',
-	},
-	images: {
-		type: 'array',
-		default: [],
-		source: 'query',
-		selector: '.tiled-gallery__item',
-		query: {
-			alt: {
-				attribute: 'alt',
-				default: '',
-				selector: 'img',
-				source: 'attribute',
-			},
-			caption: {
-				selector: 'figcaption',
-				source: 'html',
-				type: 'string',
-			},
-			height: {
-				attribute: 'data-height',
-				selector: 'img',
-				source: 'attribute',
-				type: 'number',
-			},
-			id: {
-				attribute: 'data-id',
-				selector: 'img',
-				source: 'attribute',
-			},
-			link: {
-				attribute: 'data-link',
-				selector: 'img',
-				source: 'attribute',
-			},
-			url: {
-				attribute: 'data-url',
-				selector: 'img',
-				source: 'attribute',
-			},
-			width: {
-				attribute: 'data-width',
-				selector: 'img',
-				source: 'attribute',
-				type: 'number',
-			},
-		},
-	},
-	linkTo: {
-		default: 'none',
-		type: 'string',
-	},
-};
-
-export const support = {
-	align: [ 'center', 'wide', 'full' ],
-	customClassName: false,
-	html: false,
-};
diff --git a/plugins/jetpack/extensions/blocks/tiled-gallery/deprecated/v1/layout/column.js b/plugins/jetpack/extensions/blocks/tiled-gallery/deprecated/v1/layout/column.js
deleted file mode 100644
index a3ed5cdf..00000000
--- a/plugins/jetpack/extensions/blocks/tiled-gallery/deprecated/v1/layout/column.js
+++ /dev/null
@@ -1,3 +0,0 @@
-export default function Column( { children } ) {
-	return <div className="tiled-gallery__col">{ children }</div>;
-}
diff --git a/plugins/jetpack/extensions/blocks/tiled-gallery/deprecated/v1/layout/gallery.js b/plugins/jetpack/extensions/blocks/tiled-gallery/deprecated/v1/layout/gallery.js
deleted file mode 100644
index 94fc61e4..00000000
--- a/plugins/jetpack/extensions/blocks/tiled-gallery/deprecated/v1/layout/gallery.js
+++ /dev/null
@@ -1,7 +0,0 @@
-export default function Gallery( { children, galleryRef } ) {
-	return (
-		<div className="tiled-gallery__gallery" ref={ galleryRef }>
-			{ children }
-		</div>
-	);
-}
diff --git a/plugins/jetpack/extensions/blocks/tiled-gallery/deprecated/v1/layout/index.js b/plugins/jetpack/extensions/blocks/tiled-gallery/deprecated/v1/layout/index.js
deleted file mode 100644
index 3b434fe4..00000000
--- a/plugins/jetpack/extensions/blocks/tiled-gallery/deprecated/v1/layout/index.js
+++ /dev/null
@@ -1,144 +0,0 @@
-/**
- * External dependencies
- */
-import photon from 'photon';
-import { __, sprintf } from '@wordpress/i18n';
-import { Component } from '@wordpress/element';
-import { format as formatUrl, parse as parseUrl } from 'url';
-import { isBlobURL } from '@wordpress/blob';
-
-/**
- * Internal dependencies
- */
-import Image from '../image';
-import Mosaic from './mosaic';
-import Square from './square';
-import { PHOTON_MAX_RESIZE } from '../constants';
-
-export default class Layout extends Component {
-	photonize( { height, width, url } ) {
-		if ( ! url ) {
-			return;
-		}
-
-		// Do not Photonize images that are still uploading or from localhost
-		if ( isBlobURL( url ) || /^https?:\/\/localhost/.test( url ) ) {
-			return url;
-		}
-
-		// Drop query args, photon URLs can't handle them
-		// This should be the "raw" url, we'll add dimensions later
-		const cleanUrl = url.split( '?', 1 )[ 0 ];
-
-		const photonImplementation = isWpcomFilesUrl( url ) ? photonWpcomImage : photon;
-
-		const { layoutStyle } = this.props;
-
-		if ( isSquareishLayout( layoutStyle ) && width && height ) {
-			const size = Math.min( PHOTON_MAX_RESIZE, width, height );
-			return photonImplementation( cleanUrl, { resize: `${ size },${ size }` } );
-		}
-		return photonImplementation( cleanUrl );
-	}
-
-	// This is tricky:
-	// - We need to "photonize" to resize the images at appropriate dimensions
-	// - The resize will depend on the image size and the layout in some cases
-	// - Handlers need to be created by index so that the image changes can be applied correctly.
-	//   This is because the images are stored in an array in the block attributes.
-	renderImage( img, i ) {
-		const { images, linkTo, selectedImage } = this.props;
-
-		/* translators: %1$d is the order number of the image, %2$d is the total number of images. */
-		const ariaLabel = sprintf(
-			__( 'image %1$d of %2$d in gallery', 'jetpack' ),
-			i + 1,
-			images.length
-		);
-		return (
-			<Image
-				alt={ img.alt }
-				aria-label={ ariaLabel }
-				height={ img.height }
-				id={ img.id }
-				origUrl={ img.url }
-				isSelected={ selectedImage === i }
-				key={ i }
-				link={ img.link }
-				linkTo={ linkTo }
-				url={ this.photonize( img ) }
-				width={ img.width }
-			/>
-		);
-	}
-
-	render() {
-		const { align, children, className, columns, images, layoutStyle } = this.props;
-
-		const LayoutRenderer = isSquareishLayout( layoutStyle ) ? Square : Mosaic;
-
-		const renderedImages = this.props.images.map( this.renderImage, this );
-
-		return (
-			<div className={ className }>
-				<LayoutRenderer
-					align={ align }
-					columns={ columns }
-					images={ images }
-					layoutStyle={ layoutStyle }
-					renderedImages={ renderedImages }
-				/>
-				{ children }
-			</div>
-		);
-	}
-}
-
-function isSquareishLayout( layout ) {
-	return [ 'circle', 'square' ].includes( layout );
-}
-
-function isWpcomFilesUrl( url ) {
-	const { host } = parseUrl( url );
-	return /\.files\.wordpress\.com$/.test( host );
-}
-
-/**
- * Apply photon arguments to *.files.wordpress.com images
- *
- * This function largely duplicates the functionlity of the photon.js lib.
- * This is necessary because we want to serve images from *.files.wordpress.com so that private
- * WordPress.com sites can use this block which depends on a Photon-like image service.
- *
- * If we pass all images through Photon servers, some images are unreachable. *.files.wordpress.com
- * is already photon-like so we can pass it the same parameters for image resizing.
- *
- * @param  {string} url  Image url
- * @param  {Object} opts Options to pass to photon
- *
- * @return {string}      Url string with options applied
- */
-function photonWpcomImage( url, opts = {} ) {
-	// Adhere to the same options API as the photon.js lib
-	const photonLibMappings = {
-		width: 'w',
-		height: 'h',
-		letterboxing: 'lb',
-		removeLetterboxing: 'ulb',
-	};
-
-	// Discard some param parts
-	const { auth, hash, port, query, search, ...urlParts } = parseUrl( url );
-
-	// Build query
-	// This reduction intentionally mutates the query as it is built internally.
-	urlParts.query = Object.keys( opts ).reduce(
-		( q, key ) =>
-			Object.assign( q, {
-				[ photonLibMappings.hasOwnProperty( key ) ? photonLibMappings[ key ] : key ]: opts[ key ],
-			} ),
-		{}
-	);
-
-	return formatUrl( urlParts );
-}
diff --git a/plugins/jetpack/extensions/blocks/tiled-gallery/deprecated/v1/layout/mosaic/index.js b/plugins/jetpack/extensions/blocks/tiled-gallery/deprecated/v1/layout/mosaic/index.js
deleted file mode 100644
index 8c56b164..00000000
--- a/plugins/jetpack/extensions/blocks/tiled-gallery/deprecated/v1/layout/mosaic/index.js
+++ /dev/null
@@ -1,104 +0,0 @@
-/**
- * External dependencies
- */
-import { Component, createRef } from '@wordpress/element';
-import ResizeObserver from 'resize-observer-polyfill';
-
-/**
- * Internal dependencies
- */
-import Column from '../column';
-import Gallery from '../gallery';
-import Row from '../row';
-import { getGalleryRows, handleRowResize } from './resize';
-import { imagesToRatios, ratiosToColumns, ratiosToMosaicRows } from './ratios';
-
-export default class Mosaic extends Component {
-	gallery = createRef();
-	pendingRaf = null;
-	ro = null; // resizeObserver instance
-
-	componentDidMount() {
-		this.observeResize();
-	}
-
-	componentWillUnmount() {
-		this.unobserveResize();
-	}
-
-	componentDidUpdate( prevProps ) {
-		if ( prevProps.images !== this.props.images || prevProps.align !== this.props.align ) {
-			this.triggerResize();
-		} else if ( 'columns' === this.props.layoutStyle && prevProps.columns !== this.props.columns ) {
-			this.triggerResize();
-		}
-	}
-
-	handleGalleryResize = entries => {
-		if ( this.pendingRaf ) {
-			cancelAnimationFrame( this.pendingRaf );
-			this.pendingRaf = null;
-		}
-		this.pendingRaf = requestAnimationFrame( () => {
-			for ( const { contentRect, target } of entries ) {
-				const { width } = contentRect;
-				getGalleryRows( target ).forEach( row => handleRowResize( row, width ) );
-			}
-		} );
-	};
-
-	triggerResize() {
-		if ( this.gallery.current ) {
-			this.handleGalleryResize( [
-				{
-					target: this.gallery.current,
-					contentRect: { width: this.gallery.current.clientWidth },
-				},
-			] );
-		}
-	}
-
-	observeResize() {
-		this.triggerResize();
-		this.ro = new ResizeObserver( this.handleGalleryResize );
-		if ( this.gallery.current ) {
-			this.ro.observe( this.gallery.current );
-		}
-	}
-
-	unobserveResize() {
-		if ( this.ro ) {
-			this.ro.disconnect();
-			this.ro = null;
-		}
-		if ( this.pendingRaf ) {
-			cancelAnimationFrame( this.pendingRaf );
-			this.pendingRaf = null;
-		}
-	}
-
-	render() {
-		const { align, columns, images, layoutStyle, renderedImages } = this.props;
-
-		const ratios = imagesToRatios( images );
-		const rows =
-			'columns' === layoutStyle
-				? ratiosToColumns( ratios, columns )
-				: ratiosToMosaicRows( ratios, { isWide: [ 'full', 'wide' ].includes( align ) } );
-
-		let cursor = 0;
-		return (
-			<Gallery galleryRef={ this.gallery }>
-				{ rows.map( ( row, rowIndex ) => (
-					<Row key={ rowIndex }>
-						{ row.map( ( colSize, colIndex ) => {
-							const columnImages = renderedImages.slice( cursor, cursor + colSize );
-							cursor += colSize;
-							return <Column key={ colIndex }>{ columnImages }</Column>;
-						} ) }
-					</Row>
-				) ) }
-			</Gallery>
-		);
-	}
-}
diff --git a/plugins/jetpack/extensions/blocks/tiled-gallery/deprecated/v1/layout/mosaic/ratios.js b/plugins/jetpack/extensions/blocks/tiled-gallery/deprecated/v1/layout/mosaic/ratios.js
deleted file mode 100644
index 8accd552..00000000
--- a/plugins/jetpack/extensions/blocks/tiled-gallery/deprecated/v1/layout/mosaic/ratios.js
+++ /dev/null
@@ -1,280 +0,0 @@
-/**
- * External dependencies
- */
-import {
-	drop,
-	every,
-	isEqual,
-	map,
-	overEvery,
-	some,
-	sum,
-	take,
-	takeRight,
-	takeWhile,
-	zipWith,
-} from 'lodash';
-
-export function imagesToRatios( images ) {
-	return map( images, ratioFromImage );
-}
-
-export function ratioFromImage( { height, width } ) {
-	return height && width ? width / height : 1;
-}
-
-/**
- * Build three columns, each of which should contain approximately 1/3 of the total ratio
- *
- * @param  {Array.<number>}         ratios      Ratios of images put into shape
- * @param  {number}                 columnCount Number of columns
- *
- * @return {Array.<Array.<number>>}             Shape of rows and columns
- */
-export function ratiosToColumns( ratios, columnCount ) {
-	// If we don't have more than 1 per column, just return a simple 1 ratio per column shape
-	if ( ratios.length <= columnCount ) {
-		return [ Array( ratios.length ).fill( 1 ) ];
-	}
-
-	const total = sum( ratios );
-	const targetColRatio = total / columnCount;
-
-	const row = [];
-	let toProcess = ratios;
-	let accumulatedRatio = 0;
-
-	// We skip the last column in the loop and add rest later
-	for ( let i = 0; i < columnCount - 1; i++ ) {
-		const colSize = takeWhile( toProcess, ratio => {
-			const shouldTake = accumulatedRatio <= ( i + 1 ) * targetColRatio;
-			if ( shouldTake ) {
-				accumulatedRatio += ratio;
-			}
-			return shouldTake;
-		} ).length;
-		row.push( colSize );
-		toProcess = drop( toProcess, colSize );
-	}
-
-	// Don't calculate last column, just add what's left
-	row.push( toProcess.length );
-
-	// A shape is an array of rows. Wrap our row in an array.
-	return [ row ];
-}
-
-/**
- * These are partially applied functions.
- * They rely on helper function (defined below) to create a function that expects to be passed ratios
- * during processing.
- *
- * …FitsNextImages() functions should be passed ratios to be processed
- * …IsNotRecent() functions should be passed the processed shapes
- */
-
-const reverseSymmetricRowIsNotRecent = isNotRecentShape( [ 2, 1, 2 ], 5 );
-const reverseSymmetricFitsNextImages = checkNextRatios( [
-	isLandscape,
-	isLandscape,
-	isPortrait,
-	isLandscape,
-	isLandscape,
-] );
-const longSymmetricRowFitsNextImages = checkNextRatios( [
-	isLandscape,
-	isLandscape,
-	isLandscape,
-	isPortrait,
-	isLandscape,
-	isLandscape,
-	isLandscape,
-] );
-const longSymmetricRowIsNotRecent = isNotRecentShape( [ 3, 1, 3 ], 5 );
-const symmetricRowFitsNextImages = checkNextRatios( [
-	isPortrait,
-	isLandscape,
-	isLandscape,
-	isPortrait,
-] );
-const symmetricRowIsNotRecent = isNotRecentShape( [ 1, 2, 1 ], 5 );
-const oneThreeFitsNextImages = checkNextRatios( [
-	isPortrait,
-	isLandscape,
-	isLandscape,
-	isLandscape,
-] );
-const oneThreeIsNotRecent = isNotRecentShape( [ 1, 3 ], 3 );
-const threeOneIsFitsNextImages = checkNextRatios( [
-	isLandscape,
-	isLandscape,
-	isLandscape,
-	isPortrait,
-] );
-const threeOneIsNotRecent = isNotRecentShape( [ 3, 1 ], 3 );
-const oneTwoFitsNextImages = checkNextRatios( [
-	lt( 1.6 ),
-	overEvery( gte( 0.9 ), lt( 2 ) ),
-	overEvery( gte( 0.9 ), lt( 2 ) ),
-] );
-const oneTwoIsNotRecent = isNotRecentShape( [ 1, 2 ], 3 );
-const fiveIsNotRecent = isNotRecentShape( [ 1, 1, 1, 1, 1 ], 1 );
-const fourIsNotRecent = isNotRecentShape( [ 1, 1, 1, 1 ], 1 );
-const threeIsNotRecent = isNotRecentShape( [ 1, 1, 1 ], 3 );
-const twoOneFitsNextImages = checkNextRatios( [
-	overEvery( gte( 0.9 ), lt( 2 ) ),
-	overEvery( gte( 0.9 ), lt( 2 ) ),
-	lt( 1.6 ),
-] );
-const twoOneIsNotRecent = isNotRecentShape( [ 2, 1 ], 3 );
-const panoramicFitsNextImages = checkNextRatios( [ isPanoramic ] );
-
-export function ratiosToMosaicRows( ratios, { isWide } = {} ) {
-	// This function will recursively process the input until it is consumed
-	const go = ( processed, toProcess ) => {
-		if ( ! toProcess.length ) {
-			return processed;
-		}
-
-		let next;
-
-		if (
-			/* Reverse_Symmetric_Row */
-			toProcess.length > 15 &&
-			reverseSymmetricFitsNextImages( toProcess ) &&
-			reverseSymmetricRowIsNotRecent( processed )
-		) {
-			next = [ 2, 1, 2 ];
-		} else if (
-			/* Long_Symmetric_Row */
-			toProcess.length > 15 &&
-			longSymmetricRowFitsNextImages( toProcess ) &&
-			longSymmetricRowIsNotRecent( processed )
-		) {
-			next = [ 3, 1, 3 ];
-		} else if (
-			/* Symmetric_Row */
-			toProcess.length !== 5 &&
-			symmetricRowFitsNextImages( toProcess ) &&
-			symmetricRowIsNotRecent( processed )
-		) {
-			next = [ 1, 2, 1 ];
-		} else if (
-			/* One_Three */
-			oneThreeFitsNextImages( toProcess ) &&
-			oneThreeIsNotRecent( processed )
-		) {
-			next = [ 1, 3 ];
-		} else if (
-			/* Three_One */
-			threeOneIsFitsNextImages( toProcess ) &&
-			threeOneIsNotRecent( processed )
-		) {
-			next = [ 3, 1 ];
-		} else if (
-			/* One_Two */
-			oneTwoFitsNextImages( toProcess ) &&
-			oneTwoIsNotRecent( processed )
-		) {
-			next = [ 1, 2 ];
-		} else if (
-			/* Five */
-			isWide &&
-			( toProcess.length === 5 || ( toProcess.length !== 10 && toProcess.length > 6 ) ) &&
-			fiveIsNotRecent( processed ) &&
-			sum( take( toProcess, 5 ) ) < 5
-		) {
-			next = [ 1, 1, 1, 1, 1 ];
-		} else if (
-			/* Four */
-			isFourValidCandidate( processed, toProcess )
-		) {
-			next = [ 1, 1, 1, 1 ];
-		} else if (
-			/* Three */
-			isThreeValidCandidate( processed, toProcess, isWide )
-		) {
-			next = [ 1, 1, 1 ];
-		} else if (
-			/* Two_One */
-			twoOneFitsNextImages( toProcess ) &&
-			twoOneIsNotRecent( processed )
-		) {
-			next = [ 2, 1 ];
-		} else if ( /* Panoramic */ panoramicFitsNextImages( toProcess ) ) {
-			next = [ 1 ];
-		} else if ( /* One_One */ toProcess.length > 3 ) {
-			next = [ 1, 1 ];
-		} else {
-			// Everything left
-			next = Array( toProcess.length ).fill( 1 );
-		}
-
-		// Add row
-		const nextProcessed = processed.concat( [ next ] );
-
-		// Trim consumed images from next processing step
-		const consumedImages = sum( next );
-		const nextToProcess = toProcess.slice( consumedImages );
-
-		return go( nextProcessed, nextToProcess );
-	};
-	return go( [], ratios );
-}
-
-function isThreeValidCandidate( processed, toProcess, isWide ) {
-	const ratio = sum( take( toProcess, 3 ) );
-	return (
-		toProcess.length >= 3 &&
-		toProcess.length !== 4 &&
-		toProcess.length !== 6 &&
-		threeIsNotRecent( processed ) &&
-		( ratio < 2.5 ||
-			( ratio < 5 &&
-				/* nextAreSymettric */
-				( toProcess.length >= 3 &&
-					/* @FIXME floating point equality?? */ toProcess[ 0 ] === toProcess[ 2 ] ) ) ||
-			isWide )
-	);
-}
-
-function isFourValidCandidate( processed, toProcess ) {
-	const ratio = sum( take( toProcess, 4 ) );
-	return (
-		( fourIsNotRecent( processed ) && ( ratio < 3.5 && toProcess.length > 5 ) ) ||
-		( ratio < 7 && toProcess.length === 4 )
-	);
-}
-
-function isNotRecentShape( shape, numRecents ) {
-	return recents =>
-		! some( takeRight( recents, numRecents ), recentShape => isEqual( recentShape, shape ) );
-}
-
-function checkNextRatios( shape ) {
-	return ratios =>
-		ratios.length >= shape.length &&
-		every( zipWith( shape, ratios.slice( 0, shape.length ), ( f, r ) => f( r ) ) );
-}
-
-function isLandscape( ratio ) {
-	return ratio >= 1 && ratio < 2;
-}
-
-function isPortrait( ratio ) {
-	return ratio < 1;
-}
-
-function isPanoramic( ratio ) {
-	return ratio >= 2;
-}
-
-// >=
-function gte( n ) {
-	return m => m >= n;
-}
-
-// <
-function lt( n ) {
-	return m => m < n;
-}
diff --git a/plugins/jetpack/extensions/blocks/tiled-gallery/deprecated/v1/layout/mosaic/resize.js b/plugins/jetpack/extensions/blocks/tiled-gallery/deprecated/v1/layout/mosaic/resize.js
deleted file mode 100644
index 022729c8..00000000
--- a/plugins/jetpack/extensions/blocks/tiled-gallery/deprecated/v1/layout/mosaic/resize.js
+++ /dev/null
@@ -1,107 +0,0 @@
-/**
- * Internal dependencies
- */
-import { GUTTER_WIDTH } from '../../constants';
-
-/**
- * Distribute a difference across ns so that their sum matches the target
- *
- * @param {Array<number>}  parts  Array of numbers to fit
- * @param {number}         target Number that sum should match
- * @return {Array<number>}        Adjusted parts
- */
-function adjustFit( parts, target ) {
-	const diff = target - parts.reduce( ( sum, n ) => sum + n, 0 );
-	const partialDiff = diff / parts.length;
-	return parts.map( p => p + partialDiff );
-}
-
-export function handleRowResize( row, width ) {
-	applyRowRatio( row, getRowRatio( row ), width );
-}
-
-function getRowRatio( row ) {
-	const result = getRowCols( row )
-		.map( getColumnRatio )
-		.reduce(
-			( [ ratioA, weightedRatioA ], [ ratioB, weightedRatioB ] ) => {
-				return [ ratioA + ratioB, weightedRatioA + weightedRatioB ];
-			},
-			[ 0, 0 ]
-		);
-	return result;
-}
-
-export function getGalleryRows( gallery ) {
-	return Array.from( gallery.querySelectorAll( '.tiled-gallery__row' ) );
-}
-
-function getRowCols( row ) {
-	return Array.from( row.querySelectorAll( '.tiled-gallery__col' ) );
-}
-
-function getColImgs( col ) {
-	return Array.from(
-		col.querySelectorAll( '.tiled-gallery__item > img, .tiled-gallery__item > a > img' )
-	);
-}
-
-function getColumnRatio( col ) {
-	const imgs = getColImgs( col );
-	const imgCount = imgs.length;
-	const ratio =
-		1 /
-		imgs.map( getImageRatio ).reduce( ( partialColRatio, imgRatio ) => {
-			return partialColRatio + 1 / imgRatio;
-		}, 0 );
-	const result = [ ratio, ratio * imgCount || 1 ];
-	return result;
-}
-
-function getImageRatio( img ) {
-	const w = parseInt( img.dataset.width, 10 );
-	const h = parseInt( img.dataset.height, 10 );
-	const result = w && ! Number.isNaN( w ) && h && ! Number.isNaN( h ) ? w / h : 1;
-	return result;
-}
-
-function applyRowRatio( row, [ ratio, weightedRatio ], width ) {
-	const rawHeight =
-		( 1 / ratio ) * ( width - GUTTER_WIDTH * ( row.childElementCount - 1 ) - weightedRatio );
-
-	applyColRatio( row, {
-		rawHeight,
-		rowWidth: width - GUTTER_WIDTH * ( row.childElementCount - 1 ),
-	} );
-}
-
-function applyColRatio( row, { rawHeight, rowWidth } ) {
-	const cols = getRowCols( row );
-
-	const colWidths = cols.map(
-		col => ( rawHeight - GUTTER_WIDTH * ( col.childElementCount - 1 ) ) * getColumnRatio( col )[ 0 ]
-	);
-
-	const adjustedWidths = adjustFit( colWidths, rowWidth );
-
-	cols.forEach( ( col, i ) => {
-		const rawWidth = colWidths[ i ];
-		const width = adjustedWidths[ i ];
-		applyImgRatio( col, {
-			colHeight: rawHeight - GUTTER_WIDTH * ( col.childElementCount - 1 ),
-			width,
-			rawWidth,
-		} );
-	} );
-}
-
-function applyImgRatio( col, { colHeight, width, rawWidth } ) {
-	const imgHeights = getColImgs( col ).map( img => rawWidth / getImageRatio( img ) );
-	const adjustedHeights = adjustFit( imgHeights, colHeight );
-
-	// Set size of col children, not the <img /> element
-	Array.from( col.children ).forEach( ( item, i ) => {
-		const height = adjustedHeights[ i ];
-		item.setAttribute( 'style', `height:${ height }px;width:${ width }px;` );
-	} );
-}
diff --git a/plugins/jetpack/extensions/blocks/tiled-gallery/deprecated/v1/layout/row.js b/plugins/jetpack/extensions/blocks/tiled-gallery/deprecated/v1/layout/row.js
deleted file mode 100644
index 200a58c2..00000000
--- a/plugins/jetpack/extensions/blocks/tiled-gallery/deprecated/v1/layout/row.js
+++ /dev/null
@@ -1,8 +0,0 @@
-/**
- * External dependencies
- */
-import classnames from 'classnames';
-
-export default function Row( { children, className } ) {
-	return <div className={ classnames( 'tiled-gallery__row', className ) }>{ children }</div>;
-}
diff --git a/plugins/jetpack/extensions/blocks/tiled-gallery/deprecated/v1/layout/square.js b/plugins/jetpack/extensions/blocks/tiled-gallery/deprecated/v1/layout/square.js
deleted file mode 100644
index 2a1ab888..00000000
--- a/plugins/jetpack/extensions/blocks/tiled-gallery/deprecated/v1/layout/square.js
+++ /dev/null
@@ -1,33 +0,0 @@
-/**
- * External dependencies
- */
-import { chunk, drop, take } from 'lodash';
-
-/**
- * Internal dependencies
- */
-import Row from './row';
-import Column from './column';
-import Gallery from './gallery';
-import { MAX_COLUMNS } from '../constants';
-
-export default function Square( { columns, renderedImages } ) {
-	const columnCount = Math.min( MAX_COLUMNS, columns );
-
-	const remainder = renderedImages.length % columnCount;
-
-	return (
-		<Gallery>
-			{ [
-				...( remainder ? [ take( renderedImages, remainder ) ] : [] ),
-				...chunk( drop( renderedImages, remainder ), columnCount ),
-			].map( ( imagesInRow, rowIndex ) => (
-				<Row key={ rowIndex } className={ `columns-${ imagesInRow.length }` }>
-					{ imagesInRow.map( ( image, colIndex ) => (
-						<Column key={ colIndex }>{ image }</Column>
-					) ) }
-				</Row>
-			) ) }
-		</Gallery>
-	);
-}
diff --git a/plugins/jetpack/extensions/blocks/tiled-gallery/deprecated/v1/save.js b/plugins/jetpack/extensions/blocks/tiled-gallery/deprecated/v1/save.js
deleted file mode 100644
index 2a157a30..00000000
--- a/plugins/jetpack/extensions/blocks/tiled-gallery/deprecated/v1/save.js
+++ /dev/null
@@ -1,31 +0,0 @@
-/**
- * Internal dependencies
- */
-import Layout from './layout';
-import { getActiveStyleName } from '../../../../shared/block-styles';
-import { LAYOUT_STYLES } from './constants';
-
-export function defaultColumnsNumber( attributes ) {
-	return Math.min( 3, attributes.images.length );
-}
-
-export default function TiledGallerySave( { attributes } ) {
-	const { images } = attributes;
-
-	if ( ! images.length ) {
-		return null;
-	}
-
-	const { align, className, columns = defaultColumnsNumber( attributes ), linkTo } = attributes;
-
-	return (
-		<Layout
-			align={ align }
-			className={ className }
-			columns={ columns }
-			images={ images }
-			layoutStyle={ getActiveStyleName( LAYOUT_STYLES, className ) }
-			linkTo={ linkTo }
-		/>
-	);
-}
diff --git a/plugins/jetpack/extensions/blocks/tiled-gallery/edit.js b/plugins/jetpack/extensions/blocks/tiled-gallery/edit.js
deleted file mode 100644
index 45574252..00000000
--- a/plugins/jetpack/extensions/blocks/tiled-gallery/edit.js
+++ /dev/null
@@ -1,289 +0,0 @@
-/**
- * External Dependencies
- */
-import { __ } from '@wordpress/i18n';
-import { Component, Fragment } from '@wordpress/element';
-import { filter, get, pick } from 'lodash';
-import {
-	BlockControls,
-	BlockIcon,
-	InspectorControls,
-	MediaPlaceholder,
-	MediaUpload,
-	mediaUpload,
-} from '@wordpress/editor';
-import {
-	DropZone,
-	FormFileUpload,
-	IconButton,
-	PanelBody,
-	RangeControl,
-	SelectControl,
-	Toolbar,
-	withNotices,
-} from '@wordpress/components';
-
-/**
- * Internal dependencies
- */
-import FilterToolbar from './filter-toolbar';
-import Layout from './layout';
-import { ALLOWED_MEDIA_TYPES, LAYOUT_STYLES, MAX_COLUMNS } from './constants';
-import { getActiveStyleName } from '../../shared/block-styles';
-import { icon } from '.';
-
-const linkOptions = [
-	{ value: 'attachment', label: __( 'Attachment Page', 'jetpack' ) },
-	{ value: 'media', label: __( 'Media File', 'jetpack' ) },
-	{ value: 'none', label: __( 'None', 'jetpack' ) },
-];
-
-// @TODO keep here or move to ./layout ?
-function layoutSupportsColumns( layout ) {
-	return [ 'columns', 'circle', 'square' ].includes( layout );
-}
-
-export function defaultColumnsNumber( attributes ) {
-	return Math.min( 3, attributes.images.length );
-}
-
-export const pickRelevantMediaFiles = image => {
-	const imageProps = pick( image, [ [ 'alt' ], [ 'id' ], [ 'link' ] ] );
-	imageProps.url =
-		get( image, [ 'sizes', 'large', 'url' ] ) ||
-		get( image, [ 'media_details', 'sizes', 'large', 'source_url' ] ) ||
-		image.url;
-	return imageProps;
-};
-
-class TiledGalleryEdit extends Component {
-	state = {
-		selectedImage: null,
-	};
-
-	static getDerivedStateFromProps( props, state ) {
-		// Deselect images when deselecting the block
-		if ( ! props.isSelected && null !== state.selectedImage ) {
-			return { selectedImage: null };
-		}
-		return null;
-	}
-
-	setAttributes( attributes ) {
-		if ( attributes.ids ) {
-			throw new Error(
-				'The "ids" attribute should not be changed directly. It is managed automatically when "images" attribute changes'
-			);
-		}
-
-		if ( attributes.images ) {
-			attributes = {
-				...attributes,
-				ids: attributes.images.map( ( { id } ) => parseInt( id, 10 ) ),
-			};
-		}
-
-		this.props.setAttributes( attributes );
-	}
-
-	addFiles = files => {
-		const currentImages = this.props.attributes.images || [];
-		const { noticeOperations } = this.props;
-		mediaUpload( {
-			allowedTypes: ALLOWED_MEDIA_TYPES,
-			filesList: files,
-			onFileChange: images => {
-				const imagesNormalized = images.map( image => pickRelevantMediaFiles( image ) );
-				this.setAttributes( { images: currentImages.concat( imagesNormalized ) } );
-			},
-			onError: noticeOperations.createErrorNotice,
-		} );
-	};
-
-	onRemoveImage = index => () => {
-		const images = filter( this.props.attributes.images, ( img, i ) => index !== i );
-		const { columns } = this.props.attributes;
-		this.setState( {
-			selectedImage: null,
-		} );
-		this.setAttributes( {
-			images,
-			columns: columns ? Math.min( images.length, columns ) : columns,
-		} );
-	};
-
-	onSelectImage = index => () => {
-		if ( this.state.selectedImage !== index ) {
-			this.setState( {
-				selectedImage: index,
-			} );
-		}
-	};
-
-	onSelectImages = images => {
-		const { columns } = this.props.attributes;
-		this.setAttributes( {
-			columns: columns ? Math.min( images.length, columns ) : columns,
-			images: images.map( image => pickRelevantMediaFiles( image ) ),
-		} );
-	};
-
-	setColumnsNumber = value => this.setAttributes( { columns: value } );
-
-	setImageAttributes = index => attributes => {
-		const {
-			attributes: { images },
-		} = this.props;
-		if ( ! images[ index ] ) {
-			return;
-		}
-		this.setAttributes( {
-			images: [
-				...images.slice( 0, index ),
-				{ ...images[ index ], ...attributes },
-				...images.slice( index + 1 ),
-			],
-		} );
-	};
-
-	setLinkTo = value => this.setAttributes( { linkTo: value } );
-
-	uploadFromFiles = event => this.addFiles( event.target.files );
-
-	render() {
-		const { selectedImage } = this.state;
-		const {
-			attributes,
-			isSelected,
-			className,
-			noticeOperations,
-			noticeUI,
-			setAttributes,
-		} = this.props;
-		const {
-			align,
-			columns = defaultColumnsNumber( attributes ),
-			imageFilter,
-			images,
-			linkTo,
-		} = attributes;
-
-		const dropZone = <DropZone onFilesDrop={ this.addFiles } />;
-
-		const controls = (
-			<BlockControls>
-				{ !! images.length && (
-					<Fragment>
-						<Toolbar>
-							<MediaUpload
-								onSelect={ this.onSelectImages }
-								allowedTypes={ ALLOWED_MEDIA_TYPES }
-								multiple
-								gallery
-								value={ images.map( img => img.id ) }
-								render={ ( { open } ) => (
-									<IconButton
-										className="components-toolbar__control"
-										label={ __( 'Edit Gallery', 'jetpack' ) }
-										icon="edit"
-										onClick={ open }
-									/>
-								) }
-							/>
-						</Toolbar>
-						<FilterToolbar
-							value={ imageFilter }
-							onChange={ value => {
-								setAttributes( { imageFilter: value } );
-								this.setState( { selectedImage: null } );
-							} }
-						/>
-					</Fragment>
-				) }
-			</BlockControls>
-		);
-
-		if ( images.length === 0 ) {
-			return (
-				<Fragment>
-					{ controls }
-					<MediaPlaceholder
-						icon={ <BlockIcon icon={ icon } /> }
-						className={ className }
-						labels={ {
-							title: __( 'Tiled Gallery', 'jetpack' ),
-							name: __( 'images', 'jetpack' ),
-						} }
-						onSelect={ this.onSelectImages }
-						accept="image/*"
-						allowedTypes={ ALLOWED_MEDIA_TYPES }
-						multiple
-						notices={ noticeUI }
-						onError={ noticeOperations.createErrorNotice }
-					/>
-				</Fragment>
-			);
-		}
-
-		const layoutStyle = getActiveStyleName( LAYOUT_STYLES, attributes.className );
-
-		return (
-			<Fragment>
-				{ controls }
-				<InspectorControls>
-					<PanelBody title={ __( 'Tiled Gallery settings', 'jetpack' ) }>
-						{ layoutSupportsColumns( layoutStyle ) && images.length > 1 && (
-							<RangeControl
-								label={ __( 'Columns', 'jetpack' ) }
-								value={ columns }
-								onChange={ this.setColumnsNumber }
-								min={ 1 }
-								max={ Math.min( MAX_COLUMNS, images.length ) }
-							/>
-						) }
-						<SelectControl
-							label={ __( 'Link To', 'jetpack' ) }
-							value={ linkTo }
-							onChange={ this.setLinkTo }
-							options={ linkOptions }
-						/>
-					</PanelBody>
-				</InspectorControls>
-
-				{ noticeUI }
-
-				<Layout
-					align={ align }
-					className={ className }
-					columns={ columns }
-					imageFilter={ imageFilter }
-					images={ images }
-					layoutStyle={ layoutStyle }
-					linkTo={ linkTo }
-					onRemoveImage={ this.onRemoveImage }
-					onSelectImage={ this.onSelectImage }
-					selectedImage={ isSelected ? selectedImage : null }
-					setImageAttributes={ this.setImageAttributes }
-				>
-					{ dropZone }
-					{ isSelected && (
-						<div className="tiled-gallery__add-item">
-							<FormFileUpload
-								multiple
-								isLarge
-								className="tiled-gallery__add-item-button"
-								onChange={ this.uploadFromFiles }
-								accept="image/*"
-								icon="insert"
-							>
-								{ __( 'Upload an image', 'jetpack' ) }
-							</FormFileUpload>
-						</div>
-					) }
-				</Layout>
-			</Fragment>
-		);
-	}
-}
-
-export default withNotices( TiledGalleryEdit );
diff --git a/plugins/jetpack/extensions/blocks/tiled-gallery/editor.js b/plugins/jetpack/extensions/blocks/tiled-gallery/editor.js
deleted file mode 100644
index d05f4039..00000000
--- a/plugins/jetpack/extensions/blocks/tiled-gallery/editor.js
+++ /dev/null
@@ -1,7 +0,0 @@
-/**
- * Internal dependencies
- */
-import registerJetpackBlock from '../../shared/register-jetpack-block';
-import { name, settings } from '.';
-
-registerJetpackBlock( name, settings );
diff --git a/plugins/jetpack/extensions/blocks/tiled-gallery/editor.scss b/plugins/jetpack/extensions/blocks/tiled-gallery/editor.scss
deleted file mode 100644
index 7663d70c..00000000
--- a/plugins/jetpack/extensions/blocks/tiled-gallery/editor.scss
+++ /dev/null
@@ -1,148 +0,0 @@
-@import './view.scss';
-@import './variables.scss';
-@import '../../shared/styles/gutenberg-colors.scss';
-
-// inspired by from assets/shared/_animations loading-fade
-@keyframes tiled-gallery-img-placeholder {
-	0% {
-		background-color: var( --color-neutral-0 );
-	}
-	50% {
-		background-color: rgba( var( --color-neutral-0-rgb ), 0.5 );
-	}
-	100% {
-		background-color: var( --color-neutral-0 );
-	}
-}
-
-.wp-block-jetpack-tiled-gallery {
-	// Ensure that selected image outlines are visibile
-	padding-left: 4px;
-	padding-right: 4px;
-
-	&.is-style-square,
-	&.is-style-circle {
-		.tiled-gallery__item.is-transient img {
-			// Transient images (no src attribute) occupy no vertical space.
-			// If on a row by themself, the row is hidden.
-			// By setting the bottom margin, ensure they occupy the correct vertical space.
-			margin-bottom: 100%;
-		}
-	}
-
-	.tiled-gallery__item {
-		// Hide the focus outline that otherwise briefly appears when selecting a block.
-		> img:focus {
-			outline: none;
-		}
-
-		> img {
-			// Inspired by Calypso's placeholder mixin
-			animation: tiled-gallery-img-placeholder 1.6s ease-in-out infinite;
-		}
-
-		&.is-selected {
-			outline: 4px solid $tiled-gallery-selection;
-
-			// Disable filters when selected
-			filter: none;
-			&::before,
-			&::after {
-				content: none;
-			}
-		}
-
-		&.is-transient {
-			height: 100%;
-			width: 100%;
-			img {
-				background-position: center;
-				background-size: cover;
-				height: 100%;
-				opacity: 0.3;
-				width: 100%;
-			}
-		}
-	}
-
-	.tiled-gallery__add-item {
-		margin-top: $tiled-gallery-gutter;
-		width: 100%;
-
-		.components-form-file-upload,
-		.components-button.tiled-gallery__add-item-button {
-			width: 100%;
-			height: 100%;
-		}
-
-		.components-button.tiled-gallery__add-item-button {
-			display: flex;
-			flex-direction: column;
-			justify-content: center;
-			box-shadow: none;
-			border: none;
-			border-radius: 0;
-			min-height: 100px;
-
-			.dashicon {
-				margin-top: 10px;
-			}
-
-			&:hover,
-			&:focus {
-				border: 1px solid $dark-gray-500;
-			}
-		}
-	}
-
-	.tiled-gallery__item__inline-menu {
-		background-color: $tiled-gallery-selection;
-		display: inline-flex;
-		padding: 0 0 2px 2px;
-		position: absolute;
-		right: 0;
-		top: 0;
-
-		.components-button {
-			color: var( --color-white );
-			&:hover,
-			&:focus {
-				color: var( --color-white );
-			}
-		}
-	}
-
-	.tiled-gallery__item__remove {
-		padding: 0;
-	}
-
-	.tiled-gallery__item .components-spinner {
-		position: absolute;
-		top: 50%;
-		left: 50%;
-		margin: 0;
-		transform: translate( -50%, -50% );
-	}
-
-	// Hide upload buttons in style picker preview
-	.editor-block-preview__content & {
-		.editor-media-placeholder {
-			display: none;
-		}
-	}
-}
-
-.tiled-gallery__filter-picker-menu {
-	$active-item-outline-width: 2px;
-	padding: 7px;
-
-	// Leave space between elements for active state styling
-	.components-menu-item__button + .components-menu-item__button {
-		margin-top: $active-item-outline-width;
-	}
-
-	.components-menu-item__button.is-active {
-		color: $dark-gray-900;
-		box-shadow: 0 0 0 $active-item-outline-width $dark-gray-500 !important;
-	}
-}
diff --git a/plugins/jetpack/extensions/blocks/tiled-gallery/filter-toolbar.js b/plugins/jetpack/extensions/blocks/tiled-gallery/filter-toolbar.js
deleted file mode 100644
index 7d86f335..00000000
--- a/plugins/jetpack/extensions/blocks/tiled-gallery/filter-toolbar.js
+++ /dev/null
@@ -1,136 +0,0 @@
-/**
- * External Dependencies
- */
-import { __, _x } from '@wordpress/i18n';
-import { Dropdown, MenuItem, NavigableMenu, Path, SVG, Toolbar } from '@wordpress/components';
-
-const availableFilters = [
-	{
-		icon: (
-			/* No filter */
-			<SVG xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
-				<Path fill="none" d="M0 0h24v24H0V0z" />
-				<Path d="M3 5H1v16c0 1.1.9 2 2 2h16v-2H3V5zm18-4H7c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V3c0-1.1-.9-2-2-2zm0 16H7V3h14v14z" />
-			</SVG>
-		),
-		title: _x( 'Original', 'image style', 'jetpack' ),
-		value: undefined,
-	},
-	{
-		icon: (
-			/* 1 */
-			<SVG xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
-				<Path fill="none" d="M0 0h24v24H0V0z" />
-				<Path d="M3 5H1v16c0 1.1.9 2 2 2h16v-2H3V5zm11 10h2V5h-4v2h2v8zm7-14H7c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V3c0-1.1-.9-2-2-2zm0 16H7V3h14v14z" />
-			</SVG>
-		),
-		title: _x( 'Black and White', 'image style', 'jetpack' ),
-		value: 'black-and-white',
-	},
-	{
-		icon: (
-			/* 2 */
-			<SVG xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
-				<Path fill="none" d="M0 0h24v24H0V0z" />
-				<Path d="M3 5H1v16c0 1.1.9 2 2 2h16v-2H3V5zm18-4H7c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V3c0-1.1-.9-2-2-2zm0 16H7V3h14v14zm-4-4h-4v-2h2c1.1 0 2-.89 2-2V7c0-1.11-.9-2-2-2h-4v2h4v2h-2c-1.1 0-2 .89-2 2v4h6v-2z" />
-			</SVG>
-		),
-		title: _x( 'Sepia', 'image style', 'jetpack' ),
-		value: 'sepia',
-	},
-	{
-		icon: (
-			/* 3 */
-			<SVG xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
-				<Path fill="none" d="M0 0h24v24H0V0z" />
-				<Path d="M21 1H7c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V3c0-1.1-.9-2-2-2zm0 16H7V3h14v14zM3 5H1v16c0 1.1.9 2 2 2h16v-2H3V5zm14 8v-1.5c0-.83-.67-1.5-1.5-1.5.83 0 1.5-.67 1.5-1.5V7c0-1.11-.9-2-2-2h-4v2h4v2h-2v2h2v2h-4v2h4c1.1 0 2-.89 2-2z" />
-			</SVG>
-		),
-		title: '1977',
-		value: '1977',
-	},
-	{
-		icon: (
-			/* 4 */
-			<SVG xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
-				<Path fill="none" d="M0 0h24v24H0V0z" />
-				<Path d="M3 5H1v16c0 1.1.9 2 2 2h16v-2H3V5zm12 10h2V5h-2v4h-2V5h-2v6h4v4zm6-14H7c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V3c0-1.1-.9-2-2-2zm0 16H7V3h14v14z" />
-			</SVG>
-		),
-		title: _x( 'Clarendon', 'image style', 'jetpack' ),
-		value: 'clarendon',
-	},
-	{
-		icon: (
-			/* 5 */
-			<SVG xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
-				<Path fill="none" d="M0 0h24v24H0z" />
-				<Path d="M21 1H7c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V3c0-1.1-.9-2-2-2zm0 16H7V3h14v14zM3 5H1v16c0 1.1.9 2 2 2h16v-2H3V5zm14 8v-2c0-1.11-.9-2-2-2h-2V7h4V5h-6v6h4v2h-4v2h4c1.1 0 2-.89 2-2z" />
-			</SVG>
-		),
-		title: _x( 'Gingham', 'image style', 'jetpack' ),
-		value: 'gingham',
-	},
-];
-
-const label = __( 'Pick an image filter', 'jetpack' );
-
-export default function FilterToolbar( { value, onChange } ) {
-	return (
-		<Dropdown
-			position="bottom right"
-			className="editor-block-switcher"
-			contentClassName="editor-block-switcher__popover"
-			renderToggle={ ( { onToggle, isOpen } ) => {
-				return (
-					<Toolbar
-						controls={ [
-							{
-								onClick: onToggle,
-								extraProps: {
-									'aria-haspopup': 'true',
-									'aria-expanded': isOpen,
-								},
-								title: label,
-								tooltip: label,
-								icon: (
-									<SVG
-										xmlns="http://www.w3.org/2000/svg"
-										width="24"
-										height="24"
-										viewBox="0 0 24 24"
-									>
-										<Path fill="none" d="M0 0h24v24H0V0z" />
-										<Path d="M19 10v9H4.98V5h9V3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2v-9h-2zm-2.94-2.06L17 10l.94-2.06L20 7l-2.06-.94L17 4l-.94 2.06L14 7zM12 8l-1.25 2.75L8 12l2.75 1.25L12 16l1.25-2.75L16 12l-2.75-1.25z" />
-									</SVG>
-								),
-							},
-						] }
-					/>
-				);
-			} }
-			renderContent={ ( { onClose } ) => {
-				const applyOrUnset = nextValue => () => {
-					onChange( value === nextValue ? undefined : nextValue );
-					onClose();
-				};
-				return (
-					<NavigableMenu className="tiled-gallery__filter-picker-menu">
-						{ availableFilters.map( ( { icon, title, value: filterValue } ) => (
-							<MenuItem
-								className={ value === filterValue ? 'is-active' : undefined }
-								icon={ icon }
-								isSelected={ value === filterValue }
-								key={ filterValue || 'original' }
-								onClick={ applyOrUnset( filterValue ) }
-								role="menuitemcheckbox"
-							>
-								{ title }
-							</MenuItem>
-						) ) }
-					</NavigableMenu>
-				);
-			} }
-		/>
-	);
-}
diff --git a/plugins/jetpack/extensions/blocks/tiled-gallery/gallery-image/edit.js b/plugins/jetpack/extensions/blocks/tiled-gallery/gallery-image/edit.js
deleted file mode 100644
index e4d77349..00000000
--- a/plugins/jetpack/extensions/blocks/tiled-gallery/gallery-image/edit.js
+++ /dev/null
@@ -1,147 +0,0 @@
-/**
- * External Dependencies
- */
-import classnames from 'classnames';
-import { __ } from '@wordpress/i18n';
-import { BACKSPACE, DELETE } from '@wordpress/keycodes';
-import { Component, createRef, Fragment } from '@wordpress/element';
-import { IconButton, Spinner } from '@wordpress/components';
-import { isBlobURL } from '@wordpress/blob';
-import { withSelect } from '@wordpress/data';
-
-class GalleryImageEdit extends Component {
-	img = createRef();
-
-	onImageClick = () => {
-		if ( ! this.props.isSelected ) {
-			this.props.onSelect();
-		}
-	};
-
-	onImageKeyDown = event => {
-		if (
-			this.img.current === document.activeElement &&
-			this.props.isSelected &&
-			[ BACKSPACE, DELETE ].includes( event.keyCode )
-		) {
-			this.props.onRemove();
-		}
-	};
-
-	componentDidUpdate() {
-		const { alt, height, image, link, url, width } = this.props;
-
-		if ( image ) {
-			const nextAtts = {};
-
-			if ( ! alt && image.alt_text ) {
-				nextAtts.alt = image.alt_text;
-			}
-			if ( ! height && image.media_details && image.media_details.height ) {
-				nextAtts.height = +image.media_details.height;
-			}
-			if ( ! link && image.link ) {
-				nextAtts.link = image.link;
-			}
-			if ( ! url && image.source_url ) {
-				nextAtts.url = image.source_url;
-			}
-			if ( ! width && image.media_details && image.media_details.width ) {
-				nextAtts.width = +image.media_details.width;
-			}
-
-			if ( Object.keys( nextAtts ).length ) {
-				this.props.setAttributes( nextAtts );
-			}
-		}
-	}
-
-	render() {
-		const {
-			'aria-label': ariaLabel,
-			alt,
-			height,
-			id,
-			imageFilter,
-			isSelected,
-			link,
-			linkTo,
-			onRemove,
-			origUrl,
-			url,
-			width,
-		} = this.props;
-
-		let href;
-
-		switch ( linkTo ) {
-			case 'media':
-				href = url;
-				break;
-			case 'attachment':
-				href = link;
-				break;
-		}
-
-		const isTransient = isBlobURL( origUrl );
-
-		const img = (
-			// Disable reason: Image itself is not meant to be interactive, but should
-			// direct image selection and unfocus caption fields.
-			/* eslint-disable jsx-a11y/no-noninteractive-element-interactions, jsx-a11y/no-noninteractive-tabindex */
-			<Fragment>
-				<img
-					alt={ alt }
-					aria-label={ ariaLabel }
-					data-height={ height }
-					data-id={ id }
-					data-link={ link }
-					data-url={ origUrl }
-					data-width={ width }
-					onClick={ this.onImageClick }
-					onKeyDown={ this.onImageKeyDown }
-					ref={ this.img }
-					src={ isTransient ? undefined : url }
-					tabIndex="0"
-					style={ isTransient ? { backgroundImage: `url(${ url })` } : undefined }
-				/>
-				{ isTransient && <Spinner /> }
-			</Fragment>
-			/* eslint-enable jsx-a11y/no-noninteractive-element-interactions, jsx-a11y/no-noninteractive-tabindex */
-		);
-
-		// Disable reason: Each block can be selected by clicking on it and we should keep the same saved markup
-		return (
-			<figure
-				className={ classnames( 'tiled-gallery__item', {
-					'is-selected': isSelected,
-					'is-transient': isTransient,
-					[ `filter__${ imageFilter }` ]: !! imageFilter,
-				} ) }
-			>
-				{ isSelected && (
-					<div className="tiled-gallery__item__inline-menu">
-						<IconButton
-							icon="no-alt"
-							onClick={ onRemove }
-							className="tiled-gallery__item__remove"
-							label={ __( 'Remove Image', 'jetpack' ) }
-						/>
-					</div>
-				) }
-				{ /* Keep the <a> HTML structure, but ensure there is no navigation from edit */
-				/* eslint-disable-next-line jsx-a11y/anchor-is-valid */ }
-				{ href ? <a>{ img }</a> : img }
-			</figure>
-		);
-	}
-}
-
-export default withSelect( ( select, ownProps ) => {
-	const { getMedia } = select( 'core' );
-	const { id } = ownProps;
-
-	return {
-		image: id ? getMedia( id ) : null,
-	};
-} )( GalleryImageEdit );
diff --git a/plugins/jetpack/extensions/blocks/tiled-gallery/gallery-image/save.js b/plugins/jetpack/extensions/blocks/tiled-gallery/gallery-image/save.js
deleted file mode 100644
index 347a6f85..00000000
--- a/plugins/jetpack/extensions/blocks/tiled-gallery/gallery-image/save.js
+++ /dev/null
@@ -1,46 +0,0 @@
-/**
- * External Dependencies
- */
-import classnames from 'classnames';
-import { isBlobURL } from '@wordpress/blob';
-
-export default function GalleryImageSave( props ) {
-	const { alt, imageFilter, height, id, link, linkTo, origUrl, url, width } = props;
-
-	if ( isBlobURL( origUrl ) ) {
-		return null;
-	}
-
-	let href;
-
-	switch ( linkTo ) {
-		case 'media':
-			href = url;
-			break;
-		case 'attachment':
-			href = link;
-			break;
-	}
-
-	const img = (
-		<img
-			alt={ alt }
-			data-height={ height }
-			data-id={ id }
-			data-link={ link }
-			data-url={ origUrl }
-			data-width={ width }
-			src={ url }
-		/>
-	);
-
-	return (
-		<figure
-			className={ classnames( 'tiled-gallery__item', {
-				[ `filter__${ imageFilter }` ]: !! imageFilter,
-			} ) }
-		>
-			{ href ? <a href={ href }>{ img }</a> : img }
-		</figure>
-	);
-}
diff --git a/plugins/jetpack/extensions/blocks/tiled-gallery/index.js b/plugins/jetpack/extensions/blocks/tiled-gallery/index.js
deleted file mode 100644
index 42079113..00000000
--- a/plugins/jetpack/extensions/blocks/tiled-gallery/index.js
+++ /dev/null
@@ -1,212 +0,0 @@
-/**
- * External dependencies
- */
-import { __, _x } from '@wordpress/i18n';
-import { createBlock } from '@wordpress/blocks';
-import { filter } from 'lodash';
-import { Path, SVG } from '@wordpress/components';
-
-/**
- * Internal dependencies
- */
-import edit from './edit';
-import save from './save';
-import {
-	LAYOUT_CIRCLE,
-	LAYOUT_COLUMN,
-	LAYOUT_DEFAULT,
-	LAYOUT_SQUARE,
-	LAYOUT_STYLES,
-} from './constants';
-
-/**
- * Style dependencies
- */
-import './editor.scss';
-
-import * as deprecatedV1 from './deprecated/v1';
-
-// Style names are translated. Avoid introducing an i18n dependency elsewhere (view)
-// by only including the labels here, the only place they're needed.
-//
-// Map style names to labels and merge them together.
-const styleNames = {
-	[ LAYOUT_DEFAULT ]: _x( 'Tiled mosaic', 'Tiled gallery layout', 'jetpack' ),
-	[ LAYOUT_CIRCLE ]: _x( 'Circles', 'Tiled gallery layout', 'jetpack' ),
-	[ LAYOUT_COLUMN ]: _x( 'Tiled columns', 'Tiled gallery layout', 'jetpack' ),
-	[ LAYOUT_SQUARE ]: _x( 'Square tiles', 'Tiled gallery layout', 'jetpack' ),
-};
-const layoutStylesWithLabels = LAYOUT_STYLES.map( style => ( {
-	...style,
-	label: styleNames[ style.name ],
-} ) );
-
-/**
- * Filter valid images
- *
- * @param {array} images Array of image objects
- * @return {array} Array of image objects which have id and url
- */
-function getValidImages( images ) {
-	return filter( images, ( { id, url } ) => id && url );
-}
-
-const blockAttributes = {
-	// Set default align
-	align: {
-		default: 'center',
-		type: 'string',
-	},
-	// Set default className (used with block styles)
-	className: {
-		default: `is-style-${ LAYOUT_DEFAULT }`,
-		type: 'string',
-	},
-	columns: {
-		type: 'number',
-	},
-	ids: {
-		default: [],
-		type: 'array',
-	},
-	imageFilter: {
-		type: 'string',
-	},
-	images: {
-		type: 'array',
-		default: [],
-		source: 'query',
-		selector: '.tiled-gallery__item',
-		query: {
-			alt: {
-				attribute: 'alt',
-				default: '',
-				selector: 'img',
-				source: 'attribute',
-			},
-			height: {
-				attribute: 'data-height',
-				selector: 'img',
-				source: 'attribute',
-				type: 'number',
-			},
-			id: {
-				attribute: 'data-id',
-				selector: 'img',
-				source: 'attribute',
-			},
-			link: {
-				attribute: 'data-link',
-				selector: 'img',
-				source: 'attribute',
-			},
-			url: {
-				attribute: 'data-url',
-				selector: 'img',
-				source: 'attribute',
-			},
-			width: {
-				attribute: 'data-width',
-				selector: 'img',
-				source: 'attribute',
-				type: 'number',
-			},
-		},
-	},
-	linkTo: {
-		default: 'none',
-		type: 'string',
-	},
-};
-
-export const name = 'tiled-gallery';
-
-export const icon = (
-	<SVG viewBox="0 0 24 24" width={ 24 } height={ 24 }>
-		<Path
-			fill="currentColor"
-			d="M19 5v2h-4V5h4M9 5v6H5V5h4m10 8v6h-4v-6h4M9 17v2H5v-2h4M21 3h-8v6h8V3zM11 3H3v10h8V3zm10 8h-8v10h8V11zm-10 4H3v6h8v-6z"
-		/>
-	</SVG>
-);
-
-export const settings = {
-	attributes: blockAttributes,
-	category: 'jetpack',
-	description: __( 'Display multiple images in an elegantly organized tiled layout.', 'jetpack' ),
-	icon,
-	keywords: [
-		_x( 'images', 'block search term', 'jetpack' ),
-		_x( 'photos', 'block search term', 'jetpack' ),
-		_x( 'pictures', 'block search term', 'jetpack' ),
-	],
-	styles: layoutStylesWithLabels,
-	supports: {
-		align: [ 'center', 'wide', 'full' ],
-		customClassName: false,
-		html: false,
-	},
-	title: __( 'Tiled Gallery', 'jetpack' ),
-	transforms: {
-		from: [
-			{
-				type: 'block',
-				isMultiBlock: true,
-				blocks: [ 'core/image' ],
-				isMatch: images => getValidImages( images ).length > 0,
-				transform: images => {
-					const validImages = getValidImages( images );
-					return createBlock( `jetpack/${ name }`, {
-						images: validImages.map( ( { id, url, alt } ) => ( {
-							id,
-							url,
-							alt,
-						} ) ),
-						ids: validImages.map( ( { id } ) => id ),
-					} );
-				},
-			},
-			{
-				type: 'block',
-				blocks: [ 'core/gallery', 'jetpack/slideshow' ],
-				transform: ( { images } ) => {
-					const validImages = getValidImages( images );
-					if ( validImages.length > 0 ) {
-						return createBlock( `jetpack/${ name }`, {
-							images: validImages.map( ( { id, url, alt } ) => ( {
-								id,
-								url,
-								alt,
-							} ) ),
-							ids: validImages.map( ( { id } ) => id ),
-						} );
-					}
-					return createBlock( `jetpack/${ name }` );
-				},
-			},
-		],
-		to: [
-			{
-				type: 'block',
-				blocks: [ 'core/gallery' ],
-				transform: ( { images, ids, columns, linkTo } ) =>
-					createBlock( 'core/gallery', { images, ids, columns, imageCrop: true, linkTo } ),
-			},
-			{
-				type: 'block',
-				blocks: [ 'core/image' ],
-				transform: ( { align, images } ) => {
-					if ( images.length > 0 ) {
-						return images.map( ( { id, url, alt } ) =>
-							createBlock( 'core/image', { align, id, url, alt } )
-						);
-					}
-					return createBlock( 'core/image' );
-				},
-			},
-		],
-	},
-	edit,
-	save,
-	deprecated: [ deprecatedV1 ],
-};
diff --git a/plugins/jetpack/extensions/blocks/tiled-gallery/layout/column.js b/plugins/jetpack/extensions/blocks/tiled-gallery/layout/column.js
deleted file mode 100644
index a3ed5cdf..00000000
--- a/plugins/jetpack/extensions/blocks/tiled-gallery/layout/column.js
+++ /dev/null
@@ -1,3 +0,0 @@
-export default function Column( { children } ) {
-	return <div className="tiled-gallery__col">{ children }</div>;
-}
diff --git a/plugins/jetpack/extensions/blocks/tiled-gallery/layout/gallery.js b/plugins/jetpack/extensions/blocks/tiled-gallery/layout/gallery.js
deleted file mode 100644
index 94fc61e4..00000000
--- a/plugins/jetpack/extensions/blocks/tiled-gallery/layout/gallery.js
+++ /dev/null
@@ -1,7 +0,0 @@
-export default function Gallery( { children, galleryRef } ) {
-	return (
-		<div className="tiled-gallery__gallery" ref={ galleryRef }>
-			{ children }
-		</div>
-	);
-}
diff --git a/plugins/jetpack/extensions/blocks/tiled-gallery/layout/index.js b/plugins/jetpack/extensions/blocks/tiled-gallery/layout/index.js
deleted file mode 100644
index abcb5641..00000000
--- a/plugins/jetpack/extensions/blocks/tiled-gallery/layout/index.js
+++ /dev/null
@@ -1,160 +0,0 @@
-/**
- * External dependencies
- */
-import photon from 'photon';
-import { __, sprintf } from '@wordpress/i18n';
-import { Component } from '@wordpress/element';
-import { format as formatUrl, parse as parseUrl } from 'url';
-import { isBlobURL } from '@wordpress/blob';
-
-/**
- * Internal dependencies
- */
-import GalleryImageEdit from '../gallery-image/edit';
-import GalleryImageSave from '../gallery-image/save';
-import Mosaic from './mosaic';
-import Square from './square';
-import { PHOTON_MAX_RESIZE } from '../constants';
-
-export default class Layout extends Component {
-	photonize( { height, width, url } ) {
-		if ( ! url ) {
-			return;
-		}
-
-		// Do not Photonize images that are still uploading or from localhost
-		if ( isBlobURL( url ) || /^https?:\/\/localhost/.test( url ) ) {
-			return url;
-		}
-
-		// Drop query args, photon URLs can't handle them
-		// This should be the "raw" url, we'll add dimensions later
-		const cleanUrl = url.split( '?', 1 )[ 0 ];
-
-		const photonImplementation = isWpcomFilesUrl( url ) ? photonWpcomImage : photon;
-
-		const { layoutStyle } = this.props;
-
-		if ( isSquareishLayout( layoutStyle ) && width && height ) {
-			const size = Math.min( PHOTON_MAX_RESIZE, width, height );
-			return photonImplementation( cleanUrl, { resize: `${ size },${ size }` } );
-		}
-		return photonImplementation( cleanUrl );
-	}
-
-	// This is tricky:
-	// - We need to "photonize" to resize the images at appropriate dimensions
-	// - The resize will depend on the image size and the layout in some cases
-	// - Handlers need to be created by index so that the image changes can be applied correctly.
-	//   This is because the images are stored in an array in the block attributes.
-	renderImage( img, i ) {
-		const {
-			imageFilter,
-			images,
-			isSave,
-			linkTo,
-			onRemoveImage,
-			onSelectImage,
-			selectedImage,
-			setImageAttributes,
-		} = this.props;
-
-		/* translators: %1$d is the order number of the image, %2$d is the total number of images. */
-		const ariaLabel = sprintf(
-			__( 'image %1$d of %2$d in gallery', 'jetpack' ),
-			i + 1,
-			images.length
-		);
-		const Image = isSave ? GalleryImageSave : GalleryImageEdit;
-
-		return (
-			<Image
-				alt={ img.alt }
-				aria-label={ ariaLabel }
-				height={ img.height }
-				id={ img.id }
-				imageFilter={ imageFilter }
-				isSelected={ selectedImage === i }
-				key={ i }
-				link={ img.link }
-				linkTo={ linkTo }
-				onRemove={ isSave ? undefined : onRemoveImage( i ) }
-				onSelect={ isSave ? undefined : onSelectImage( i ) }
-				origUrl={ img.url }
-				setAttributes={ isSave ? undefined : setImageAttributes( i ) }
-				url={ this.photonize( img ) }
-				width={ img.width }
-			/>
-		);
-	}
-
-	render() {
-		const { align, children, className, columns, images, layoutStyle } = this.props;
-
-		const LayoutRenderer = isSquareishLayout( layoutStyle ) ? Square : Mosaic;
-
-		const renderedImages = this.props.images.map( this.renderImage, this );
-
-		return (
-			<div className={ className }>
-				<LayoutRenderer
-					align={ align }
-					columns={ columns }
-					images={ images }
-					layoutStyle={ layoutStyle }
-					renderedImages={ renderedImages }
-				/>
-				{ children }
-			</div>
-		);
-	}
-}
-
-function isSquareishLayout( layout ) {
-	return [ 'circle', 'square' ].includes( layout );
-}
-
-function isWpcomFilesUrl( url ) {
-	const { host } = parseUrl( url );
-	return /\.files\.wordpress\.com$/.test( host );
-}
-
-/**
- * Apply photon arguments to *.files.wordpress.com images
- *
- * This function largely duplicates the functionlity of the photon.js lib.
- * This is necessary because we want to serve images from *.files.wordpress.com so that private
- * WordPress.com sites can use this block which depends on a Photon-like image service.
- *
- * If we pass all images through Photon servers, some images are unreachable. *.files.wordpress.com
- * is already photon-like so we can pass it the same parameters for image resizing.
- *
- * @param  {string} url  Image url
- * @param  {Object} opts Options to pass to photon
- *
- * @return {string}      Url string with options applied
- */
-function photonWpcomImage( url, opts = {} ) {
-	// Adhere to the same options API as the photon.js lib
-	const photonLibMappings = {
-		width: 'w',
-		height: 'h',
-		letterboxing: 'lb',
-		removeLetterboxing: 'ulb',
-	};
-
-	// Discard some param parts
-	const { auth, hash, port, query, search, ...urlParts } = parseUrl( url );
-
-	// Build query
-	// This reduction intentionally mutates the query as it is built internally.
-	urlParts.query = Object.keys( opts ).reduce(
-		( q, key ) =>
-			Object.assign( q, {
-				[ photonLibMappings.hasOwnProperty( key ) ? photonLibMappings[ key ] : key ]: opts[ key ],
-			} ),
-		{}
-	);
-
-	return formatUrl( urlParts );
-}
diff --git a/plugins/jetpack/extensions/blocks/tiled-gallery/layout/mosaic/index.js b/plugins/jetpack/extensions/blocks/tiled-gallery/layout/mosaic/index.js
deleted file mode 100644
index 8c56b164..00000000
--- a/plugins/jetpack/extensions/blocks/tiled-gallery/layout/mosaic/index.js
+++ /dev/null
@@ -1,104 +0,0 @@
-/**
- * External dependencies
- */
-import { Component, createRef } from '@wordpress/element';
-import ResizeObserver from 'resize-observer-polyfill';
-
-/**
- * Internal dependencies
- */
-import Column from '../column';
-import Gallery from '../gallery';
-import Row from '../row';
-import { getGalleryRows, handleRowResize } from './resize';
-import { imagesToRatios, ratiosToColumns, ratiosToMosaicRows } from './ratios';
-
-export default class Mosaic extends Component {
-	gallery = createRef();
-	pendingRaf = null;
-	ro = null; // resizeObserver instance
-
-	componentDidMount() {
-		this.observeResize();
-	}
-
-	componentWillUnmount() {
-		this.unobserveResize();
-	}
-
-	componentDidUpdate( prevProps ) {
-		if ( prevProps.images !== this.props.images || prevProps.align !== this.props.align ) {
-			this.triggerResize();
-		} else if ( 'columns' === this.props.layoutStyle && prevProps.columns !== this.props.columns ) {
-			this.triggerResize();
-		}
-	}
-
-	handleGalleryResize = entries => {
-		if ( this.pendingRaf ) {
-			cancelAnimationFrame( this.pendingRaf );
-			this.pendingRaf = null;
-		}
-		this.pendingRaf = requestAnimationFrame( () => {
-			for ( const { contentRect, target } of entries ) {
-				const { width } = contentRect;
-				getGalleryRows( target ).forEach( row => handleRowResize( row, width ) );
-			}
-		} );
-	};
-
-	triggerResize() {
-		if ( this.gallery.current ) {
-			this.handleGalleryResize( [
-				{
-					target: this.gallery.current,
-					contentRect: { width: this.gallery.current.clientWidth },
-				},
-			] );
-		}
-	}
-
-	observeResize() {
-		this.triggerResize();
-		this.ro = new ResizeObserver( this.handleGalleryResize );
-		if ( this.gallery.current ) {
-			this.ro.observe( this.gallery.current );
-		}
-	}
-
-	unobserveResize() {
-		if ( this.ro ) {
-			this.ro.disconnect();
-			this.ro = null;
-		}
-		if ( this.pendingRaf ) {
-			cancelAnimationFrame( this.pendingRaf );
-			this.pendingRaf = null;
-		}
-	}
-
-	render() {
-		const { align, columns, images, layoutStyle, renderedImages } = this.props;
-
-		const ratios = imagesToRatios( images );
-		const rows =
-			'columns' === layoutStyle
-				? ratiosToColumns( ratios, columns )
-				: ratiosToMosaicRows( ratios, { isWide: [ 'full', 'wide' ].includes( align ) } );
-
-		let cursor = 0;
-		return (
-			<Gallery galleryRef={ this.gallery }>
-				{ rows.map( ( row, rowIndex ) => (
-					<Row key={ rowIndex }>
-						{ row.map( ( colSize, colIndex ) => {
-							const columnImages = renderedImages.slice( cursor, cursor + colSize );
-							cursor += colSize;
-							return <Column key={ colIndex }>{ columnImages }</Column>;
-						} ) }
-					</Row>
-				) ) }
-			</Gallery>
-		);
-	}
-}
diff --git a/plugins/jetpack/extensions/blocks/tiled-gallery/layout/mosaic/ratios.js b/plugins/jetpack/extensions/blocks/tiled-gallery/layout/mosaic/ratios.js
deleted file mode 100644
index 8accd552..00000000
--- a/plugins/jetpack/extensions/blocks/tiled-gallery/layout/mosaic/ratios.js
+++ /dev/null
@@ -1,280 +0,0 @@
-/**
- * External dependencies
- */
-import {
-	drop,
-	every,
-	isEqual,
-	map,
-	overEvery,
-	some,
-	sum,
-	take,
-	takeRight,
-	takeWhile,
-	zipWith,
-} from 'lodash';
-
-export function imagesToRatios( images ) {
-	return map( images, ratioFromImage );
-}
-
-export function ratioFromImage( { height, width } ) {
-	return height && width ? width / height : 1;
-}
-
-/**
- * Build three columns, each of which should contain approximately 1/3 of the total ratio
- *
- * @param  {Array.<number>}         ratios      Ratios of images put into shape
- * @param  {number}                 columnCount Number of columns
- *
- * @return {Array.<Array.<number>>}             Shape of rows and columns
- */
-export function ratiosToColumns( ratios, columnCount ) {
-	// If we don't have more than 1 per column, just return a simple 1 ratio per column shape
-	if ( ratios.length <= columnCount ) {
-		return [ Array( ratios.length ).fill( 1 ) ];
-	}
-
-	const total = sum( ratios );
-	const targetColRatio = total / columnCount;
-
-	const row = [];
-	let toProcess = ratios;
-	let accumulatedRatio = 0;
-
-	// We skip the last column in the loop and add rest later
-	for ( let i = 0; i < columnCount - 1; i++ ) {
-		const colSize = takeWhile( toProcess, ratio => {
-			const shouldTake = accumulatedRatio <= ( i + 1 ) * targetColRatio;
-			if ( shouldTake ) {
-				accumulatedRatio += ratio;
-			}
-			return shouldTake;
-		} ).length;
-		row.push( colSize );
-		toProcess = drop( toProcess, colSize );
-	}
-
-	// Don't calculate last column, just add what's left
-	row.push( toProcess.length );
-
-	// A shape is an array of rows. Wrap our row in an array.
-	return [ row ];
-}
-
-/**
- * These are partially applied functions.
- * They rely on helper function (defined below) to create a function that expects to be passed ratios
- * during processing.
- *
- * …FitsNextImages() functions should be passed ratios to be processed
- * …IsNotRecent() functions should be passed the processed shapes
- */
-
-const reverseSymmetricRowIsNotRecent = isNotRecentShape( [ 2, 1, 2 ], 5 );
-const reverseSymmetricFitsNextImages = checkNextRatios( [
-	isLandscape,
-	isLandscape,
-	isPortrait,
-	isLandscape,
-	isLandscape,
-] );
-const longSymmetricRowFitsNextImages = checkNextRatios( [
-	isLandscape,
-	isLandscape,
-	isLandscape,
-	isPortrait,
-	isLandscape,
-	isLandscape,
-	isLandscape,
-] );
-const longSymmetricRowIsNotRecent = isNotRecentShape( [ 3, 1, 3 ], 5 );
-const symmetricRowFitsNextImages = checkNextRatios( [
-	isPortrait,
-	isLandscape,
-	isLandscape,
-	isPortrait,
-] );
-const symmetricRowIsNotRecent = isNotRecentShape( [ 1, 2, 1 ], 5 );
-const oneThreeFitsNextImages = checkNextRatios( [
-	isPortrait,
-	isLandscape,
-	isLandscape,
-	isLandscape,
-] );
-const oneThreeIsNotRecent = isNotRecentShape( [ 1, 3 ], 3 );
-const threeOneIsFitsNextImages = checkNextRatios( [
-	isLandscape,
-	isLandscape,
-	isLandscape,
-	isPortrait,
-] );
-const threeOneIsNotRecent = isNotRecentShape( [ 3, 1 ], 3 );
-const oneTwoFitsNextImages = checkNextRatios( [
-	lt( 1.6 ),
-	overEvery( gte( 0.9 ), lt( 2 ) ),
-	overEvery( gte( 0.9 ), lt( 2 ) ),
-] );
-const oneTwoIsNotRecent = isNotRecentShape( [ 1, 2 ], 3 );
-const fiveIsNotRecent = isNotRecentShape( [ 1, 1, 1, 1, 1 ], 1 );
-const fourIsNotRecent = isNotRecentShape( [ 1, 1, 1, 1 ], 1 );
-const threeIsNotRecent = isNotRecentShape( [ 1, 1, 1 ], 3 );
-const twoOneFitsNextImages = checkNextRatios( [
-	overEvery( gte( 0.9 ), lt( 2 ) ),
-	overEvery( gte( 0.9 ), lt( 2 ) ),
-	lt( 1.6 ),
-] );
-const twoOneIsNotRecent = isNotRecentShape( [ 2, 1 ], 3 );
-const panoramicFitsNextImages = checkNextRatios( [ isPanoramic ] );
-
-export function ratiosToMosaicRows( ratios, { isWide } = {} ) {
-	// This function will recursively process the input until it is consumed
-	const go = ( processed, toProcess ) => {
-		if ( ! toProcess.length ) {
-			return processed;
-		}
-
-		let next;
-
-		if (
-			/* Reverse_Symmetric_Row */
-			toProcess.length > 15 &&
-			reverseSymmetricFitsNextImages( toProcess ) &&
-			reverseSymmetricRowIsNotRecent( processed )
-		) {
-			next = [ 2, 1, 2 ];
-		} else if (
-			/* Long_Symmetric_Row */
-			toProcess.length > 15 &&
-			longSymmetricRowFitsNextImages( toProcess ) &&
-			longSymmetricRowIsNotRecent( processed )
-		) {
-			next = [ 3, 1, 3 ];
-		} else if (
-			/* Symmetric_Row */
-			toProcess.length !== 5 &&
-			symmetricRowFitsNextImages( toProcess ) &&
-			symmetricRowIsNotRecent( processed )
-		) {
-			next = [ 1, 2, 1 ];
-		} else if (
-			/* One_Three */
-			oneThreeFitsNextImages( toProcess ) &&
-			oneThreeIsNotRecent( processed )
-		) {
-			next = [ 1, 3 ];
-		} else if (
-			/* Three_One */
-			threeOneIsFitsNextImages( toProcess ) &&
-			threeOneIsNotRecent( processed )
-		) {
-			next = [ 3, 1 ];
-		} else if (
-			/* One_Two */
-			oneTwoFitsNextImages( toProcess ) &&
-			oneTwoIsNotRecent( processed )
-		) {
-			next = [ 1, 2 ];
-		} else if (
-			/* Five */
-			isWide &&
-			( toProcess.length === 5 || ( toProcess.length !== 10 && toProcess.length > 6 ) ) &&
-			fiveIsNotRecent( processed ) &&
-			sum( take( toProcess, 5 ) ) < 5
-		) {
-			next = [ 1, 1, 1, 1, 1 ];
-		} else if (
-			/* Four */
-			isFourValidCandidate( processed, toProcess )
-		) {
-			next = [ 1, 1, 1, 1 ];
-		} else if (
-			/* Three */
-			isThreeValidCandidate( processed, toProcess, isWide )
-		) {
-			next = [ 1, 1, 1 ];
-		} else if (
-			/* Two_One */
-			twoOneFitsNextImages( toProcess ) &&
-			twoOneIsNotRecent( processed )
-		) {
-			next = [ 2, 1 ];
-		} else if ( /* Panoramic */ panoramicFitsNextImages( toProcess ) ) {
-			next = [ 1 ];
-		} else if ( /* One_One */ toProcess.length > 3 ) {
-			next = [ 1, 1 ];
-		} else {
-			// Everything left
-			next = Array( toProcess.length ).fill( 1 );
-		}
-
-		// Add row
-		const nextProcessed = processed.concat( [ next ] );
-
-		// Trim consumed images from next processing step
-		const consumedImages = sum( next );
-		const nextToProcess = toProcess.slice( consumedImages );
-
-		return go( nextProcessed, nextToProcess );
-	};
-	return go( [], ratios );
-}
-
-function isThreeValidCandidate( processed, toProcess, isWide ) {
-	const ratio = sum( take( toProcess, 3 ) );
-	return (
-		toProcess.length >= 3 &&
-		toProcess.length !== 4 &&
-		toProcess.length !== 6 &&
-		threeIsNotRecent( processed ) &&
-		( ratio < 2.5 ||
-			( ratio < 5 &&
-				/* nextAreSymettric */
-				( toProcess.length >= 3 &&
-					/* @FIXME floating point equality?? */ toProcess[ 0 ] === toProcess[ 2 ] ) ) ||
-			isWide )
-	);
-}
-
-function isFourValidCandidate( processed, toProcess ) {
-	const ratio = sum( take( toProcess, 4 ) );
-	return (
-		( fourIsNotRecent( processed ) && ( ratio < 3.5 && toProcess.length > 5 ) ) ||
-		( ratio < 7 && toProcess.length === 4 )
-	);
-}
-
-function isNotRecentShape( shape, numRecents ) {
-	return recents =>
-		! some( takeRight( recents, numRecents ), recentShape => isEqual( recentShape, shape ) );
-}
-
-function checkNextRatios( shape ) {
-	return ratios =>
-		ratios.length >= shape.length &&
-		every( zipWith( shape, ratios.slice( 0, shape.length ), ( f, r ) => f( r ) ) );
-}
-
-function isLandscape( ratio ) {
-	return ratio >= 1 && ratio < 2;
-}
-
-function isPortrait( ratio ) {
-	return ratio < 1;
-}
-
-function isPanoramic( ratio ) {
-	return ratio >= 2;
-}
-
-// >=
-function gte( n ) {
-	return m => m >= n;
-}
-
-// <
-function lt( n ) {
-	return m => m < n;
-}
diff --git a/plugins/jetpack/extensions/blocks/tiled-gallery/layout/mosaic/resize.js b/plugins/jetpack/extensions/blocks/tiled-gallery/layout/mosaic/resize.js
deleted file mode 100644
index 022729c8..00000000
--- a/plugins/jetpack/extensions/blocks/tiled-gallery/layout/mosaic/resize.js
+++ /dev/null
@@ -1,107 +0,0 @@
-/**
- * Internal dependencies
- */
-import { GUTTER_WIDTH } from '../../constants';
-
-/**
- * Distribute a difference across ns so that their sum matches the target
- *
- * @param {Array<number>}  parts  Array of numbers to fit
- * @param {number}         target Number that sum should match
- * @return {Array<number>}        Adjusted parts
- */
-function adjustFit( parts, target ) {
-	const diff = target - parts.reduce( ( sum, n ) => sum + n, 0 );
-	const partialDiff = diff / parts.length;
-	return parts.map( p => p + partialDiff );
-}
-
-export function handleRowResize( row, width ) {
-	applyRowRatio( row, getRowRatio( row ), width );
-}
-
-function getRowRatio( row ) {
-	const result = getRowCols( row )
-		.map( getColumnRatio )
-		.reduce(
-			( [ ratioA, weightedRatioA ], [ ratioB, weightedRatioB ] ) => {
-				return [ ratioA + ratioB, weightedRatioA + weightedRatioB ];
-			},
-			[ 0, 0 ]
-		);
-	return result;
-}
-
-export function getGalleryRows( gallery ) {
-	return Array.from( gallery.querySelectorAll( '.tiled-gallery__row' ) );
-}
-
-function getRowCols( row ) {
-	return Array.from( row.querySelectorAll( '.tiled-gallery__col' ) );
-}
-
-function getColImgs( col ) {
-	return Array.from(
-		col.querySelectorAll( '.tiled-gallery__item > img, .tiled-gallery__item > a > img' )
-	);
-}
-
-function getColumnRatio( col ) {
-	const imgs = getColImgs( col );
-	const imgCount = imgs.length;
-	const ratio =
-		1 /
-		imgs.map( getImageRatio ).reduce( ( partialColRatio, imgRatio ) => {
-			return partialColRatio + 1 / imgRatio;
-		}, 0 );
-	const result = [ ratio, ratio * imgCount || 1 ];
-	return result;
-}
-
-function getImageRatio( img ) {
-	const w = parseInt( img.dataset.width, 10 );
-	const h = parseInt( img.dataset.height, 10 );
-	const result = w && ! Number.isNaN( w ) && h && ! Number.isNaN( h ) ? w / h : 1;
-	return result;
-}
-
-function applyRowRatio( row, [ ratio, weightedRatio ], width ) {
-	const rawHeight =
-		( 1 / ratio ) * ( width - GUTTER_WIDTH * ( row.childElementCount - 1 ) - weightedRatio );
-
-	applyColRatio( row, {
-		rawHeight,
-		rowWidth: width - GUTTER_WIDTH * ( row.childElementCount - 1 ),
-	} );
-}
-
-function applyColRatio( row, { rawHeight, rowWidth } ) {
-	const cols = getRowCols( row );
-
-	const colWidths = cols.map(
-		col => ( rawHeight - GUTTER_WIDTH * ( col.childElementCount - 1 ) ) * getColumnRatio( col )[ 0 ]
-	);
-
-	const adjustedWidths = adjustFit( colWidths, rowWidth );
-
-	cols.forEach( ( col, i ) => {
-		const rawWidth = colWidths[ i ];
-		const width = adjustedWidths[ i ];
-		applyImgRatio( col, {
-			colHeight: rawHeight - GUTTER_WIDTH * ( col.childElementCount - 1 ),
-			width,
-			rawWidth,
-		} );
-	} );
-}
-
-function applyImgRatio( col, { colHeight, width, rawWidth } ) {
-	const imgHeights = getColImgs( col ).map( img => rawWidth / getImageRatio( img ) );
-	const adjustedHeights = adjustFit( imgHeights, colHeight );
-
-	// Set size of col children, not the <img /> element
-	Array.from( col.children ).forEach( ( item, i ) => {
-		const height = adjustedHeights[ i ];
-		item.setAttribute( 'style', `height:${ height }px;width:${ width }px;` );
-	} );
-}
diff --git a/plugins/jetpack/extensions/blocks/tiled-gallery/layout/mosaic/test/__snapshots__/index.js.snap b/plugins/jetpack/extensions/blocks/tiled-gallery/layout/mosaic/test/__snapshots__/index.js.snap
deleted file mode 100644
index e726fa52..00000000
--- a/plugins/jetpack/extensions/blocks/tiled-gallery/layout/mosaic/test/__snapshots__/index.js.snap
+++ /dev/null
@@ -1,98 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`renders as expected 1`] = `
-<Gallery
-  galleryRef={
-    Object {
-      "current": null,
-    }
-  }
->
-  <Row
-    key="0"
-  >
-    <Column
-      key="0"
-    >
-      0
-    </Column>
-  </Row>
-  <Row
-    key="1"
-  >
-    <Column
-      key="0"
-    >
-      1
-    </Column>
-  </Row>
-  <Row
-    key="2"
-  >
-    <Column
-      key="0"
-    >
-      2
-    </Column>
-    <Column
-      key="1"
-    >
-      3
-    </Column>
-    <Column
-      key="2"
-    >
-      4
-    </Column>
-    <Column
-      key="3"
-    >
-      5
-    </Column>
-  </Row>
-  <Row
-    key="3"
-  >
-    <Column
-      key="0"
-    >
-      6
-    </Column>
-    <Column
-      key="1"
-    >
-      7
-    </Column>
-  </Row>
-  <Row
-    key="4"
-  >
-    <Column
-      key="0"
-    >
-      8
-    </Column>
-    <Column
-      key="1"
-    >
-      9
-      10
-    </Column>
-  </Row>
-  <Row
-    key="5"
-  >
-    <Column
-      key="0"
-    >
-      11
-      12
-    </Column>
-    <Column
-      key="1"
-    >
-      13
-    </Column>
-  </Row>
-</Gallery>
-`;
diff --git a/plugins/jetpack/extensions/blocks/tiled-gallery/layout/mosaic/test/__snapshots__/ratios.js.snap b/plugins/jetpack/extensions/blocks/tiled-gallery/layout/mosaic/test/__snapshots__/ratios.js.snap
deleted file mode 100644
index df02118c..00000000
--- a/plugins/jetpack/extensions/blocks/tiled-gallery/layout/mosaic/test/__snapshots__/ratios.js.snap
+++ /dev/null
@@ -1,30 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`ratiosToMosaicRows transforms as expected 1`] = `
-Array [
-  Array [
-    1,
-  ],
-  Array [
-    1,
-  ],
-  Array [
-    1,
-    1,
-    1,
-    1,
-  ],
-  Array [
-    1,
-    1,
-  ],
-  Array [
-    1,
-    2,
-  ],
-  Array [
-    2,
-    1,
-  ],
-]
-`;
diff --git a/plugins/jetpack/extensions/blocks/tiled-gallery/layout/mosaic/test/fixtures/ratios.js b/plugins/jetpack/extensions/blocks/tiled-gallery/layout/mosaic/test/fixtures/ratios.js
deleted file mode 100644
index 77db288c..00000000
--- a/plugins/jetpack/extensions/blocks/tiled-gallery/layout/mosaic/test/fixtures/ratios.js
+++ /dev/null
@@ -1,16 +0,0 @@
-export const ratios = [
-	4,
-	2.26056338028169,
-	0.6676143094053542,
-	0.75,
-	0.7444409646100846,
-	0.6666666666666666,
-	0.8000588062334607,
-	3.6392174704276616,
-	1.335559265442404,
-	1.509433962264151,
-	1.6,
-	1.3208430913348945,
-	1.3553937789543349,
-	1.499531396438613,
-];
diff --git a/plugins/jetpack/extensions/blocks/tiled-gallery/layout/mosaic/test/index.js b/plugins/jetpack/extensions/blocks/tiled-gallery/layout/mosaic/test/index.js
deleted file mode 100644
index 72e49ba6..00000000
--- a/plugins/jetpack/extensions/blocks/tiled-gallery/layout/mosaic/test/index.js
+++ /dev/null
@@ -1,21 +0,0 @@
-/**
- * External dependencies
- */
-import React from 'react';
-import { range } from 'lodash';
-import { shallow } from 'enzyme';
-
-/**
- * Internal dependencies
- */
-import Mosaic from '..';
-import * as imageSets from '../../test/fixtures/image-sets';
-
-test( 'renders as expected', () => {
-	Object.keys( imageSets ).forEach( k => {
-		const images = imageSets[ k ];
-		expect(
-			shallow( <Mosaic images={ images } renderedImages={ range( images.length ) } /> )
-		).toMatchSnapshot();
-	} );
-} );
diff --git a/plugins/jetpack/extensions/blocks/tiled-gallery/layout/mosaic/test/ratios.js b/plugins/jetpack/extensions/blocks/tiled-gallery/layout/mosaic/test/ratios.js
deleted file mode 100644
index 3756b971..00000000
--- a/plugins/jetpack/extensions/blocks/tiled-gallery/layout/mosaic/test/ratios.js
+++ /dev/null
@@ -1,11 +0,0 @@
-/**
- * Internal dependencies
- */
-import { ratiosToMosaicRows } from '../ratios';
-import { ratios } from './fixtures/ratios';
-
-describe( 'ratiosToMosaicRows', () => {
-	test( 'transforms as expected', () => {
-		expect( ratiosToMosaicRows( ratios ) ).toMatchSnapshot();
-	} );
-} );
diff --git a/plugins/jetpack/extensions/blocks/tiled-gallery/layout/row.js b/plugins/jetpack/extensions/blocks/tiled-gallery/layout/row.js
deleted file mode 100644
index 200a58c2..00000000
--- a/plugins/jetpack/extensions/blocks/tiled-gallery/layout/row.js
+++ /dev/null
@@ -1,8 +0,0 @@
-/**
- * External dependencies
- */
-import classnames from 'classnames';
-
-export default function Row( { children, className } ) {
-	return <div className={ classnames( 'tiled-gallery__row', className ) }>{ children }</div>;
-}
diff --git a/plugins/jetpack/extensions/blocks/tiled-gallery/layout/square.js b/plugins/jetpack/extensions/blocks/tiled-gallery/layout/square.js
deleted file mode 100644
index 2a1ab888..00000000
--- a/plugins/jetpack/extensions/blocks/tiled-gallery/layout/square.js
+++ /dev/null
@@ -1,33 +0,0 @@
-/**
- * External dependencies
- */
-import { chunk, drop, take } from 'lodash';
-
-/**
- * Internal dependencies
- */
-import Row from './row';
-import Column from './column';
-import Gallery from './gallery';
-import { MAX_COLUMNS } from '../constants';
-
-export default function Square( { columns, renderedImages } ) {
-	const columnCount = Math.min( MAX_COLUMNS, columns );
-
-	const remainder = renderedImages.length % columnCount;
-
-	return (
-		<Gallery>
-			{ [
-				...( remainder ? [ take( renderedImages, remainder ) ] : [] ),
-				...chunk( drop( renderedImages, remainder ), columnCount ),
-			].map( ( imagesInRow, rowIndex ) => (
-				<Row key={ rowIndex } className={ `columns-${ imagesInRow.length }` }>
-					{ imagesInRow.map( ( image, colIndex ) => (
-						<Column key={ colIndex }>{ image }</Column>
-					) ) }
-				</Row>
-			) ) }
-		</Gallery>
-	);
-}
diff --git a/plugins/jetpack/extensions/blocks/tiled-gallery/layout/test/fixtures/image-sets.js b/plugins/jetpack/extensions/blocks/tiled-gallery/layout/test/fixtures/image-sets.js
deleted file mode 100644
index fd477f5a..00000000
--- a/plugins/jetpack/extensions/blocks/tiled-gallery/layout/test/fixtures/image-sets.js
+++ /dev/null
@@ -1,103 +0,0 @@
-export const imageSet1 = [
-	{
-		alt: '',
-		id: 163,
-		url: 'https://example.files.wordpress.com/2018/12/architecture-bay-bridge-356830.jpg',
-		height: 2048,
-		width: 8192,
-	},
-	{
-		alt: '',
-		id: 162,
-		url: 'https://example.files.wordpress.com/2018/12/bloom-blossom-flora-40797-1.jpg',
-		height: 1562,
-		width: 3531,
-	},
-	{
-		alt: '',
-		id: 161,
-		url: 'https://example.files.wordpress.com/2018/12/architecture-building-city-597049.jpg',
-		height: 4221,
-		width: 2818,
-	},
-	{
-		alt: '',
-		id: 160,
-		url: 'https://example.files.wordpress.com/2018/12/architecture-art-blue-699466.jpg',
-		height: 4032,
-		width: 3024,
-	},
-	{
-		alt: '',
-		id: 159,
-		url:
-			'https://example.files.wordpress.com/2018/12/black-and-white-construction-ladder-54335.jpg',
-		height: 3193,
-		width: 2377,
-	},
-	{
-		alt: '',
-		id: 158,
-		url: 'https://example.files.wordpress.com/2018/12/architecture-buildings-city-1672110.jpg',
-		height: 6000,
-		width: 4000,
-	},
-	{
-		alt: '',
-		id: 157,
-		url:
-			'https://example.files.wordpress.com/2018/12/architectural-design-architecture-black-and-white-1672122-1.jpg',
-		height: 3401,
-		width: 2721,
-	},
-	{
-		alt: '',
-		id: 156,
-		url: 'https://example.files.wordpress.com/2018/12/grass-hd-wallpaper-lake-127753.jpg',
-		height: 2198,
-		width: 7999,
-	},
-	{
-		alt: '',
-		id: 122,
-		url: 'https://example.files.wordpress.com/2018/12/texaco-car-1.jpg',
-		height: 599,
-		width: 800,
-	},
-	{
-		alt: '',
-		id: 92,
-		url: 'https://example.files.wordpress.com/2018/12/43824553435_ea38cbc92a_m.jpg',
-		height: 159,
-		width: 240,
-	},
-	{
-		alt: '',
-		id: 90,
-		url: 'https://example.files.wordpress.com/2018/12/42924685680_7b5632e58e_m.jpg',
-		height: 150,
-		width: 240,
-	},
-	{
-		alt: '',
-		id: 89,
-		url:
-			'https://example.files.wordpress.com/2018/12/31962299833_1e106f7f7a_z-1-e1545262352979.jpg',
-		height: 427,
-		width: 564,
-	},
-	{
-		alt: '',
-		id: 88,
-		url: 'https://example.files.wordpress.com/2018/12/29797558147_3c72afa8f4_k.jpg',
-		height: 1511,
-		width: 2048,
-	},
-	{
-		alt: '',
-		id: 8,
-		url: 'https://example.files.wordpress.com/2018/11/person-smartphone-office-table.jpeg',
-		height: 1067,
-		width: 1600,
-	},
-];
diff --git a/plugins/jetpack/extensions/blocks/tiled-gallery/save.js b/plugins/jetpack/extensions/blocks/tiled-gallery/save.js
deleted file mode 100644
index e21e56e1..00000000
--- a/plugins/jetpack/extensions/blocks/tiled-gallery/save.js
+++ /dev/null
@@ -1,30 +0,0 @@
-/**
- * Internal dependencies
- */
-import Layout from './layout';
-import { defaultColumnsNumber } from './edit';
-import { getActiveStyleName } from '../../shared/block-styles';
-import { LAYOUT_STYLES } from './constants';
-
-export default function TiledGallerySave( { attributes } ) {
-	const { imageFilter, images } = attributes;
-
-	if ( ! images.length ) {
-		return null;
-	}
-
-	const { align, className, columns = defaultColumnsNumber( attributes ), linkTo } = attributes;
-
-	return (
-		<Layout
-			align={ align }
-			className={ className }
-			columns={ columns }
-			imageFilter={ imageFilter }
-			images={ images }
-			isSave
-			layoutStyle={ getActiveStyleName( LAYOUT_STYLES, className ) }
-			linkTo={ linkTo }
-		/>
-	);
-}
diff --git a/plugins/jetpack/extensions/blocks/tiled-gallery/tiled-gallery.php b/plugins/jetpack/extensions/blocks/tiled-gallery/tiled-gallery.php
index bcfdaf1f..d53feae4 100644
--- a/plugins/jetpack/extensions/blocks/tiled-gallery/tiled-gallery.php
+++ b/plugins/jetpack/extensions/blocks/tiled-gallery/tiled-gallery.php
@@ -44,6 +44,10 @@ class Jetpack_Tiled_Gallery_Block {
 
 		$is_squareish_layout = self::is_squareish_layout( $attr );
 
+		$jetpack_plan = Jetpack_Plan::get();
+
+		wp_localize_script( 'jetpack-gallery-settings', 'jetpack_plan', array( 'data' => $jetpack_plan['product_slug'] ) );
+
 		if ( preg_match_all( '/<img [^>]+>/', $content, $images ) ) {
 			/**
 			 * This block processes all of the images that are found and builds $find and $replace.
@@ -85,7 +89,7 @@ class Jetpack_Tiled_Gallery_Block {
 							$srcset_src = add_query_arg(
 								array(
 									'resize' => $w . ',' . $w,
-									'strip'  => 'all',
+									'strip'  => 'info',
 								),
 								$orig_src
 							);
@@ -104,7 +108,7 @@ class Jetpack_Tiled_Gallery_Block {
 						for ( $w = $min_width; $w <= $max_width; $w = min( $max_width, $w + self::IMG_SRCSET_WIDTH_STEP ) ) {
 							$srcset_src = add_query_arg(
 								array(
-									'strip' => 'all',
+									'strip' => 'info',
 									'w'     => $w,
 								),
 								$orig_src
@@ -163,9 +167,4 @@ class Jetpack_Tiled_Gallery_Block {
 	}
 }
 
-if (
-	( defined( 'IS_WPCOM' ) && IS_WPCOM )
-	|| class_exists( 'Jetpack_Photon' ) && Jetpack::is_module_active( 'photon' )
-) {
-	Jetpack_Tiled_Gallery_Block::register();
-}
+Jetpack_Tiled_Gallery_Block::register();
diff --git a/plugins/jetpack/extensions/blocks/tiled-gallery/variables.scss b/plugins/jetpack/extensions/blocks/tiled-gallery/variables.scss
deleted file mode 100644
index f0054531..00000000
--- a/plugins/jetpack/extensions/blocks/tiled-gallery/variables.scss
+++ /dev/null
@@ -1,2 +0,0 @@
-$tiled-gallery-gutter: 4px; // Fixed in JS, see `LayoutStyles` from `edit.jsx`
-$tiled-gallery-selection: #0085ba; // Gutenberg primary theme color (https://github.com/WordPress/gutenberg/blob/6928e41c8afd7daa3a709afdda7eee48218473b7/bin/packages/post-css-config.js#L4)
diff --git a/plugins/jetpack/extensions/blocks/tiled-gallery/view.js b/plugins/jetpack/extensions/blocks/tiled-gallery/view.js
deleted file mode 100644
index 1f45b13d..00000000
--- a/plugins/jetpack/extensions/blocks/tiled-gallery/view.js
+++ /dev/null
@@ -1,64 +0,0 @@
-/**
- * Internal dependencies
- */
-import './view.scss';
-import ResizeObserver from 'resize-observer-polyfill';
-import { handleRowResize } from './layout/mosaic/resize';
-
-/**
- * Handler for Gallery ResizeObserver
- *
- * @param {Array<ResizeObserverEntry>} galleries Resized galleries
- */
-function handleObservedResize( galleries ) {
-	if ( handleObservedResize.pendingRaf ) {
-		cancelAnimationFrame( handleObservedResize.pendingRaf );
-	}
-	handleObservedResize.pendingRaf = requestAnimationFrame( () => {
-		handleObservedResize.pendingRaf = null;
-		for ( const gallery of galleries ) {
-			const { width: galleryWidth } = gallery.contentRect;
-			// We can't use childNodes becuase post content may contain unexpected text nodes
-			const rows = Array.from( gallery.target.querySelectorAll( '.tiled-gallery__row' ) );
-			rows.forEach( row => handleRowResize( row, galleryWidth ) );
-		}
-	} );
-}
-
-/**
- * Get all the galleries on the document
- *
- * @return {Array} List of gallery nodes
- */
-function getGalleries() {
-	return Array.from(
-		document.querySelectorAll(
-			'.wp-block-jetpack-tiled-gallery.is-style-rectangular > .tiled-gallery__gallery,' +
-				'.wp-block-jetpack-tiled-gallery.is-style-columns > .tiled-gallery__gallery'
-		)
-	);
-}
-
-/**
- * Setup ResizeObserver to follow each gallery on the page
- */
-const observeGalleries = () => {
-	const galleries = getGalleries();
-
-	if ( galleries.length === 0 ) {
-		return;
-	}
-
-	const observer = new ResizeObserver( handleObservedResize );
-
-	galleries.forEach( gallery => observer.observe( gallery ) );
-};
-
-if ( typeof window !== 'undefined' && typeof document !== 'undefined' ) {
-	// `DOMContentLoaded` may fire before the script has a chance to run
-	if ( document.readyState === 'loading' ) {
-		document.addEventListener( 'DOMContentLoaded', observeGalleries );
-	} else {
-		observeGalleries();
-	}
-}
diff --git a/plugins/jetpack/extensions/blocks/tiled-gallery/view.scss b/plugins/jetpack/extensions/blocks/tiled-gallery/view.scss
deleted file mode 100644
index 456f8acb..00000000
--- a/plugins/jetpack/extensions/blocks/tiled-gallery/view.scss
+++ /dev/null
@@ -1,115 +0,0 @@
-@import '../../shared/styles/jetpack-variables.scss';
-@import './variables.scss';
-@import './css-gram.scss';
-
-$tiled-gallery-max-column-count: 20;
-
-.wp-block-jetpack-tiled-gallery {
-	margin: 0 auto $jetpack-block-margin-bottom;
-
-	&.is-style-circle .tiled-gallery__item img {
-		border-radius: 50%;
-	}
-
-	&.is-style-square,
-	&.is-style-circle {
-		.tiled-gallery__row {
-			flex-grow: 1;
-			width: 100%;
-
-			@for $cols from 1 through $tiled-gallery-max-column-count {
-				&.columns-#{$cols} {
-					.tiled-gallery__col {
-						width: calc( ( 100% - #{ $tiled-gallery-gutter * ( $cols - 1 ) } ) / #{$cols} );
-					}
-				}
-			}
-		}
-	}
-
-	&.is-style-columns,
-	&.is-style-rectangular {
-		.tiled-gallery__item {
-			display: flex;
-		}
-	}
-}
-
-.tiled-gallery__gallery {
-	width: 100%;
-	display: flex;
-	padding: 0;
-	flex-wrap: wrap;
-}
-
-.tiled-gallery__row {
-	width: 100%;
-	display: flex;
-	flex-direction: row;
-	justify-content: center;
-	margin: 0;
-
-	& + & {
-		margin-top: $tiled-gallery-gutter;
-	}
-}
-
-.tiled-gallery__col {
-	display: flex;
-	flex-direction: column;
-	justify-content: center;
-	margin: 0;
-
-	& + & {
-		margin-left: $tiled-gallery-gutter;
-	}
-}
-
-.tiled-gallery__item {
-	justify-content: center;
-	margin: 0;
-	overflow: hidden;
-	padding: 0;
-	position: relative;
-
-	&.filter__black-and-white {
-		filter: grayscale( 100% );
-	}
-
-	&.filter__sepia {
-		filter: sepia( 100% );
-	}
-
-	&.filter__1977 {
-		@include _1977;
-	}
-
-	&.filter__clarendon {
-		@include clarendon;
-	}
-
-	&.filter__gingham {
-		@include gingham;
-	}
-
-	& + & {
-		margin-top: $tiled-gallery-gutter;
-	}
-
-	> img {
-		background-color: rgba( 0, 0, 0, 0.1 );
-	}
-
-	> a,
-	> a > img,
-	> img {
-		display: block;
-		height: auto;
-		margin: 0;
-		max-width: 100%;
-		object-fit: cover;
-		object-position: center;
-		padding: 0;
-		width: 100%;
-	}
-}