diff --git a/src/render.php b/src/render.php
index fe508e3..80a69ac 100644
--- a/src/render.php
+++ b/src/render.php
@@ -80,6 +80,10 @@
 	],
 ];
 
+wp_interactivity_state( 'booking-form', [
+	'title' => __( 'Booking Form Submission', 'booking-form' );
+]);
+
 ?>
 
 <div
diff --git a/src/view.js b/src/view.js
index eb3aae7..bd9059c 100644
--- a/src/view.js
+++ b/src/view.js
@@ -6,12 +6,9 @@ import { store, getContext } from '@wordpress/interactivity';
 /**
  * Non-module dependencies
  */
-const {
-	apiFetch,
-	i18n: { __ },
-} = wp;
+const { apiFetch } = wp;
 
-const { actions } = store( 'booking-form', {
+const { state, actions } = store( 'booking-form', {
 	actions: {
 		next( e ) {
 			e.preventDefault();
@@ -52,7 +49,6 @@ const { actions } = store( 'booking-form', {
 			const context = getContext();
 			context.submitting = true;
 
-			const title = __( 'Booking Form Submission', 'booking-form' );
 			const content = actions.reviewFields().reduce( ( acc, field ) => {
 				return `${ acc }<p><strong>${ field.label }</strong>: ${ field.value }</p>`;
 			}, '' );
@@ -62,7 +58,7 @@ const { actions } = store( 'booking-form', {
 					path: '/booking-form/v1/booking',
 					method: 'POST',
 					data: {
-						title,
+						title: state.title,
 						content,
 					},
 				} );