From 4357945f8e9f846e68be022441b3e76fbf83fd36 Mon Sep 17 00:00:00 2001
From: Michael Turk <turk.michael@gmail.com>
Date: Thu, 13 Dec 2018 10:43:59 -0500
Subject: [PATCH 01/11] Adding new Subscriptions block

---
 .../extensions/presets/jetpack/index.json     |  1 +
 .../extensions/subscriptions/edit.jsx         | 70 +++++++++++++++++++
 .../extensions/subscriptions/editor.js        | 45 ++++++++++++
 .../extensions/subscriptions/save.jsx         | 14 ++++
 4 files changed, 130 insertions(+)
 create mode 100644 client/gutenberg/extensions/subscriptions/edit.jsx
 create mode 100644 client/gutenberg/extensions/subscriptions/editor.js
 create mode 100644 client/gutenberg/extensions/subscriptions/save.jsx

diff --git a/client/gutenberg/extensions/presets/jetpack/index.json b/client/gutenberg/extensions/presets/jetpack/index.json
index 52193f0ea8773..0228f54e6e5af 100644
--- a/client/gutenberg/extensions/presets/jetpack/index.json
+++ b/client/gutenberg/extensions/presets/jetpack/index.json
@@ -8,6 +8,7 @@
   ],
   "beta": [
     "related-posts",
+    "subscriptions",
     "tiled-gallery",
     "vr"
   ]
diff --git a/client/gutenberg/extensions/subscriptions/edit.jsx b/client/gutenberg/extensions/subscriptions/edit.jsx
new file mode 100644
index 0000000000000..4c266a533921e
--- /dev/null
+++ b/client/gutenberg/extensions/subscriptions/edit.jsx
@@ -0,0 +1,70 @@
+/** @format */
+
+/**
+ * External dependencies
+ */
+import { Component } from '@wordpress/element';
+import { TextControl, Button, ToggleControl } from '@wordpress/components';
+
+/**
+ * Internal dependencies
+ */
+import { __ } from 'gutenberg/extensions/presets/jetpack/utils/i18n';
+import { sprintf } from '@wordpress/i18n/build/index';
+import apiFetch from '@wordpress/api-fetch';
+
+class SubscriptionEdit extends Component {
+	render() {
+		const { attributes, className, isSelected, setAttributes } = this.props;
+		const { subscribe_placeholder, show_subscribers_total, subscriber_count_string } = attributes;
+
+		// Get the subscriber count so it is available right away if the user toggles the setting
+		this.get_subscriber_count();
+
+		if ( isSelected ) {
+			return (
+				<div className={ className } role="form">
+					<ToggleControl
+						label={ __( 'Show total subscribers' ) }
+						checked={ show_subscribers_total }
+						onChange={ () => {
+							setAttributes( { show_subscribers_total: ! show_subscribers_total } );
+						} }
+					/>
+					<TextControl placeholder={ subscribe_placeholder } required onChange={ () => {} } />
+					<Button type="button" isDefault>
+						{ __( 'Subscribe' ) }
+					</Button>
+				</div>
+			);
+		}
+
+		return (
+			<div className={ className } role="form">
+				{ show_subscribers_total && <p role="heading">{ subscriber_count_string }</p> }
+				<TextControl placeholder={ subscribe_placeholder } />
+				<Button type="button" isDefault>
+					{ __( 'Subscribe' ) }
+				</Button>
+			</div>
+		);
+	}
+
+	get_subscriber_count() {
+		const { setAttributes } = this.props;
+
+		apiFetch( { path: '/wpcom/v2/subscribers/count' } ).then( count => {
+			if ( 1 === count ) {
+				setAttributes( {
+					subscriber_count_string: sprintf( __( 'Join %s other subscriber' ), count.count ),
+				} );
+			} else {
+				setAttributes( {
+					subscriber_count_string: sprintf( __( 'Join %s other subscribers' ), count.count ),
+				} );
+			}
+		} );
+	}
+}
+
+export default SubscriptionEdit;
diff --git a/client/gutenberg/extensions/subscriptions/editor.js b/client/gutenberg/extensions/subscriptions/editor.js
new file mode 100644
index 0000000000000..edc47a37ecfe8
--- /dev/null
+++ b/client/gutenberg/extensions/subscriptions/editor.js
@@ -0,0 +1,45 @@
+/** @format */
+
+/**
+ * External dependencies
+ */
+
+/**
+ * Internal dependencies
+ */
+//import './editor.scss';
+import edit from './edit';
+import save from './save';
+import { __ } from 'gutenberg/extensions/presets/jetpack/utils/i18n';
+import registerJetpackBlock from '../presets/jetpack/utils/register-jetpack-block';
+import renderMaterialIcon from 'gutenberg/extensions/presets/jetpack/utils/render-material-icon';
+
+export const name = 'subscriptions';
+export const settings = {
+	title: __( 'Subscription form' ),
+
+	description: (
+		<p>
+			{ __(
+				'A form enabling readers to get notifications when new posts are published from this site.'
+			) }
+		</p>
+	),
+	icon: renderMaterialIcon(
+		<path d="M23 16v2h-3v3h-2v-3h-3v-2h3v-3h2v3h3zM20 2v9h-4v3h-3v4H4c-1.1 0-2-.9-2-2V2h18zM8 13v-1H4v1h4zm3-3H4v1h7v-1zm0-2H4v1h7V8zm7-4H4v2h14V4z" />
+	),
+	category: 'jetpack',
+
+	keywords: [ __( 'subscribe' ), __( 'join' ), __( 'follow' ) ],
+
+	attributes: {
+		subscriber_count_string: { type: 'string', default: '' },
+		subscribe_placeholder: { type: 'string', default: 'Email Address' },
+		subscribe_button: { type: 'string', default: 'Subscribe' },
+		show_subscribers_total: { type: 'boolean', default: false },
+	},
+	edit,
+	save,
+};
+
+registerJetpackBlock( name, settings );
diff --git a/client/gutenberg/extensions/subscriptions/save.jsx b/client/gutenberg/extensions/subscriptions/save.jsx
new file mode 100644
index 0000000000000..c9aca8c5d6bea
--- /dev/null
+++ b/client/gutenberg/extensions/subscriptions/save.jsx
@@ -0,0 +1,14 @@
+/** @format */
+
+/**
+ * External dependencies
+ */
+import { RawHTML } from '@wordpress/element';
+
+export default function Save( { attributes } ) {
+	const { show_subscribers_total } = attributes;
+	return (
+		<RawHTML
+		>{ `[jetpack_subscription_form title="" subscribe_text="" show_subscribers_total="${ show_subscribers_total }"]` }</RawHTML>
+	);
+}

