1 files changed, 38 insertions, 0 deletions
diff --git a/plugins/jetpack/extensions/blocks/map/save.js b/plugins/jetpack/extensions/blocks/map/save.js
new file mode 100644
index 00000000..ffa82641
--- /dev/null
+++ b/plugins/jetpack/extensions/blocks/map/save.js
@@ -0,0 +1,38 @@
+/**
+ * External dependencies
+ */
+
+import { Component } from '@wordpress/element';
+
+class MapSave extends Component {
+	render() {
+		const { attributes } = this.props;
+		const { align, mapStyle, mapDetails, points, zoom, mapCenter, markerColor } = attributes;
+		const pointsList = points.map( ( point, index ) => {
+			const { longitude, latitude } = point.coordinates;
+			const url = 'https://www.google.com/maps/search/?api=1&query=' + latitude + ',' + longitude;
+			return (
+				<li key={ index }>
+					<a href={ url }>{ point.title }</a>
+				</li>
+			);
+		} );
+		const alignClassName = align ? `align${ align }` : null;
+		// All camelCase attribute names converted to snake_case data attributes
+		return (
+			<div
+				className={ alignClassName }
+				data-map-style={ mapStyle }
+				data-map-details={ mapDetails }
+				data-points={ JSON.stringify( points ) }
+				data-zoom={ zoom }
+				data-map-center={ JSON.stringify( mapCenter ) }
+				data-marker-color={ markerColor }
+			>
+				{ points.length > 0 && <ul>{ pointsList }</ul> }
+			</div>
+		);
+	}
+}
+
+export default MapSave;