Eventbrite block: add link to saved HTML (#14510)

* Eventbrite: add a link to the saved modal HTML

This will allow displaying useful info in RSS feeds / subscriptions emails, or when one disables the Jetpack plugin.

* Add CSS to hide the direct link.

* Enqueue CSS when not using modal view

* Add link to button as well

extensions/blocks/eventbrite/eventbrite.php

@@ -33,6 +33,9 @@ function jetpack_render_eventbrite_block( $attr, $content ) {
 
 	wp_enqueue_script( 'eventbrite-widget', 'https://www.eventbrite.com/static/widgets/eb_widgets.js', array(), JETPACK__VERSION, true );
 
+	// Add CSS to hide direct link.
+	Jetpack_Gutenberg::load_assets_as_required( 'eventbrite' );
+
 	// Show the embedded version.
 	if ( empty( $attr['useModal'] ) ) {
 		wp_add_inline_script(

extensions/blocks/eventbrite/save.js

@@ -27,6 +27,7 @@ function saveButton( eventId, attributes ) {
 		customTextColor,
 		text,
 		textColor,
+		url,
 	} = attributes;
 
 	const textClass = getColorClassName( 'color', textColor );
@@ -56,12 +57,17 @@ function saveButton( eventId, attributes ) {
 				value={ text }
 				type="button"
 			/>
+			{ url && (
+				<a className="eventbrite__direct-link" href={ url }>
+					{ url }
+				</a>
+			) }
 		</div>
 	);
 }
 
 export default function save( { attributes } ) {
-	const { eventId, useModal } = attributes;
+	const { eventId, useModal, url } = attributes;
 
 	if ( ! eventId ) {
 		return;
@@ -71,5 +77,13 @@ export default function save( { attributes } ) {
 		return saveButton( eventId, attributes );
 	}
 
-	return <div id={ createWidgetId( eventId ) } />;
+	return (
+		<div id={ createWidgetId( eventId ) }>
+			{ url && (
+				<a className="eventbrite__direct-link" href={ url }>
+					{ url }
+				</a>
+			) }
+		</div>
+	);
 }

extensions/blocks/eventbrite/style.scss

@@ -0,0 +1,5 @@
+.wp-block-jetpack-eventbrite {
+	a.eventbrite__direct-link {
+		display: none;
+	}
+}

extensions/blocks/eventbrite/view.js

@@ -0,0 +1,4 @@
+/**
+ * Internal dependencies
+ */
+import './style.scss';