From 8a57543be5ff29f57e721af06b9a05ecf4272acf Mon Sep 17 00:00:00 2001
From: Bernie Reiter <ockham@raz.or.at>
Date: Thu, 13 Dec 2018 17:01:39 +0100
Subject: [PATCH 02/11] Update presets/imports/whatnot to make it work

---
 .../extensions/presets/jetpack/editor.js      |  2 +
 .../extensions/subscriptions/editor.js        | 40 +-----------------
 .../extensions/subscriptions/index.js         | 42 +++++++++++++++++++
 3 files changed, 46 insertions(+), 38 deletions(-)
 create mode 100644 client/gutenberg/extensions/subscriptions/index.js

diff --git a/client/gutenberg/extensions/presets/jetpack/editor.js b/client/gutenberg/extensions/presets/jetpack/editor.js
index c76654acaa158..d1183e978bb2e 100644
--- a/client/gutenberg/extensions/presets/jetpack/editor.js
+++ b/client/gutenberg/extensions/presets/jetpack/editor.js
@@ -14,6 +14,7 @@ import * as MapBlock from 'gutenberg/extensions/map';
 import * as PublicizeBlock from 'gutenberg/extensions/publicize';
 import * as RelatedPostsBlock from 'gutenberg/extensions/related-posts';
 import * as SimplePaymentsBlock from 'gutenberg/extensions/simple-payments';
+import * as SubscriptionsBlock from 'gutenberg/extensions/subscriptions';
 import * as TiledGalleryBlock from 'gutenberg/extensions/tiled-gallery';
 import * as VRBlock from 'gutenberg/extensions/vr';
 import { isEnabled } from 'config';
