Merge pull request #455 from lblod/lmb-182-can-modify-custom-field

Lmb 182  | can modify custom field

app/components/editable-form.hbs

@@ -6,11 +6,27 @@
     @onSave={{@onSave}}
     @formInitialized={{@formInitialized}}
     @customHistoryMessage={{@customHistoryMessage}}
+    @buildMetaTtl={{@buildMetaTtl}}
+    @saveTitle={{@saveTitle}}
   >
     {{#if this.editableFormsEnabled}}
-      <GenerateCustomFieldButton
+      <AuButton
+        @skin="link"
+        @icon="plus"
+        {{on "click" (fn (mut this.showModal) true)}}
+        class="au-u-padding-left-none au-u-margin-bottom"
+      >
+        Voeg een veld toe
+      </AuButton>
+
+      {{yield}}
+
+      <RdfInputFields::CrudCustomFieldModal
+        @isCreating={{true}}
+        @showModal={{this.showModal}}
+        @onCloseModal={{this.onFormUpdate}}
         @form={{this.currentForm}}
-        @onUpdate={{this.onFormUpdate}}
+        @field={{@field}}
       />
     {{/if}}
     {{yield}}

app/components/editable-form.js

@@ -1,7 +1,9 @@
 import Component from '@glimmer/component';
+
 import { action } from '@ember/object';
 import { tracked } from '@glimmer/tracking';
 import { service } from '@ember/service';
+
 import { provide } from 'ember-provide-consume-context';
 
 export default class EditableFormComponent extends Component {
@@ -12,6 +14,8 @@ export default class EditableFormComponent extends Component {
   @service semanticFormRepository;
   @service features;
 
+  @tracked showModal;
+
   constructor() {
     super(...arguments);
     this.baseFormId = this.args.form.id;
@@ -27,6 +31,7 @@ export default class EditableFormComponent extends Component {
     );
     this.currentForm = form;
     this.loading = false;
+    this.showModal = false;
   }
 
   get editableFormsEnabled() {
@@ -38,4 +43,9 @@ export default class EditableFormComponent extends Component {
   onFormUpdate() {
     this.updateForm();
   }
+
+  @provide('form-definition')
+  get formDefinition() {
+    return this.currentForm;
+  }
 }