Save form selection

[MAILPOET-1798]

assets/js/src/post_editor_block/edit.jsx

@@ -1,18 +1,26 @@
 /* eslint-disable react/react-in-jsx-scope */
-const wp = window.wp;
+import PropTypes from 'prop-types';
-const { useState } = wp.element;
 
 const allForms = window.mailpoet_forms;
 
-function Edit() {
+function Edit({ attributes, setAttributes }) {
   function displayFormsSelect() {
     if (!Array.isArray(allForms)) return null;
     if (allForms.length === 0) return null;
     return (
-      <select>
+      <select
+        onChange={(event) => {
+          setAttributes({
+            selectedForm: parseInt(event.target.value, 10),
+          });
+        }}
+        defaultValue={attributes.selectedForm}
+      >
         <option value="" disabled selected>Select a MailPoet form</option>
         {allForms.map((form) => (
-          <option value={form.id}>{form.name}</option>
+          <option value={form.id}>
+            {form.name}
+          </option>
         ))}
       </select>
     );
@@ -26,4 +34,11 @@ function Edit() {
   );
 }
 
+Edit.propTypes = {
+  attributes: PropTypes.shape({
+    selectedForm: PropTypes.number,
+  }).isRequired,
+  setAttributes: PropTypes.func.isRequired,
+};
+
 export default Edit;

assets/js/src/post_editor_block/form_block.jsx

@@ -9,6 +9,12 @@ registerBlockType('mailpoet/form-block', {
   icon: Icon,
   category: 'widgets',
   example: {},
+  attributes: {
+    selectedForm: {
+      type: 'number',
+      default: null,
+    },
+  },
   edit: Edit,
   save() {
     return null;