@@ -25,6 +26,7 @@ export default [
 	MapBlock,
 	PublicizeBlock,
 	SimplePaymentsBlock,
+	SubscriptionsBlock,
 	...( isEnabled( 'jetpack/blocks/beta' )
 		? [ RelatedPostsBlock, TiledGalleryBlock, VRBlock ]
 		: [] ),
diff --git a/client/gutenberg/extensions/subscriptions/editor.js b/client/gutenberg/extensions/subscriptions/editor.js
index edc47a37ecfe8..b167dc5cca783 100644
--- a/client/gutenberg/extensions/subscriptions/editor.js
+++ b/client/gutenberg/extensions/subscriptions/editor.js
@@ -1,45 +1,9 @@
 /** @format */
 
-/**
- * External dependencies
- */
-
 /**
  * Internal dependencies
  */
-//import './editor.scss';
-import edit from './edit';
-import save from './save';
-import { __ } from 'gutenberg/extensions/presets/jetpack/utils/i18n';
-import registerJetpackBlock from '../presets/jetpack/utils/register-jetpack-block';
-import renderMaterialIcon from 'gutenberg/extensions/presets/jetpack/utils/render-material-icon';
-
-export const name = 'subscriptions';
-export const settings = {
-	title: __( 'Subscription form' ),
-
-	description: (
-		<p>
-			{ __(
-				'A form enabling readers to get notifications when new posts are published from this site.'
-			) }
-		</p>
-	),
-	icon: renderMaterialIcon(
-		<path d="M23 16v2h-3v3h-2v-3h-3v-2h3v-3h2v3h3zM20 2v9h-4v3h-3v4H4c-1.1 0-2-.9-2-2V2h18zM8 13v-1H4v1h4zm3-3H4v1h7v-1zm0-2H4v1h7V8zm7-4H4v2h14V4z" />
-	),
-	category: 'jetpack',
-
-	keywords: [ __( 'subscribe' ), __( 'join' ), __( 'follow' ) ],
-
-	attributes: {
-		subscriber_count_string: { type: 'string', default: '' },
-		subscribe_placeholder: { type: 'string', default: 'Email Address' },
-		subscribe_button: { type: 'string', default: 'Subscribe' },
-		show_subscribers_total: { type: 'boolean', default: false },
-	},
-	edit,
-	save,
-};
+import registerJetpackBlock from 'gutenberg/extensions/presets/jetpack/utils/register-jetpack-block';
+import { name, settings } from '.';
 
 registerJetpackBlock( name, settings );
diff --git a/client/gutenberg/extensions/subscriptions/index.js b/client/gutenberg/extensions/subscriptions/index.js
new file mode 100644
index 0000000000000..a90bfcb27586f
--- /dev/null
+++ b/client/gutenberg/extensions/subscriptions/index.js
@@ -0,0 +1,42 @@
+/** @format */
+
+/**
+ * External dependencies
+ */
+
+/**
+ * Internal dependencies
+ */
+//import './editor.scss';
+import edit from './edit';
+import save from './save';
+import { __ } from 'gutenberg/extensions/presets/jetpack/utils/i18n';
+import renderMaterialIcon from 'gutenberg/extensions/presets/jetpack/utils/render-material-icon';
+
+export const name = 'subscriptions';
+export const settings = {
+	title: __( 'Subscription form' ),
+
+	description: (
+		<p>
+			{ __(
+				'A form enabling readers to get notifications when new posts are published from this site.'
+			) }
+		</p>
+	),
+	icon: renderMaterialIcon(
+		<path d="M23 16v2h-3v3h-2v-3h-3v-2h3v-3h2v3h3zM20 2v9h-4v3h-3v4H4c-1.1 0-2-.9-2-2V2h18zM8 13v-1H4v1h4zm3-3H4v1h7v-1zm0-2H4v1h7V8zm7-4H4v2h14V4z" />
+	),
+	category: 'jetpack',
+
+	keywords: [ __( 'subscribe' ), __( 'join' ), __( 'follow' ) ],
+
+	attributes: {
+		subscriber_count_string: { type: 'string', default: '' },
+		subscribe_placeholder: { type: 'string', default: 'Email Address' },
+		subscribe_button: { type: 'string', default: 'Subscribe' },
+		show_subscribers_total: { type: 'boolean', default: false },
+	},
+	edit,
+	save,
+};

From f1644f7fb8413c7148781b6343c0061269eeeebc Mon Sep 17 00:00:00 2001
From: Michael Turk <turk.michael@gmail.com>
Date: Thu, 13 Dec 2018 14:47:27 -0500
Subject: [PATCH 03/11] Using Path component and removing empty save attributes

---
 client/gutenberg/extensions/subscriptions/index.js | 3 ++-
 client/gutenberg/extensions/subscriptions/save.jsx | 2 +-
 2 files changed, 3 insertions(+), 2 deletions(-)

diff --git a/client/gutenberg/extensions/subscriptions/index.js b/client/gutenberg/extensions/subscriptions/index.js
index a90bfcb27586f..472fae4f65747 100644
--- a/client/gutenberg/extensions/subscriptions/index.js
+++ b/client/gutenberg/extensions/subscriptions/index.js
@@ -12,6 +12,7 @@ import edit from './edit';
 import save from './save';
 import { __ } from 'gutenberg/extensions/presets/jetpack/utils/i18n';
 import renderMaterialIcon from 'gutenberg/extensions/presets/jetpack/utils/render-material-icon';
+import { Path } from '@wordpress/components';
 
 export const name = 'subscriptions';
 export const settings = {
@@ -25,7 +26,7 @@ export const settings = {
 		</p>
 	),
 	icon: renderMaterialIcon(
-		<path d="M23 16v2h-3v3h-2v-3h-3v-2h3v-3h2v3h3zM20 2v9h-4v3h-3v4H4c-1.1 0-2-.9-2-2V2h18zM8 13v-1H4v1h4zm3-3H4v1h7v-1zm0-2H4v1h7V8zm7-4H4v2h14V4z" />
+		<Path d="M23 16v2h-3v3h-2v-3h-3v-2h3v-3h2v3h3zM20 2v9h-4v3h-3v4H4c-1.1 0-2-.9-2-2V2h18zM8 13v-1H4v1h4zm3-3H4v1h7v-1zm0-2H4v1h7V8zm7-4H4v2h14V4z" />
 	),
 	category: 'jetpack',
 
diff --git a/client/gutenberg/extensions/subscriptions/save.jsx b/client/gutenberg/extensions/subscriptions/save.jsx
index c9aca8c5d6bea..80702d43276cb 100644
--- a/client/gutenberg/extensions/subscriptions/save.jsx
+++ b/client/gutenberg/extensions/subscriptions/save.jsx
@@ -9,6 +9,6 @@ export default function Save( { attributes } ) {
 	const { show_subscribers_total } = attributes;
 	return (
 		<RawHTML
-		>{ `[jetpack_subscription_form title="" subscribe_text="" show_subscribers_total="${ show_subscribers_total }"]` }</RawHTML>
+		>{ `[jetpack_subscription_form show_subscribers_total="${ show_subscribers_total }"]` }</RawHTML>
 	);
 }

From 51bed961432753c434b0a31efc65033843c201b2 Mon Sep 17 00:00:00 2001
From: Michael Turk <turk.michael@gmail.com>
Date: Thu, 13 Dec 2018 15:19:11 -0500
Subject: [PATCH 04/11] Adding shortcode attribute to suppress parts of
 subscription shortcode that aren't in design

---
 client/gutenberg/extensions/subscriptions/save.jsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/client/gutenberg/extensions/subscriptions/save.jsx b/client/gutenberg/extensions/subscriptions/save.jsx
index 80702d43276cb..f82a930234a60 100644
--- a/client/gutenberg/extensions/subscriptions/save.jsx
+++ b/client/gutenberg/extensions/subscriptions/save.jsx
@@ -9,6 +9,6 @@ export default function Save( { attributes } ) {
 	const { show_subscribers_total } = attributes;
 	return (
 		<RawHTML
-		>{ `[jetpack_subscription_form show_subscribers_total="${ show_subscribers_total }"]` }</RawHTML>
+		>{ `[jetpack_subscription_form show_subscribers_total="${ show_subscribers_total }" show_only_email_and_button="true"]` }</RawHTML>
 	);
 }

From a8533dd654e397877af6e28b7d5de31b66b362c6 Mon Sep 17 00:00:00 2001
From: Michael Turk <turk.michael@gmail.com>
Date: Fri, 14 Dec 2018 11:05:06 -0500
Subject: [PATCH 05/11] Moving initial fetch of subscriber count to lifecycle
 method, changing attributes to use camelcase for consistency

---
 .../extensions/subscriptions/edit.jsx         | 24 ++++++++++---------
 .../extensions/subscriptions/index.js         |  8 +++----
 .../extensions/subscriptions/save.jsx         |  4 ++--
 3 files changed, 19 insertions(+), 17 deletions(-)

diff --git a/client/gutenberg/extensions/subscriptions/edit.jsx b/client/gutenberg/extensions/subscriptions/edit.jsx
index 4c266a533921e..ba3c6b416950e 100644
--- a/client/gutenberg/extensions/subscriptions/edit.jsx
+++ b/client/gutenberg/extensions/subscriptions/edit.jsx
@@ -14,24 +14,26 @@ import { sprintf } from '@wordpress/i18n/build/index';
 import apiFetch from '@wordpress/api-fetch';
 
 class SubscriptionEdit extends Component {
-	render() {
-		const { attributes, className, isSelected, setAttributes } = this.props;
-		const { subscribe_placeholder, show_subscribers_total, subscriber_count_string } = attributes;
-
+	componentDidMount() {
 		// Get the subscriber count so it is available right away if the user toggles the setting
 		this.get_subscriber_count();
+	}
+
+	render() {
+		const { attributes, className, isSelected, setAttributes } = this.props;
+		const { subscribePlaceholder, showSubscribersTotal, subscriberCountString } = attributes;
 
 		if ( isSelected ) {
 			return (
 				<div className={ className } role="form">
 					<ToggleControl
 						label={ __( 'Show total subscribers' ) }
-						checked={ show_subscribers_total }
+						checked={ showSubscribersTotal }
 						onChange={ () => {
-							setAttributes( { show_subscribers_total: ! show_subscribers_total } );
+							setAttributes( { showSubscribersTotal: ! showSubscribersTotal } );
 						} }
 					/>
-					<TextControl placeholder={ subscribe_placeholder } required onChange={ () => {} } />
+					<TextControl placeholder={ subscribePlaceholder } required onChange={ () => {} } />
 					<Button type="button" isDefault>
 						{ __( 'Subscribe' ) }
 					</Button>
@@ -41,8 +43,8 @@ class SubscriptionEdit extends Component {
 
 		return (
 			<div className={ className } role="form">
-				{ show_subscribers_total && <p role="heading">{ subscriber_count_string }</p> }
-				<TextControl placeholder={ subscribe_placeholder } />
+				{ showSubscribersTotal && <p role="heading">{ subscriberCountString }</p> }
+				<TextControl placeholder={ subscribePlaceholder } />
 				<Button type="button" isDefault>
 					{ __( 'Subscribe' ) }
 				</Button>
@@ -56,11 +58,11 @@ class SubscriptionEdit extends Component {
 		apiFetch( { path: '/wpcom/v2/subscribers/count' } ).then( count => {
 			if ( 1 === count ) {
 				setAttributes( {
-					subscriber_count_string: sprintf( __( 'Join %s other subscriber' ), count.count ),
+					subscriberCountString: sprintf( __( 'Join %s other subscriber' ), count.count ),
 				} );
 			} else {
 				setAttributes( {
-					subscriber_count_string: sprintf( __( 'Join %s other subscribers' ), count.count ),
+					subscriberCountString: sprintf( __( 'Join %s other subscribers' ), count.count ),
 				} );
 			}
 		} );
diff --git a/client/gutenberg/extensions/subscriptions/index.js b/client/gutenberg/extensions/subscriptions/index.js
index 472fae4f65747..a4fa353ceabaa 100644
--- a/client/gutenberg/extensions/subscriptions/index.js
+++ b/client/gutenberg/extensions/subscriptions/index.js
@@ -33,10 +33,10 @@ export const settings = {
 	keywords: [ __( 'subscribe' ), __( 'join' ), __( 'follow' ) ],
 
 	attributes: {
-		subscriber_count_string: { type: 'string', default: '' },
-		subscribe_placeholder: { type: 'string', default: 'Email Address' },
-		subscribe_button: { type: 'string', default: 'Subscribe' },
-		show_subscribers_total: { type: 'boolean', default: false },
+		subscriberCountString: { type: 'string', default: '' },
+		subscribePlaceholder: { type: 'string', default: 'Email Address' },
+		subscribeButton: { type: 'string', default: 'Subscribe' },
+		showSubscribersTotal: { type: 'boolean', default: false },
 	},
 	edit,
 	save,
diff --git a/client/gutenberg/extensions/subscriptions/save.jsx b/client/gutenberg/extensions/subscriptions/save.jsx
index f82a930234a60..9bfdf9ab3bed2 100644
--- a/client/gutenberg/extensions/subscriptions/save.jsx
+++ b/client/gutenberg/extensions/subscriptions/save.jsx
@@ -6,9 +6,9 @@
 import { RawHTML } from '@wordpress/element';
 
 export default function Save( { attributes } ) {
-	const { show_subscribers_total } = attributes;
+	const { showSubscribersTotal } = attributes;
 	return (
 		<RawHTML
-		>{ `[jetpack_subscription_form show_subscribers_total="${ show_subscribers_total }" show_only_email_and_button="true"]` }</RawHTML>
+		>{ `[jetpack_subscription_form show_subscribers_total="${ showSubscribersTotal }" show_only_email_and_button="true"]` }</RawHTML>
 	);
 }

From 5c0c43a17d1e46c960261aa2dc2612f98011ebcf Mon Sep 17 00:00:00 2001
From: Michael Turk <turk.michael@gmail.com>
Date: Fri, 14 Dec 2018 11:20:57 -0500
Subject: [PATCH 06/11] Removing unnecessary comments/pragma

---
 client/gutenberg/extensions/subscriptions/index.js | 7 -------
 1 file changed, 7 deletions(-)

diff --git a/client/gutenberg/extensions/subscriptions/index.js b/client/gutenberg/extensions/subscriptions/index.js
index a4fa353ceabaa..af41fc41709cc 100644
--- a/client/gutenberg/extensions/subscriptions/index.js
+++ b/client/gutenberg/extensions/subscriptions/index.js
@@ -1,13 +1,6 @@
-/** @format */
-
-/**
- * External dependencies
- */
-
 /**
  * Internal dependencies
  */
-//import './editor.scss';
 import edit from './edit';
 import save from './save';
 import { __ } from 'gutenberg/extensions/presets/jetpack/utils/i18n';

From 7e0e94c9080fbc2daf8487bff97412fa68cb7d1a Mon Sep 17 00:00:00 2001
From: Michael Turk <turk.michael@gmail.com>
Date: Fri, 14 Dec 2018 13:45:00 -0500
Subject: [PATCH 07/11] Moved subscriber count string from attribute to state,
 added error handling for count api response, fixed single subscriber string

---
 .../extensions/subscriptions/edit.jsx         | 21 ++++++++++++-------
 .../extensions/subscriptions/index.js         |  1 -
 2 files changed, 14 insertions(+), 8 deletions(-)

diff --git a/client/gutenberg/extensions/subscriptions/edit.jsx b/client/gutenberg/extensions/subscriptions/edit.jsx
index ba3c6b416950e..f19d189a69300 100644
--- a/client/gutenberg/extensions/subscriptions/edit.jsx
+++ b/client/gutenberg/extensions/subscriptions/edit.jsx
@@ -14,6 +14,10 @@ import { sprintf } from '@wordpress/i18n/build/index';
 import apiFetch from '@wordpress/api-fetch';
 
 class SubscriptionEdit extends Component {
+	state = {
+		subscriberCountString: '',
+	};
+
 	componentDidMount() {
 		// Get the subscriber count so it is available right away if the user toggles the setting
 		this.get_subscriber_count();
@@ -21,7 +25,7 @@ class SubscriptionEdit extends Component {
 
 	render() {
 		const { attributes, className, isSelected, setAttributes } = this.props;
-		const { subscribePlaceholder, showSubscribersTotal, subscriberCountString } = attributes;
+		const { subscribePlaceholder, showSubscribersTotal } = attributes;
 
 		if ( isSelected ) {
 			return (
@@ -43,7 +47,7 @@ class SubscriptionEdit extends Component {
 
 		return (
 			<div className={ className } role="form">
-				{ showSubscribersTotal && <p role="heading">{ subscriberCountString }</p> }
+				{ showSubscribersTotal && <p role="heading">{ this.state.subscriberCountString }</p> }
 				<TextControl placeholder={ subscribePlaceholder } />
 				<Button type="button" isDefault>
 					{ __( 'Subscribe' ) }
@@ -53,15 +57,18 @@ class SubscriptionEdit extends Component {
 	}
 
 	get_subscriber_count() {
-		const { setAttributes } = this.props;
-
 		apiFetch( { path: '/wpcom/v2/subscribers/count' } ).then( count => {
-			if ( 1 === count ) {
-				setAttributes( {
+			// Handle error condition
+			if ( ! count.hasOwnProperty( 'count' ) ) {
+				this.setState( {
+					subscriberCountString: sprintf( __( 'Subscriber count unavailable' ) ),
+				} );
+			} else if ( 1 === count.count ) {
+				this.setState( {
 					subscriberCountString: sprintf( __( 'Join %s other subscriber' ), count.count ),
 				} );
 			} else {
-				setAttributes( {
+				this.setState( {
 					subscriberCountString: sprintf( __( 'Join %s other subscribers' ), count.count ),
 				} );
 			}
diff --git a/client/gutenberg/extensions/subscriptions/index.js b/client/gutenberg/extensions/subscriptions/index.js
index af41fc41709cc..5d691156d8706 100644
--- a/client/gutenberg/extensions/subscriptions/index.js
+++ b/client/gutenberg/extensions/subscriptions/index.js
@@ -26,7 +26,6 @@ export const settings = {
 	keywords: [ __( 'subscribe' ), __( 'join' ), __( 'follow' ) ],
 
 	attributes: {
-		subscriberCountString: { type: 'string', default: '' },
 		subscribePlaceholder: { type: 'string', default: 'Email Address' },
 		subscribeButton: { type: 'string', default: 'Subscribe' },
 		showSubscribersTotal: { type: 'boolean', default: false },

From 6a9072b7460d52dc760c0a1063b76333dcd96de4 Mon Sep 17 00:00:00 2001
From: Michael Turk <turk.michael@gmail.com>
Date: Fri, 14 Dec 2018 14:14:03 -0500
Subject: [PATCH 08/11] alphabetized imports, used _n instead of if to build
 count string, removed unnecessary pragma

---
 client/gutenberg/extensions/subscriptions/edit.jsx | 13 ++++++-------
 client/gutenberg/extensions/subscriptions/save.jsx |  2 --
 2 files changed, 6 insertions(+), 9 deletions(-)

diff --git a/client/gutenberg/extensions/subscriptions/edit.jsx b/client/gutenberg/extensions/subscriptions/edit.jsx
index f19d189a69300..3cc2fbe8eece9 100644
--- a/client/gutenberg/extensions/subscriptions/edit.jsx
+++ b/client/gutenberg/extensions/subscriptions/edit.jsx
@@ -4,14 +4,14 @@
  * External dependencies
  */
 import { Component } from '@wordpress/element';
-import { TextControl, Button, ToggleControl } from '@wordpress/components';
+import { Button, TextControl, ToggleControl } from '@wordpress/components';
 
 /**
  * Internal dependencies
  */
 import { __ } from 'gutenberg/extensions/presets/jetpack/utils/i18n';
-import { sprintf } from '@wordpress/i18n/build/index';
 import apiFetch from '@wordpress/api-fetch';
+import { sprintf, _n } from '@wordpress/i18n';
 
 class SubscriptionEdit extends Component {
 	state = {
@@ -63,13 +63,12 @@ class SubscriptionEdit extends Component {
 				this.setState( {
 					subscriberCountString: sprintf( __( 'Subscriber count unavailable' ) ),
 				} );
-			} else if ( 1 === count.count ) {
-				this.setState( {
-					subscriberCountString: sprintf( __( 'Join %s other subscriber' ), count.count ),
-				} );
 			} else {
 				this.setState( {
-					subscriberCountString: sprintf( __( 'Join %s other subscribers' ), count.count ),
+					subscriberCountString: sprintf(
+						_n( 'Join %s other subscriber', 'Join %s other subscribers', count.count ),
+						count.count
+					),
 				} );
 			}
 		} );
diff --git a/client/gutenberg/extensions/subscriptions/save.jsx b/client/gutenberg/extensions/subscriptions/save.jsx
index 9bfdf9ab3bed2..78f0108d08647 100644
--- a/client/gutenberg/extensions/subscriptions/save.jsx
+++ b/client/gutenberg/extensions/subscriptions/save.jsx
@@ -1,5 +1,3 @@
-/** @format */
-
 /**
  * External dependencies
  */

From 3442d661ee85922a66a2d306d3f8fcd82da9c3d5 Mon Sep 17 00:00:00 2001
From: Michael Turk <turk.michael@gmail.com>
Date: Fri, 14 Dec 2018 14:36:28 -0500
Subject: [PATCH 09/11] Added missing translations, removed unnecessary sprintf
 call

---
 client/gutenberg/extensions/subscriptions/edit.jsx | 2 +-
 client/gutenberg/extensions/subscriptions/index.js | 4 ++--
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/client/gutenberg/extensions/subscriptions/edit.jsx b/client/gutenberg/extensions/subscriptions/edit.jsx
index 3cc2fbe8eece9..8fa7afed7fa40 100644
--- a/client/gutenberg/extensions/subscriptions/edit.jsx
+++ b/client/gutenberg/extensions/subscriptions/edit.jsx
@@ -61,7 +61,7 @@ class SubscriptionEdit extends Component {
 			// Handle error condition
 			if ( ! count.hasOwnProperty( 'count' ) ) {
 				this.setState( {
-					subscriberCountString: sprintf( __( 'Subscriber count unavailable' ) ),
+					subscriberCountString: __( 'Subscriber count unavailable' ),
 				} );
 			} else {
 				this.setState( {
diff --git a/client/gutenberg/extensions/subscriptions/index.js b/client/gutenberg/extensions/subscriptions/index.js
index 5d691156d8706..55679f97374cf 100644
--- a/client/gutenberg/extensions/subscriptions/index.js
+++ b/client/gutenberg/extensions/subscriptions/index.js
@@ -26,8 +26,8 @@ export const settings = {
 	keywords: [ __( 'subscribe' ), __( 'join' ), __( 'follow' ) ],
 
 	attributes: {
-		subscribePlaceholder: { type: 'string', default: 'Email Address' },
-		subscribeButton: { type: 'string', default: 'Subscribe' },
+		subscribePlaceholder: { type: 'string', default: __( 'Email Address' ) },
+		subscribeButton: { type: 'string', default: __( 'Subscribe' ) },
 		showSubscribersTotal: { type: 'boolean', default: false },
 	},
 	edit,

From b0768d4371f6dc937f9d7c0383bee67ad32a24b8 Mon Sep 17 00:00:00 2001
From: Michael Turk <turk.michael@gmail.com>
Date: Fri, 14 Dec 2018 15:59:11 -0500
Subject: [PATCH 10/11] Make email field uneditable

---
 client/gutenberg/extensions/subscriptions/edit.jsx | 7 ++++++-
 1 file changed, 6 insertions(+), 1 deletion(-)

diff --git a/client/gutenberg/extensions/subscriptions/edit.jsx b/client/gutenberg/extensions/subscriptions/edit.jsx
index 8fa7afed7fa40..41dbea13679fb 100644
--- a/client/gutenberg/extensions/subscriptions/edit.jsx
+++ b/client/gutenberg/extensions/subscriptions/edit.jsx
@@ -37,7 +37,12 @@ class SubscriptionEdit extends Component {
 							setAttributes( { showSubscribersTotal: ! showSubscribersTotal } );
 						} }
 					/>
-					<TextControl placeholder={ subscribePlaceholder } required onChange={ () => {} } />
+					<TextControl
+						placeholder={ subscribePlaceholder }
+						required
+						disabled={ true }
+						onChange={ () => {} }
+					/>
 					<Button type="button" isDefault>
 						{ __( 'Subscribe' ) }
 					</Button>

From 15b9ae45bb3778c81825a71b852326ca3502dd51 Mon Sep 17 00:00:00 2001
From: Michael Turk <turk.michael@gmail.com>
Date: Fri, 14 Dec 2018 16:38:34 -0500
Subject: [PATCH 11/11] removing unnecessary required attribute

---
 client/gutenberg/extensions/subscriptions/edit.jsx | 1 -
 1 file changed, 1 deletion(-)

diff --git a/client/gutenberg/extensions/subscriptions/edit.jsx b/client/gutenberg/extensions/subscriptions/edit.jsx
index 41dbea13679fb..a3b7d69458c04 100644
--- a/client/gutenberg/extensions/subscriptions/edit.jsx
+++ b/client/gutenberg/extensions/subscriptions/edit.jsx
@@ -39,7 +39,6 @@ class SubscriptionEdit extends Component {
 					/>
 					<TextControl
 						placeholder={ subscribePlaceholder }
-						required
 						disabled={ true }
 						onChange={ () => {} }
 					/>