diff --git a/src/WebformBuilder.js b/src/WebformBuilder.js
index b7df181d86..461e4559bd 100644
--- a/src/WebformBuilder.js
+++ b/src/WebformBuilder.js
@@ -1588,8 +1588,15 @@ export default class WebformBuilder extends Component {
           }
         }
 
+        // If the edit form has any nested form inside, we get a partial data (nested form's data) in the
+        // event.data property
+        let editFormData;
+        if (event.changed.instance && event.changed.instance.root && event.changed.instance.root.id !== this.editForm.id) {
+          editFormData = this.editForm.data;
+        }
+
         // Update the component.
-        this.updateComponent(event.data.componentJson || event.data, event.changed);
+        this.updateComponent(event.data.componentJson || editFormData || event.data, event.changed);
       }
     });
 
diff --git a/src/addons/index.js b/src/addons/index.js
index 1555897676..fb579eb0c7 100644
--- a/src/addons/index.js
+++ b/src/addons/index.js
@@ -7,7 +7,11 @@ export const editForms = [
   key: 'settings',
   display: 'form',
   input: true,
-  components,
+  components: components.map((comp) => {
+    comp.tableView = false;
+    return comp;
+  }),
+  tableView: false,
   defaultValue: {
     data: defaultSettings
   },
diff --git a/src/components/_classes/component/editForm/Component.edit.addons.js b/src/components/_classes/component/editForm/Component.edit.addons.js
index b3ac3f7da1..7d63552572 100644
--- a/src/components/_classes/component/editForm/Component.edit.addons.js
+++ b/src/components/_classes/component/editForm/Component.edit.addons.js
@@ -10,6 +10,33 @@ export default [
     input: true,
     key: 'addons',
     label: 'Addons',
+    templates: {
+      // eslint-disable-next-line quotes
+      header: `<div class="row">
+                <div class="col-6">{{ t(components[0].label) }}</div>
+                <div class="col-4">Settings</div>
+              </div>`,
+      // eslint-disable-next-line quotes
+      row: `<div class="row">
+              <div class="col-6">
+                {{ row.name.label }}
+              </div>
+              <div class="col-4 text-muted">
+                Click Edit to see addon's settings
+              </div>
+
+              {% if (!instance.options.readOnly && !instance.disabled) { %}
+                <div class="col-2">
+                  <div class="btn-group pull-right">
+                    <button class="btn btn-default btn-light btn-sm editRow"><i class="{{ iconClass('edit') }}"></i></button>
+                    {% if (!instance.hasRemoveButtons || instance.hasRemoveButtons()) { %}
+                      <button class="btn btn-danger btn-sm removeRow"><i class="{{ iconClass('trash') }}"></i></button>
+                    {% } %}
+                  </div>
+                </div>
+              {% } %}
+            </div>`,
+    },
     components: [
       {
         label: 'Name',
@@ -32,7 +59,10 @@ export default [
             }));
           },
         },
-        input: true
+        input: true,
+        validate: {
+          required: true,
+        },
       },
       ...editForms,
     ]
diff --git a/src/components/file/fixtures/comp3.js b/src/components/file/fixtures/comp3.js
new file mode 100644
index 0000000000..3e6cf953c1
--- /dev/null
+++ b/src/components/file/fixtures/comp3.js
@@ -0,0 +1,29 @@
+export default {
+  type: 'form',
+  display: 'form',
+  components: [
+    {
+      label: 'Upload',
+      tableView: false,
+      storage: 'base64',
+      webcam: false,
+      fileTypes: [
+        {
+          label: '',
+          value: ''
+        }
+      ],
+      key: 'file',
+      type: 'file',
+      input: true
+    },
+    {
+      type: 'button',
+      label: 'Submit',
+      key: 'submit',
+      disableOnInvalid: true,
+      input: true,
+      tableView: false
+    }
+  ],
+};